Bug 259376
| Summary: | Flash of grey background in between showing video poster and playing the actual video | ||
|---|---|---|---|
| Product: | WebKit | Reporter: | Bramus <bramus> |
| Component: | Layout and Rendering | Assignee: | Nobody <webkit-unassigned> |
| Status: | NEW | ||
| Severity: | Normal | CC: | ahmad.saleem792, bfulgham, eric.carlson, jer.noble, simon.fraser, webkit-bug-importer, zalan |
| Priority: | P2 | Keywords: | InRadar |
| Version: | WebKit Nightly Build | ||
| Hardware: | Mac (Apple Silicon) | ||
| OS: | macOS 13 | ||
Bramus
(1) Go to http://scroll-driven-animations.style/
(2) Hover one of the images of the visual down the page.
The visuals are video elements with a poster image. The videos are paused on load. Upon `pointerenter` the, a `.play()` is triggered. Upon `pointerleave`, a `.pause()` is triggered.
What happens: When swapping out the poster for the video, the video shows a grey background while the video file is still loading. This is very much visible when on a slow connection.
What I expected to happen (and what other browsers do): keep showing the poster image until there is enough data to start rendering the video source, as this glitch of grey is a visual disturbance.
| Attachments | ||
|---|---|---|
| Add attachment proposed patch, testcase, etc. |
Ahmad Saleem
I am able to reproduce this bug on Safari 16.5.1 and Safari Technology Preview 174 as well, where upon hover on some images (almost all but some are instant), I get 'green' flash before video continuing.
Ahmad Saleem
NOTE - the flash is less bad on WebKit ToT (266205@main).
Radar WebKit Bug Importer
<rdar://problem/113003051>
Ahmad Saleem
@Bramus - was the site updated because now I am unable to use it to reproduce this bug?
Do you have broken case test site?
Bramus
@Ahmad Nothing changed. Flash is still there, I just checked. Could be the videos are now cached on your end, or that your connection is Super Fast™.
Try setting throttling in DevTools (you need to enable an experimental setting first, before you can do so) or use the Network Link Conditioner to fake a slow connection.
Ahmad Saleem
(In reply to Bramus from comment #5)
> @Ahmad Nothing changed. Flash is still there, I just checked. Could be the
> videos are now cached on your end, or that your connection is Super Fast™.
>
> Try setting throttling in DevTools (you need to enable an experimental
> setting first, before you can do so) or use the Network Link Conditioner to
> fake a slow connection.
Cool! I think my network being fast came into picture. Let me try again with experimental flag on WebKit ToT.