Examples flash in Safari

[romainmenke]

Summary

In Safari the examples embedded as iframes render over and over again leading to flashing content.

Warning the flashes are very intense

Screen.Recording.2024-01-31.at.14.54.21.mp4

In this screenshot I select the iframe in the debugger.
But it is unselected immediately because the element is deleted and recreated.

Screen.Recording.2024-01-31.at.14.55.01.mp4

URL

Any page with such examples.

Reproduction steps

1. Use Safari
2. Visit any MDN page with examples in iframes

Expected behavior

I didn't expect flashes

Actual behavior

A lot of flashes

Device

Desktop

Browser

Safari

Browser version

Stable

Operating system

Mac OS

Screenshot

No response

Anything else?

No response

Validations

• I have read the Community Participation Guidelines.
• I have verified that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• I have checked that this is a concrete bug. For Q&A open a GitHub Discussion.

[argl]

Example exposing the issue: https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Functions/Using_CSS_math_functions#max_example

[mirunacurtean]

Update
The examples have changed, but the flicker can still be reprroduced on more recent Safari versions (tested on 17.3 and 17.4)

Safari.17.3.mov

Screen.Recording.2024-05-17.at.13.21.00.mov

Note: Could not reproduce this on Safari 15.6 and 16.5, but that may be due to testing this on browserstack where the flicker rate seems reduced.

Safari.flickers.mov

[romainmenke]

Can we give this a higher priority given that this is exactly the kind of strobing effect that is triggering for photosensitive epilepsy?

[caugner]

Closing in favor of #10764.