Adaptivecards: [MSTeams] [See more, see less options are no longer visible in Teams when an adaptive card length is high]

Created on 13 Aug 2020  路  19Comments  路  Source: microsoft/AdaptiveCards

When the adaptive card posted on Teams had huge length, earlier the Teams used to collapse the card and give see more and see less options to expand and collapse the card, so that the card is not consuming a lot of space in the channel/chat.
This option is now no longer visible. PFA snapshots for the same -

image

image

Please let us know why this is the case and if you are planning to fix this. If no, can you please tell how can one implement see more and see less options for a particular section in the adaptive card. I checked on this and couldn't find any way of achieving this (The only workaround around getting this functionality is to add buttons and on clicking the button we can see more and see less, but there will be no ... (3 dots) representing continuation, so it will not be a good user experience).

Please help us in getting this fixed.

Bug MSTeams-Developer-Support MsftTeams-Integration Needs

Most helpful comment

We could reproduce the issue and raised the bug.

All 19 comments

@siduppal / @Wajeed-msft this is another issue that appears to be related to Teams host.. Could you please take a first pass ? Thanks

We could reproduce the issue and raised the bug.

Hi @DivyankaM. We have acknowledged this issue report. Please continue to follow this issue for updates/progress/questions.

Thanks @VaraPrasad-MSFT ; Can you put in a link to teh corresponding Teams bug here so the customer can track it and we can go ahead and close this issue out? Thanks

@VaraPrasad-MSFT : gentle ping here, we are getting customer complaints.

Hi @gauravsaralMs - Checking status of the bug internally. Meanwhile, did you try using Show Card which allows you to expand information. Expense report sample is really great.

Hi @gauravsaralMs - Checking status of the bug internally. Meanwhile, did you try using Show Card which allows you to expand information. Expense report sample is really great.

Thanks @Wajeed-msft , do let us know any update on this issue.
Yes, we are using Show card, but that is a different use case. The ask here is related to a use case where we want to use normal adaptive card and expect team to wrap it up.

@gauravsaralMs - Do you have screenshot of how your card used to look?

@Wajeed-msft : no, we did not have captured anything earlier..
cc: @DivyankaM in case she has any screen capture.

The see more and see less feature works for some cases and doesn't work for others. PFA screenshots -

image

image

cc: @Wajeed-msft @gauravsaralMs

@DivyankaM - Could you please share both the Adaptive Card JSONs? It will help us investigate this further.

@Wajeed-msft The only difference between the two adaptive cards is that the second one has button at the end after the text. For first one, see more and see less options are coming while for second one they are not coming. As per my understanding, this shouldn't be the case since the Teams platform doesn't condense the adaptive card rather the entire message posted is condensed, so it should show similar behavior in all the cases. See the below snapshot for an example, here the text message posted is condensed by Teams in a similar way they condensed the first adaptive card in my last post-

image

cc: @gauravsaralMs @ashokirla

@Wajeed-msft @siduppal Any updates on this? Customers are facing issues due to this - https://github.com/integrations/microsoft-teams/issues/34#issuecomment-705466025

cc: @ashokirla @gauravsaralMs

@DivyankaM - I got confirmation from engineering team that Adaptive Card never supported see-more / see-less option. Could you please attach the Adaptive Card JSON which can be used for repro both the cases which you mentioned in your comment?

Hello @DivyankaM! We need some additional information from you to process this issue. Please see discussion comments above. Thanks!

@Wajeed-msft We are aware that adaptive cards specifically don't support collapse option, however, teams messages do and that's what is mentioned as concern in this issue. The issue that we are talking about here is that adaptive card message is being collapsed in some cases while not in others (where adaptive card contains buttons at the end). - See this comment above - https://github.com/microsoft/AdaptiveCards/issues/4583#issuecomment-694815883

cc: @ashokirla @gauravsaralMs

Thanks @DivyankaM for following up on this issue. A member of our triage crew will re-engage as soon as possible to follow up. Thanks.

JSON of the teams message that gets collapsed -

