mdn / yari

The platform code behind MDN Web Docs

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Examples flash in Safari

romainmenke opened this issue · comments

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

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

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

Closing in favor of #10764.