Image load event is sometimes fired _after_ the image is painted instead of before
Categories
(Core :: DOM: Core & HTML, defect)
Tracking
()
People
(Reporter: caleb, Unassigned, NeedInfo)
References
Details
User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/15.3 Safari/605.1.15
Steps to reproduce:
Here's a quick demo: these images should get larger in steps of 75, but you'll see brief flashes of larger images in Firefox. Safari and Chrome do not have the issue, and Firefox didn't used to: https://jsfiddle.net/1q0tpacu/1/
<img>in the DOM- Attach a
loadevent that changes a style that only looks right on the new image but looks bad if applied to the current image - Change the image source
Actual results:
Sometimes, but not every time:
- The old image will briefly be rendered with the new style.
- The load event fires after the image is rendered.
- Two frames are rendered to the display (verifiable with the performance extension)
Expected results:
- The old image should never have rendered with the new style.
- The load event should have fired before the image was rendered.
- Only one frame should have been rendered to the display
Comment 1•3 years ago
|
||
The Bugbug bot thinks this bug should belong to the 'WebExtensions::Untriaged' component, and is moving the bug to that component. Please revert this change in case you think the bot is wrong.
Comment 2•3 years ago
|
||
It seems that it's a race between vsync and a call of nsImageLoadingContent::OnLoadComplete.
Smaug: do you know something about it or some other expert?
Updated•3 years ago
|
Comment 3•3 years ago
|
||
We do use render blocking priority messaging from imglib to the main thread so that images can be painted sooner.
My guess is that we're missing to use that priority for OnLoadComplete.
Per spec load event fires after
"Update req's img element's presentation appropriately." step, though animationFrame callbacks would run afterwards.
Description
•