Open
Description
Target SharePoint environment
SharePoint Online
What SharePoint development model, framework, SDK or API is this about?
💥 SharePoint Framework
Developer environment
None
What browser(s) / client(s) have you tested
- 💥 Internet Explorer
- 💥 Microsoft Edge
- 💥 Google Chrome
- 💥 FireFox
- 💥 Safari
- mobile (iOS/iPadOS)
- mobile (Android)
- not applicable
- other (enter in the "Additional environment details" area below)
Additional environment details
Node 22
spfx 1.21.1
ios 18.5
Teams v7.8.0
Describe the bug / error
Quite recently the srcdoc iframe attribute has stopped working in our teams app, which is built originally as an spfx webpart and deployed via the teams admin portal.
It simply shows an empty iframe.
The srcdoc attribute still works perfectly fine when used via Teams in Windows, Mac or Android
Steps to reproduce
- Use yeoman to create a new webpart using react as the framework
- Add an iframe within the section tag of the default HelloWorld.tsx file
e.g.<iframe srcDoc="<!DOCTYPE html><head><style>.testing {color: red}</style></head><body><div class='testing'>This is a test 123</div></body></html>"></iframe>
- gulp bundle --ship
- gulp package-solution --ship
- deploy via your sharepoint admin site
- add to teams
Expected behavior
The iframe should render correctly on all platforms, however it does not work correctly on Teams in iOS