yari
yari copied to clipboard
Examples on page flicker white in Safari 17
MDN URL
https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_colors/Relative_colors
What specific section or headline is this issue about?
No response
What information was incorrect, unhelpful, or incomplete?
On Safari (Version 17.3.1 (19617.2.4.11.12), MacOS 14.3.1 (23D60), M1 2020) all the examples on this page flicker with flashes of white as seen below:
https://github.com/mdn/content/assets/6453828/71eca26d-dba4-4f62-8bd1-65ae68d3af41
What did you expect to see?
The examples shouldn't flicker white.
Do you have any supporting links, references, or citations?
No response
Do you have anything more you want to share?
No response
MDN metadata
Page report details
- Folder:
en-us/web/css/css_colors/relative_colors
- MDN URL: https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_colors/Relative_colors
- GitHub URL: https://github.com/mdn/content/blob/main/files/en-us/web/css/css_colors/relative_colors/index.md
- Last commit: https://github.com/mdn/content/commit/d55f3aab8f643e8f4a52383efc1e9e1154357560
- Document last modified: 2024-03-19T11:05:40.000Z
I can confirm this issue. Any thoughts @LeoMcA? Shall I refile this as a yari bug?
Thanks a lot for raising this one. I've moved it into the Yari repo which looks like the right place for this 👍🏻
I see a similar problem in Safari on iOS 17.4
https://github.com/mdn/yari/assets/105274/cccf0476-07ad-4295-95d7-5e74c304d18a
I was able to reproduce the issue locally with Safari 17.4 and confirmed using BrowserStack Live that Safari 16.5 is unaffected, so it looks like a regression in Safari. Here's a screen recording with the DevTools Network tab open:
https://github.com/mdn/yari/assets/495429/c3e53a27-f921-44b6-9a88-128383f21444
Unfortunately, I think we have to wait for Apple to fix the bug. I have submitted a report via Feedback Assistant (FB13694054).
@fiji-flo has reported this on the WebKit bug tracker: https://bugs.webkit.org/show_bug.cgi?id=271700