Images in Adaptive Cards in New Teams Client not showing

[emilSociuu]

Hello Community,

I've encountered an issue with Teams Webhook Connector where images in Adaptive Cards are not displaying correctly in the New Teams Client, although they work as expected in the classic version.

Our clients have reported that while messages are visible, the images fail to appear. This problem does not occur in the classic Teams client or when viewed in a browser, which I presume is utilizing the classic client as well.

To clarify, I'm using the latest Adaptive Cards version (v1.5) compatible with Teams, and this issue is consistent across both Windows and Apple versions of the New Teams Client. Unfortunately, there seems to be no information available about this compatibility issue in the Adaptive Cards documentation or designer tool.

Below is a simple Adaptive Card JSON that illustrates the problem:

{
    "type": "AdaptiveCard",
    "body": [
        {
            "type": "TextBlock",
            "size": "Medium",
            "weight": "Bolder",
            "text": "This is a headline"
        },
        {
            "type": "Image",
            "url": "https://img.cdn-pictorem.com/uploads/collection/D/DN4DFF8JRC/900_Nature-Art_colorful--paintings.jpg",
            "width": "300px"
        }
    ],
    "$schema": "http://adaptivecards.io/schemas/adaptive-card.json",
    "version": "1.5"
}

For visual reference, here is how the card renders in both clients:

Classic Teams Client:

New Teams Client:

I have not found a workaround yet and would greatly appreciate guidance on how to resolve this issue. Any suggestions or updates regarding the new client's support for Adaptive Cards would be very helpful.

Thank you.

Best regards

[#2]

There is a bug raised for this issue, we will keep you posted on the updates. The same issue has been posted here https://techcommunity.microsoft.com/t5/teams-developer/image-inserted-in-incoming-webhook-is-not-wor... earlier.

[#3]

@Meghana-MSFT thank you very much. I attempting searching for this issue among the community but failed to find the other post you referenced to.

I hope this will be fixed quickly. In the meantime I'll forward your update to my client

[#4]

@emilSociuu 

The cause is pretty clear. 

Compared to Teams Classic the new Teams client (including Teams on the web with the new Teams) extends non-public hosted pictures with a "&v=1" at the of the picture URL. That's the issue. 

Here is an example: 

Public-hosted pictures (like the images from the stock gallery) are not affected. 

@Meghana-MSFT 

I think the development team made a mistake and should use ? instead &, if they want to force a cache update. Then the picture will be displayed like in Teams Classic. 

[#5]

What an annoying bug. I hope it gets fixed soon.

[#6]

This issue is fixed now. We have verified the fix in new Teams. 

[#7]

@Meghana-MSFT 

Is it possible that the bug has returned?
I currently have this discrepancy between the Teams client and the display in the web browser:

[#8]

@Capcom24 - We see that it is working in web browser as well.

The client version is 1415/24010419114.

[#9]

thank you very much for your quick reply.
I think there has been a misunderstanding. Everything is fine in the web browser. The image and the background image are displayed here. The problem is in the Teams client. Could there still be an error here?

[#10]

@Capcom24 - Its working in Teams client as well.

[#11]

@Meghana-MSFT 

Thanks for the tip. I have just updated my Teams client and unfortunately the Adapative Card is still displayed without images. As I said, everything is fine in the web browser. Could the difference between our two versions be due to the region (Germany in my case)?

[#12]

This is also affecting me, tried to setup new adaptive cards for Azure DevOps notifications, but images do not work on "New teams", they do work on web browser version...

[#13]

We are checking this internally, we will get back to you.

[#14]

Yup, same for me. Tried several times today and while appearing in the Adaptive Card Designer, They do not show in New Teams.

[#15]

@blahblah 

I have the same problem. I'm sitting for 4 days to find the solutions. 

Moreover then I want to use FTP connector to send to my server images, but after transfer images were broken.

And see for example picture: https://sniezek.eu/urk/1_01YOQJUKTRPPJAQUBL6REZKW2ZKCP2SDQ6.jpg

[#16]

@Meghana-MSFT 

I have the same problem (please se below) my issue 

If I put external link, images are showing on adaptive cards,

{
  "type": "Image",
  "url": "https://www.kartelmedia.co.uk/wp-content/uploads/2022/06/Zrzut-ekranu-2022-06-5-o-22.03.51.png"
}

 but if I put sharepoint/onedrive image link - images are not showing

{
  "type": "Image",
  "url": "@{outputs('sharepoint_attachement_list')?['body/AbsoluteUri']}"
}

the same link is connected to action.openUrl and works properly here. If I paste the image address into the browser, it will also be displayed in the browser.

I set full access for everyone for the image - it doesn't work either.

It doesn't matter if I inserted an image from SharePoint or OneDrive, it doesn't show up at all.

What is wrong, what I do wrong?

[#17]

I can confirm this behavior and don't think you're doing anything wrong. It must be a misbehavior in the Teams client. In the past, my application (PowerAutomate with Adaptive Card) worked perfectly in the old Teams client. In the web browser anyway. Unfortunately, all we can do at the moment is tell users to use Teams in the web browser for this application. I hope that Microsoft will fix this problem soon...

[#18]

Hi, if you have a recent repro, could you please provide the url you used to post the image, timestamp and conversation id? Team will need these to look up the backend logs.

[#19]

Thank you for your request. I will send the requested data in a private chat.

[#20]

We have shared the information with the engineering team.