AdaptiveCard not rendering bullet list if the text is from variable

Question

I have a toggle button on my card that shows on the bottom another section with some text info and here I want to show bullet list with 2 items.

        {
            "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
            "type": "AdaptiveCard",
            "version": "1.5",
            "body": [
                {
                    "type": "ColumnSet",
                    "columns": [
                        {
            
    
                    "type": "Column",
                        "items": [
                            {
                                "type": "ActionSet",
                                "actions": [
                                    {
                                        "type": "Action.ToggleVisibility",
                                        "title": "tips",
                                        "tooltip": "show tips",
                                        "targetElements": [
                                            "HelpToggle"
                                        ]
                                    }
                                ]
                            }
                        ],
                        "width": "stretch"
                    }
                ]
            },
            {
                "type": "ColumnSet",
                "columns": [
                    {
                        "type": "Column",
                        "width": 65,
                        "items": [
                            {
                                "type": "TextBlock",
                                "text": "EXAMPLE CARD TITLE",
                                "wrap": true,
                                "size": "ExtraLarge",
                                "horizontalAlignment": "Left",
                                "weight": "Bolder",
                                "spacing": "None"
                            }
                        ],
                        "verticalContentAlignment": "Center",
                        "spacing": "ExtraLarge"
                    }
                ]
            },
            {
                "type": "ColumnSet",
                "columns": [
                    {
                        "type": "Column",
                        "width": "stretch",
                        "items": [
                            {
                                "type": "ColumnSet"
                            }
                        ]
                    }
                ]
            },
            {
                "type": "Container",
                "items": [
                    {
                        "type": "TextBlock",
                        "text": "${help}",
                        "wrap": true
                    }
                ],
                "style": "accent",
                "bleed": true,
                "spacing": "None",
                "isVisible": false,
                "id": "HelpToggle"
            }
        ]
    }

previewing this card in the adaptivecard designer is showing correctly:

The problem is when I try to render the bullet list on my card in teams, only the bold markdown is rendered and the bullet markdown is ignored:

This is my function that renders the card:

    async createTipsCard(context, tipsText) {
        const template = new ACData.Template(tipsCard);
        const temp = template.expand({
            $root: {           
                // help: tipsText
                help: "Bullet list with tips: \r- **Tip 1**: Dummy text for tip #1. \r- **Tip 2**: Dummy text for tip #2."
            }
        });   
        await context.sendActivity({ text: '', attachments: [CardFactory.adaptiveCard(temp)] });       
    }

tipsText - this parameter that I'm sending in the function is containing the text string i want to render in the toggle section "Bullet list with tips: \r- Tip 1: Dummy text for tip #1. \r- Tip 2: Dummy text for tip #2."

if I provide this text through tipsText variable then the bullets are not rendered in the card, the bullets will be rendered if I provide the text directly as value to the $root.help property

$root: {           
            // help: tipsText
            help: "Bullet list with tips: \r- **Tip 1**: Dummy text for tip #1. \r- **Tip 2**: Dummy text for tip #2." // this way bulleted list is rendered
        }

to summarize: adding text from variable value doesn't render the bullets, while providing the same text directly renders the bullets.

Answer 1

I have tested the output in the Adaptive Card Designer and it appears to be the same as the one you have highlighted. However, there is an issue with the markdown syntax due to an extra "\" being added before "\r". Please ensure that there is no encoding happening to the actual string before it is bound to the Adaptive Card through "tipsText". It is possible that passing the string in a proper encodable format may resolve the issue. This is because string encoding usually occurs, which could be causing the markdown syntax issue. However, direct text may work without any issues.