{
"preview": {
"contentType": "application/vnd.microsoft.card.thumbnail",
"contentUrl": null,
"content": {
"title": "Long Issues text1 #332",
"subtitle": null,
"text": "open | @sanjeev9160 opened this issue on 13 Oct 2020",
"images": [
{
"url": "https://avatars2.githubusercontent.com/u/64134945?v=4",
"alt": null,
"tap": null
}
],
"buttons": null,
"tap": null
},
"name": null,
"thumbnailUrl": null
},
"contentType": "application/vnd.microsoft.card.adaptive",
"content": {
"$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
"type": "AdaptiveCard",
"version": "1.0",
"body": [
{
"type": "Container",
"items": [
{
"type": "TextBlock",
"text": "sanjeev9160/Test",
"wrap": "true"
},
{
"type": "TextBlock",
"text": "Long Issues text1 #332",
"weight": "bolder",
"size": "large",
"wrap": true,
"spacing": "none"
},
{
"type": "TextBlock",
"text": "@sanjeev9160 opened this issue on 13 Oct 2020",
"wrap": true,
"spacing": "small"
},
{
"type": "ColumnSet",
"spacing": "small",
"columns": [
{
"type": "Column",
"width": "auto",
"items": [
{
"size": "small",
"type": "Image",
"url": "https://dimalik1.ngrok.io/static/img/notification-card/issue-opened.png",
"height": "24px"
}
]
}
]
}
]
},
{
"type": "Container",
"separator": true,
"items": [
{
"type": "TextBlock",
"text": "this is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnthis is a issue which in itself is an issue.nnnnnice",
"wrap": true
},
{
"type": "FactSet",
"separator": true,
"facts": [
{
"title": "Assignees:",
"value": "No one",
"isSubtle": "true"
},
{
"title": "Labels:",
"value": "None yet",
"isSubtle": "true"
}
]
}
]
}
]
}
}

JSON of the teams message that is not getting collapsed -

{
"$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
"type": "AdaptiveCard",
"version": "1.0",
"body": [
{
"type": "Container",
"items": [
{
"type": "TextBlock",
"text": "sanjeev9160/Test",
"wrap": true
},
{
"type": "TextBlock",
"text": "Issue opened by @sanjeev9160 on 13 Oct 2020",
"spacing": "none"
},
{
"type": "TextBlock",
"text": "Long Issues text1 #332",
"wrap": "true",
"spacing": "small",
"weight": "bolder",
"size": "large"
},
{
"type": "ColumnSet",
"spacing": "small",
"columns": [
{
"type": "Column",
"width": "auto",
"items": [
{
"size": "small",
"type": "Image",
"url": "https://sanjeev9160.ngrok.io/static/img/notification-card/issue-opened.png",
"height": "24px"
}
]
}
]
}
]
},
{
"type": "Container",
"separator":true,
"items": [
{
"type": "TextBlock",
"text": "this is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\nthis is a issue which in itself is an issue.\n\n\n\nnice",
"wrap": true
},
{
"type": "FactSet",
"separator":true,
"facts": [
{
"title": "Assignees:",
"value": "No one",
"isSubtle": "true"
}
,
{
"title": "Labels:",
"value": "None yet",
"isSubtle": "true"
}
]
}
,
{
"type": "ActionSet",
"actions": [
{
"type": "Action.ShowCard",
"title": "Comment",
"style": "default",
"card": {
"type": "AdaptiveCard",
"body": [
{
"type": "Input.Text",
"isMultiline": true,
"placeholder": "Leave a comment here...",
"id": "commentText"
},
{
"type": "ActionSet",
"actions": [
{
"type": "Action.Submit",
"title": "Submit",
"data": {
"ownerId": "64134945",
"owner": "sanjeev9160",
"repoId": "260383140",
"repo": "Test",
"issueNumber":"332",
"state": "open",
"actionType":"issueComment"
}
}
]
}
]
}
}
,
{
"type": "Action.ShowCard",
"title": "Close issue",
"style": "default",
"card": {
"type": "AdaptiveCard",
"body": [
{
"type": "Input.Text",
"isMultiline": true,
"placeholder": "Leave a comment here...",
"id": "issueCommentText"
},
{
"type": "ActionSet",
"actions": [
{
"type": "Action.Submit",
"title": "Submit",
"data": {
"ownerId": "64134945",
"owner": "sanjeev9160",
"repoId": "260383140",
"repo": "Test",
"issueNumber":"332",
"state": "open",
"actionType":"changeIssueState"
}
}
]
}
]
}
}
]
}
]
}
]
}

Was this page helpful?
0 / 5 - 0 ratings