Skip to content

srcdoc iframe attribute no longer works in Teams in iOS #10252

Open
@JamesDerrickHH

Description

@JamesDerrickHH

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

Image
Image

Steps to reproduce

  1. Use yeoman to create a new webpart using react as the framework
  2. 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>
  3. gulp bundle --ship
  4. gulp package-solution --ship
  5. deploy via your sharepoint admin site
  6. add to teams

Expected behavior

The iframe should render correctly on all platforms, however it does not work correctly on Teams in iOS

Metadata

Metadata

Assignees

Labels

area:ACE-Mobilesharepoint-developer-supportsharepoint-developer-supporttype:bug-confirmedConfirmed bug, not working as designed / expected.type:bug-suspectedSuspected bug (not working as designed/expected). See “type:bug-confirmed” for confirmed bugs.

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions