MS Teams task/modules unable to render frontend URL

Question

We have created MS teams bot application which contains some UI portion to interact with users, our frontend service is deployed on https://example.com domain which is developed using React JS, and we want to present this https://example.com site within MS teams task/module.

But teams task/module showing blank white screen. Teams task module with blank screen

We have included example.com in validDomains list of the manifest.json file, but still experiencing the same issue.

Also, we try to set below headers on webserver but it doesn't work for me.

X-Frame-Options: ALLOW-FROM https://teams.microsoft.com/

Content-Security-Policy: frame-ancestors teams.microsoft.com *.teams.microsoft.com *.skype.com teams.cloud.microsoft

Answer 1

We have resolved this issue. The root cause was that The same bot app is installed in our org tenant at as well as personal level which causes the conflict, even though we made changes into validDomains of app manifest but it doesn't consider updated manifest until org level app removed completely, After removing the bot app installed at org level, we would be able to see the frontendURL inside modal popup screen.