MicrosoftDocs / msteams-docs

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

Button can't be clickable when clicking the center of it #11090

Open AmyLi0728 opened 3 months ago

AmyLi0728 commented 3 months ago

Steps to reproduce

Broswer: chrome 111 or 120 card json: { "task": { "value": { "card": { "content": { "type": "AdaptiveCard", "body": [ { "items": [], "id": "empty-container", "separator": false, "type": "Container" }, { "items": [ { "columns": [ { "width": "auto", "items": [ { "horizontalAlignment": null, "size": "small", "style": null, "url": "https://as-prod.asyncgw.teams.microsoft.com/v1/objects/0-ea-d2-06fc8919d449e838b84e439e8f09f726/views/img_preview", "height": "auto", "id": "tile-icon:Manage My Data", "separator": false, "type": "Image" } ], "verticalContentAlignment": "center", "id": "tile-first-column:Manage My Data", "separator": false, "type": "Column" }, { "width": "stretch", "items": [ { "color": null, "horizontalAlignment": null, "isSubtle": false, "maxLines": 0, "size": "medium", "text": "Manage My Data", "weight": "bolder", "wrap": true, "id": "tile-title:Manage My Data", "separator": false, "type": "TextBlock" } ], "verticalContentAlignment": "center", "bleed": true, "id": "tile-second-column:Manage My Data", "separator": false, "type": "Column" }, { "width": "auto", "items": [ { "actions": [ { "data": { "id": "tile-action-data:Manage My Data", "msteams": { "type": "task/fetch" }, "requestType": "command", "namespace": "worktech-ec", "command": "TeamsWebAppEntry", "step": "showECSnackList", "_commandSession": { "userId": "103106" }, "path": "", "_actionTitle": "Manage My Data" }, "iconUrl": "https://as-prod.asyncgw.teams.microsoft.com/v1/objects/0-ea-d9-9540fd54c8c7450b3961dbb2bf42510b/views/img_preview", "id": "tile-submit-action:Manage My Data", "tooltip": "Manage My Data", "type": "Action.Submit" } ], "id": "tile-action-set:Manage My Data", "separator": false, "type": "ActionSet" } ], "id": "tile-third-column:Manage My Data", "separator": false, "type": "Column" } ], "id": "tile-item:Manage My Data", "separator": false, "type": "ColumnSet" } ], "style": "emphasis", "id": "tile-container:Manage My Data", "spacing": "Small", "separator": false, "height": "stretch", "type": "Container" }, { "items": [ { "columns": [ { "width": "auto", "items": [ { "horizontalAlignment": null, "size": "small", "style": null, "url": "https://as-prod.asyncgw.teams.microsoft.com/v1/objects/0-ea-d6-8351b1a9bd9669202105bdddfad613de/views/img_preview", "height": "auto", "id": "tile-icon:Manage My Team", "separator": false, "type": "Image" } ], "verticalContentAlignment": "center", "id": "tile-first-column:Manage My Team", "separator": false, "type": "Column" }, { "width": "stretch", "items": [ { "color": null, "horizontalAlignment": null, "isSubtle": false, "maxLines": 0, "size": "medium", "text": "Manage My Team", "weight": "bolder", "wrap": true, "id": "tile-title:Manage My Team", "separator": false, "type": "TextBlock" } ], "verticalContentAlignment": "center", "bleed": true, "id": "tile-second-column:Manage My Team", "separator": false, "type": "Column" }, { "width": "auto", "items": [ { "actions": [ { "data": { "id": "tile-action-data:Manage My Team", "msteams": { "type": "task/fetch" }, "requestType": "command", "namespace": "worktech-ec", "command": "TeamsWebAppEntry", "step": "showDirectReports", "_commandSession": { "userId": "103106" }, "path": "", "_actionTitle": "Manage My Team" }, "iconUrl": "https://as-prod.asyncgw.teams.microsoft.com/v1/objects/0-ea-d3-604f67c4b09c2e4e2ad97b1d80662924/views/img_preview", "id": "tile-submit-action:Manage My Team", "tooltip": "Manage My Team", "type": "Action.Submit" } ], "id": "tile-action-set:Manage My Team", "separator": false, "type": "ActionSet" } ], "id": "tile-third-column:Manage My Team", "separator": false, "type": "Column" } ], "id": "tile-item:Manage My Team", "separator": false, "type": "ColumnSet" } ], "style": "emphasis", "id": "tile-container:Manage My Team", "spacing": "Small", "separator": false, "height": "stretch", "type": "Container" }, { "items": [ { "columns": [ { "width": "auto", "items": [ { "horizontalAlignment": null, "size": "small", "style": null, "url": "https://as-prod.asyncgw.teams.microsoft.com/v1/objects/0-ea-d3-66e41d257227a4d6f79ea4a44100c02a/views/img_preview", "height": "auto", "id": "tile-icon:Request Feedback", "separator": false, "type": "Image" } ], "verticalContentAlignment": "center", "id": "tile-first-column:Request Feedback", "separator": false, "type": "Column" }, { "width": "stretch", "items": [ { "color": null, "horizontalAlignment": null, "isSubtle": false, "maxLines": 0, "size": "medium", "text": "Request Feedback", "weight": "bolder", "wrap": true, "id": "tile-title:Request Feedback", "separator": false, "type": "TextBlock" } ], "verticalContentAlignment": "center", "bleed": true, "id": "tile-second-column:Request Feedback", "separator": false, "type": "Column" }, { "width": "auto", "items": [ { "actions": [ { "data": { "id": "tile-action-data:Request Feedback", "msteams": { "type": "task/fetch" }, "requestType": "command", "namespace": "worktech-feedback", "command": "RequestFeedback", "step": "requestFeedbackFormStep", "_commandSession": { "userId": "103106" }, "path": "", "_actionTitle": "Request Feedback" }, "iconUrl": "https://as-prod.asyncgw.teams.microsoft.com/v1/objects/0-ea-d10-5a921ea1cba83c33b3baec79412a3dad/views/img_preview", "id": "tile-submit-action:Request Feedback", "tooltip": "Request Feedback", "type": "Action.Submit" } ], "id": "tile-action-set:Request Feedback", "separator": false, "type": "ActionSet" } ], "id": "tile-third-column:Request Feedback", "separator": false, "type": "Column" } ], "id": "tile-item:Request Feedback", "separator": false, "type": "ColumnSet" } ], "style": "emphasis", "id": "tile-container:Request Feedback", "spacing": "Small", "separator": false, "height": "stretch", "type": "Container" }, { "items": [ { "columns": [ { "width": "auto", "items": [ { "horizontalAlignment": null, "size": "small", "style": null, "url": "https://as-prod.asyncgw.teams.microsoft.com/v1/objects/0-ea-d11-62a1771c13f8a4b6333f099a35407914/views/img_preview", "height": "auto", "id": "tile-icon:Give Feedback", "separator": false, "type": "Image" } ], "verticalContentAlignment": "center", "id": "tile-first-column:Give Feedback", "separator": false, "type": "Column" }, { "width": "stretch", "items": [ { "color": null, "horizontalAlignment": null, "isSubtle": false, "maxLines": 0, "size": "medium", "text": "Give Feedback", "weight": "bolder", "wrap": true, "id": "tile-title:Give Feedback", "separator": false, "type": "TextBlock" } ], "verticalContentAlignment": "center", "bleed": true, "id": "tile-second-column:Give Feedback", "separator": false, "type": "Column" }, { "width": "auto", "items": [ { "actions": [ { "data": { "id": "tile-action-data:Give Feedback", "msteams": { "type": "task/fetch" }, "requestType": "command", "namespace": "worktech-feedback", "command": "GiveFeedback", "step": "giveFeedbackFormStep", "_commandSession": { "userId": "103106" }, "path": "", "_actionTitle": "Give Feedback" }, "iconUrl": "https://as-prod.asyncgw.teams.microsoft.com/v1/objects/0-ea-d8-9ae219855c7aa7e8655f7c2fa49df27e/views/img_preview", "id": "tile-submit-action:Give Feedback", "tooltip": "Give Feedback", "type": "Action.Submit" } ], "id": "tile-action-set:Give Feedback", "separator": false, "type": "ActionSet" } ], "id": "tile-third-column:Give Feedback", "separator": false, "type": "Column" } ], "id": "tile-item:Give Feedback", "separator": false, "type": "ColumnSet" } ], "style": "emphasis", "id": "tile-container:Give Feedback", "spacing": "Small", "separator": false, "height": "stretch", "type": "Container" }, { "items": [ { "columns": [ { "width": "auto", "items": [ { "horizontalAlignment": null, "size": "small", "style": null, "url": "https://as-prod.asyncgw.teams.microsoft.com/v1/objects/0-ea-d1-2160cc79509f6372c7cd5933d345fbf7/views/img_preview", "height": "auto", "id": "tile-icon:Clock My Time", "separator": false, "type": "Image" } ], "verticalContentAlignment": "center", "id": "tile-first-column:Clock My Time", "separator": false, "type": "Column" }, { "width": "stretch", "items": [ { "color": null, "horizontalAlignment": null, "isSubtle": false, "maxLines": 0, "size": "medium", "text": "Clock My Time", "weight": "bolder", "wrap": true, "id": "tile-title:Clock My Time", "separator": false, "type": "TextBlock" } ], "verticalContentAlignment": "center", "bleed": true, "id": "tile-second-column:Clock My Time", "separator": false, "type": "Column" }, { "width": "auto", "items": [ { "actions": [ { "data": { "id": "tile-action-data:Clock My Time", "msteams": { "type": "task/fetch" }, "requestType": "command", "namespace": "cico", "command": "ClockInClockOut", "step": "clockInClockOutMainStep", "_commandSession": { "userId": "103106" }, "path": "", "_actionTitle": "Clock My Time" }, "iconUrl": "https://as-prod.asyncgw.teams.microsoft.com/v1/objects/0-ea-d5-30512ce80207bbab5cbe62c907d3b62d/views/img_preview", "id": "tile-submit-action:Clock My Time", "tooltip": "Clock My Time", "type": "Action.Submit" } ], "id": "tile-action-set:Clock My Time", "separator": false, "type": "ActionSet" } ], "id": "tile-third-column:Clock My Time", "separator": false, "type": "Column" } ], "id": "tile-item:Clock My Time", "separator": false, "type": "ColumnSet" } ], "style": "emphasis", "id": "tile-container:Clock My Time", "spacing": "Small", "separator": false, "height": "stretch", "type": "Container" }, { "items": [ { "columns": [ { "width": "auto", "items": [ { "horizontalAlignment": null, "size": "small", "style": null, "url": "https://as-prod.asyncgw.teams.microsoft.com/v1/objects/0-ea-d5-ef38eab2cdc76b859eb9351c155ce93e/views/img_preview", "height": "auto", "id": "tile-icon:View My Pay Statement", "separator": false, "type": "Image" } ], "verticalContentAlignment": "center", "id": "tile-first-column:View My Pay Statement", "separator": false, "type": "Column" }, { "width": "stretch", "items": [ { "color": null, "horizontalAlignment": null, "isSubtle": false, "maxLines": 0, "size": "medium", "text": "View My Pay Statement", "weight": "bolder", "wrap": true, "id": "tile-title:View My Pay Statement", "separator": false, "type": "TextBlock" } ], "verticalContentAlignment": "center", "bleed": true, "id": "tile-second-column:View My Pay Statement", "separator": false, "type": "Column" }, { "width": "auto", "items": [ { "actions": [ { "data": { "id": "tile-action-data:View My Pay Statement", "msteams": { "type": "task/fetch" }, "requestType": "command", "namespace": "payroll", "command": "PayStatement", "step": "viewPayStatementStep", "_commandSession": { "userId": "103106" }, "path": "/paystatement/entry", "_actionTitle": "View My Pay Statement" }, "iconUrl": "https://as-prod.asyncgw.teams.microsoft.com/v1/objects/0-ea-d2-32513acf6160c1c27cee24e19b75e312/views/img_preview", "id": "tile-submit-action:View My Pay Statement", "tooltip": "View My Pay Statement", "type": "Action.Submit" } ], "id": "tile-action-set:View My Pay Statement", "separator": false, "type": "ActionSet" } ], "id": "tile-third-column:View My Pay Statement", "separator": false, "type": "Column" } ], "id": "tile-item:View My Pay Statement", "separator": false, "type": "ColumnSet" } ], "style": "emphasis", "id": "tile-container:View My Pay Statement", "spacing": "Small", "separator": false, "height": "stretch", "type": "Container" } ], "$schema": "http://adaptivecards.io/schemas/adaptive-card.json", "version": "1.5" }, "contentType": "application/vnd.microsoft.card.adaptive" }, "width": "small", "title": "Try out the features we picked for you" }, "type": "continue" }, "responseType": "task" }

