[Rendering] Filtered ChoiceSets render improperly when two choices have the same title

Target Platforms

Microsoft Teams app as well as website, on both Windows and MacOS.

SDK Version

1.5

Application Name

Microsoft Teams

Problem Description

When an Adaptive Card has a filtered Input.ChoiceSet that has two options with the same titles but different ids, the card rendering in Microsoft Teams accumulates duplicates that don't go away when the card loses focus.

While I agree that in general ChoiceSets would ideally have options with unique titles, this UI quirkiness turns what would normally be just a likely ignored duplicate entry into a confusing and buggy-looking experience.

Steps to reproduce (using the card produced by the sample curl command):

1. Click the "Fruit" field.
2. Type "b"
3. Type backspace
4. Repeat steps (2) and (3) a few times. Note that the duplicated entry "Banana" gets added to the card below the dropdown each time, even though nothing was selected.
5. Click away from the card to see that the duplicates are still shown on the card even when it loses focus.

Screenshots

Card JSON

{
    "type": "AdaptiveCard",
    "version": "1.5",
    "body":
    [
        {
            "size": "large",
            "text": "Pick a Fruit",
            "weight": "bolder",
            "type": "TextBlock"
        },
        {
            "choices":
            [
                {
                    "title": "Apple",
                    "value": "1"
                },
                {
                    "title": "Banana",
                    "value": "2"
                },
                {
                    "title": "Banana",
                    "value": "3"
                },
                {
                    "title": "Pear",
                    "value": "4"
                }
            ],
            "id": "fruit",
            "isRequired": true,
            "label": "Fruit",
            "style": "filtered",
            "type": "Input.ChoiceSet"
        }
    ],
    "actions":
    [
        {
            "data":
            {
                "command": "fruit"
            },
            "title": "Submit",
            "type": "Action.Execute"
        }
    ],
    "$schema": "http://adaptivecards.io/schemas/adaptive-card.json"
}

Sample Code Language

Curl

Sample Code

# The following curl command creates an Adaptive Card with the problematic rendering.
# $TEST_BOT_ID = the Microsoft Teams bot id to test with
# $CONVERSATION_ID = the Microsoft Teams conversation to send the card to
# $TOKEN = the Microsoft token received from https://login.microsoftonline.com/botframework.com/oauth2/v2.0/token
curl -d '{
    "type": "message",
    "timestamp": "2022-07-11T11:35:08.067226Z",
    "from": {
        "id": "$TEST_BOT_ID",
        "properties": {}
    },
    "conversation": {
        "isGroup": false,
        "id": "$CONVERSATION_ID",
        "properties": {}
    },
    "historyDisclosed": false,
    "attachments": [
        {
            "contentType": "application/vnd.microsoft.card.adaptive",
            "content": {
                "type": "AdaptiveCard",
                "version": "1.5",
                "body": [
                    {
                        "size": "large",
                        "text": "Pick a Fruit",
                        "weight": "bolder",
                        "type": "TextBlock"
                    },
                    {
                        "choices": [
                            {
                                "title": "Apple",
                                "value": "1"
                            },
                            {
                                "title": "Banana",
                                "value": "2"
                            },
                            {
                                "title": "Banana",
                                "value": "3"
                            },
                            {
                                "title": "Pear",
                                "value": "4"
                            }
                        ],
                        "id": "fruit",
                        "isRequired": true,
                        "label": "Fruit",
                        "style": "filtered",
                        "type": "Input.ChoiceSet"
                    }
                ],
                "actions": [
                    {
                        "data": {
                            "command": "fruit"
                        },
                        "title": "Submit",
                        "type": "Action.Execute"
                    }
                ],
                "$schema": "http://adaptivecards.io/schemas/adaptive-card.json"
            },
            "properties": {}
        }
    ],
    "entities": [],
    "properties": {}
}' -H 'Content-Type: application/json' -H "Authorization: Bearer $TOKEN" 'https://smba.trafficmanager.net/amer/v3/conversations/$CONVERSATION_ID/activities'

Start by reproducing the issue with the provided Adaptive Card JSON and curl request in Microsoft Teams, focusing on the filtered Input.ChoiceSet renderer. Trace how filtering and focus changes update rendered choices when duplicate titles have different values. Done means typing and clearing a filter no longer accumulates duplicate entries, including after the card loses focus.