MicrosoftDocs / msteams-docs

Source for the Microsoft Teams developer platform documentation.
https://aka.ms/teamsdev
Creative Commons Attribution 4.0 International
288 stars 511 forks source link

Adaptive cards not rendering in iOS if "Action.ShowCard" is repeated for array items #7868

Open Cameramorphic opened 1 year ago

Cameramorphic commented 1 year ago

I'm building a Teams bot that responds with an AdaptiveCard containing a list of items and I'd like to add quick actions for each of the list items. If I put an ActionSet with Action.ShowCard into the container that is repeated by the bound data array, the card doesn't render on iOS. It does render as expected in the desktop (Linux) and web client. If I add the same ActionSet at the end of the card, or if I replace the Action.ShowCard with Action.OpenUrl in the repeated container, it works as expected.

If I inspect the invisible card in iOS it shows the following error:

Errors
    Err domain:ACRParseErrorDomain code:5 userInfo:{
        error = "<Scrubbed Error Info>";
    }
SDK Version
    2.8.7

Also, confusingly the AdaptiveCard version in the shown card payload is "1.2", even though I'm using "1.4".

Below is a simplified example of the card:

{
    "type": "AdaptiveCard",
    "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
    "version": "1.4",
    "body": [
        {
            "type": "TextBlock",
            "text": "Card Title"
        },
        {
            "type": "Container",
            "$data": "${properties}",
            "separator": true,
            "items": [
                {
                    "type": "TextBlock",
                    "text": "${key}: ${value}"
                },
                {
                    "type": "ActionSet",
                    "actions": [
                        {
                            "type": "Action.ShowCard",
                            "title": "Comment",
                            "card": {
                                "type": "AdaptiveCard",
                                "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
                                "body": [
                                    {
                                        "type": "Input.Text",
                                        "id": "commentText",
                                        "label": "Please enter your comment:",
                                        "isMultiline": true,
                                        "isRequired": true,
                                        "errorMessage": "You need to enter a comment to send."
                                    }
                                ],
                                "actions": [
                                    {
                                        "type": "Action.Execute",
                                        "title": "Send",
                                        "verb": "postComment",
                                        "data": {
                                            "key": "${key}",
                                            "action": "postComment"
                                        }
                                    }
                                ]
                            }
                        }
                    ]
                }
            ]
        }
    ]
}

example data:

{
    "properties": [
        {
            "key": "key1",
            "value": "value1"
        },
        {
            "key": "key2",
            "value": "value2"
        }
    ]
}

Versions iOS 16.1.1 (iPhone 12 Pro)

Teams: Version: 4.22.1 Build: 4.22.77.2022223502/1212 (general)

ghost commented 1 year ago

Hi Cameramorphic! Thank you for bringing this issue to our attention. We will investigate and if we require further information we will reach out in one business day. Please use this link to escalate if you don't get replies.

Best regards, Teams Platform

ChetanSharma-msft commented 1 year ago

Hello @Cameramorphic - Thanks for reporting your issue. We will look into it and let you know the updates.

sayali-MSFT commented 1 year ago

@Cameramorphic - We are not able to repro the issue, we have tried with the above manifest, card is rendering successfully in IOS device. IOS Version - 16.2

MicrosoftTeams-image (18) MicrosoftTeams-image (19) PublicTeamVersion

Cameramorphic commented 1 year ago

Thank you for the quick response! I think you didn't exactly reproduce the output I'm having issues with though, it's happens when the Action.ShowCard is repeated by the bound $data. To be sure I also updated to iOS 16.2 but that didn't change anything. By testing various other simplified variants I managed to narrow down the error: -> If the AdaptiveCard contains the ShowCard action with the comment input more than once, it doesn't render.

Cameramorphic commented 1 year ago

I think I found the issue now: The problem seems to be the comment input field inside the nested card that is triggered by Action.ShowCard. If I modify the ids of the Input.Text elements so that they are globally unique in the the entire top-level AdaptiveCard, it renders. This seems to be a bug in the rendering on iOS as I would expect the ids to be scoped by the nested card, after all it does seem to work that way on the desktop and web client. The separate scope is also one of the reasons to use nested cards, because it will only send its own input fields rather than every input there is.

Cameramorphic commented 1 year ago

@sayali-MSFT can you confirm the scoping of nested cards is a bug on iOS? At least I can now work around the problem by adding the index to the id, but I can't just access the input data values directly, I have to do a prefix match on the keys first.

sayali-MSFT commented 1 year ago

@Cameramorphic -We have tried with the below adaptive card as well but both cards are showing properly. As you mention above nested comment input field inside the nested card. Could you please share the card Json with nested card, so that we are try it from our end and raise the bug accordingly.

{
  "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
  "type": "AdaptiveCard",
  "version": "1.0",
  "body": [
    {
      "type": "TextBlock",
      "text": "This card's action will show another card"
    }
  ],
  "actions": [
    {
      "type": "Action.ShowCard",
      "title": "Action.ShowCard",
      "card": {
        "type": "AdaptiveCard",
        "body": [
          {
            "type": "TextBlock",
            "text": "What do you think?"
          }
        ],
        "actions": [
          {
            "type": "Action.Submit",
            "title": "Neat!",
            "data": {
              "neat": "true"
            }
          }
        ]
      }
    }
  ]
}
Cameramorphic commented 1 year ago

@sayali-MSFT As mentioned, the problem starts to appear if the nested card (containing an input) is repeated multiple times. As I found out it is caused by the colliding ids of the Input fields, which shouldn't happen due to the nested card scope (which works fine on desktop and web client):

{
  "type": "AdaptiveCard",
  "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
  "version": "1.4",
  "body": [
    {
      "type": "TextBlock",
      "text": "Item 42"
    },
    {
      "type": "ActionSet",
      "actions": [
        {
          "type": "Action.ShowCard",
          "title": "Comment",
          "card": {
            "type": "AdaptiveCard",
            "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
            "body": [
              {
                "type": "Input.Text",
                "id": "commentText"
              }
            ],
            "actions": [
              {
                "type": "Action.Execute",
                "title": "Send",
                "verb": "postComment",
                "data": {
                  "key": 42
                }
              }
            ]
          }
        }
      ]
    },
    {
      "type": "TextBlock",
      "text": "Item 43",
      "separator": true
    },
    {
      "type": "ActionSet",
      "actions": [
        {
          "type": "Action.ShowCard",
          "title": "Comment",
          "card": {
            "type": "AdaptiveCard",
            "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
            "body": [
              {
                "type": "Input.Text",
                "id": "commentText"
              }
            ],
            "actions": [
              {
                "type": "Action.Execute",
                "title": "Send",
                "verb": "postComment",
                "data": {
                  "key": 43
                }
              }
            ]
          }
        }
      ]
    }
  ]
}
sayali-MSFT commented 1 year ago

@Cameramorphic - We are able to repro that issue, we have raised bug for the same and concerned team is looking into it. For workaround you can use unique ids only.

We will inform you once we get any update.