https://github.com/MicrosoftDocs/msteams-docs/assets/144102521/46f0b9cd-4e77-4e9b-87a0-58ed906f580f

Expected behavior

button should be clickable

Actual behavior

not clickable

Error details

No response

AmyLi0728 commented 3 months ago

But for chrome 125, button can be clickable, please noted. Thanks

Nivedipa-MSFT commented 3 months ago

@AmyLi0728 - Thanks for reporting your issue. We will test this and update you soon.

AmyLi0728 commented 3 months ago

Hi Team, I found this issue is not related to chrome version, maybe your teams version, it doesn't work for "1415/24051622220", but works for "1415/24050307617", please check. but I want to know why keep different versions for different users in same company and same environment. Thanks, Amy

Nivedipa-MSFT commented 3 months ago

@AmyLi0728 - We have tested this on Microsoft Teams version 24166.1700.2940.9537 desktop client. Its working fine at our end.

Clickable_Issue.webm

Could you please update the Teams version and check again?

AmyLi0728 commented 3 months ago

Hi, team, From your video, I see your buttons are not rendered correctly, can you create a button with icon by using adaptive card to have a test? And our manual test and automation test are based on Web client by using chrome, It diesn't work for Web chrome with teams version "1415/24051622220" image Thanks, Amy

AmyLi0728 commented 3 months ago

Hi, team, I have checked just now with desktop client, it doesn't work too, and the version information is image

https://github.com/MicrosoftDocs/msteams-docs/assets/144102521/486b56c8-072b-4a20-9819-6a1bf2b460df

Thanks, Amy

AmyLi0728 commented 3 months ago

Hi Team, Is there any update for this issue? it's urgent for us. Thanks, Amy

Nivedipa-MSFT commented 3 months ago

@AmyLi0728 - We have tested this on Chrome version 126.0.6478.115 and Teams version 1415/24051622220. And also tested on Teams desktop version 24171.1500.2949.5639. We are able to repro your issue.

Chrome: Chrome.webm

Teams Desktop Client: Teams_Desktop.webm

We have raised a bug for the same. We will let you know once we get any updates on it.

AmyLi0728 commented 3 months ago

Hi Team, Is there any update for this bug? it blocked our work. Thanks, Amy

AmyLi0728 commented 3 months ago

Hi Team, When will you plan to release this fix? this is a function issue, and blocked our feature in production, many customers complain with this issue, so could you please take high priority for this issue? Very appreciate. Thanks, Amy

Nivedipa-MSFT commented 3 months ago

@AmyLi0728 - We are checking the status of the bug with the engineering team, we will inform you once we get any updates on it.

AmyLi0728 commented 2 months ago

Hi team,

We found in version “Ring: Canary (R0)”, the icon button can be clicked, but not for public Ring version. So have you resolved this bug? whether will we just need to wait this fix to release? and when will this fix be available for public? image

Thanks, Amy

AmyLi0728 commented 2 months ago

Hi teams, I found this issue has been fixed, thanks for your efforts. Thanks, Amy

Nivedipa-MSFT commented 2 months ago

@AmyLi0728 - Thanks for your confirmation. Could you please share your valuable feedback via Microsoft Teams Developer Community Response Feedback link?