| Summary: | Resize event on iframe fired before rAF on parent document | ||
|---|---|---|---|
| Product: | WebKit | Reporter: | Rune Lillesveen <rune.lillesveen> |
| Component: | Frames | Assignee: | Nobody <webkit-unassigned> |
| Status: | RESOLVED INVALID | ||
| Severity: | Normal | CC: | achristensen, cdumez, karlcow, koivisto, rniwa, sabouhallawa, simon.fraser, webkit-bug-importer |
| Priority: | P2 | Keywords: | BrowserCompat, InRadar |
| Version: | Safari Technology Preview | ||
| Hardware: | Unspecified | ||
| OS: | Unspecified | ||
https://html.spec.whatwg.org/multipage/webappapis.html#event-loop-processing-model says that the resize (step 7) happens before the animation frame callbacks (step 13). > https://html.spec.whatwg.org/multipage/webappapis.html#event-loop-processing-model says that the resize (step 7) happens before the animation frame callbacks (step 13).
Yes, but the resize of the iframe is a result of the layout of the top document that happens after the first rAF callback. The resize event should then trigger before the next rAF, IIUC?
(In reply to Rune Lillesveen from comment #3) > > https://html.spec.whatwg.org/multipage/webappapis.html#event-loop-processing-model says that the resize (step 7) happens before the animation frame callbacks (step 13). > > Yes, but the resize of the iframe is a result of the layout of the top > document that happens after the first rAF callback. The resize event should > then trigger before the next rAF, IIUC? I don't see how the spec reads that way. Fundamentally, spec basically assumes that the resize happens immediately once the width is set, not when rAF happens. |
In the case below the rAF on the parent document should be handled before the iframe re-layout is done, which means the resize event handler should be run after the parent document rAF handler. Safari outputs the "resize" before the "rAF": <!doctype html> <iframe id="frm" width="100"></iframe> <script> setTimeout(() => { frm.contentWindow.addEventListener('resize', () => console.log("resize")); requestAnimationFrame(() => console.log("rAF")); frm.style.width = '200px'; }, 1000); </script> Found this while looking at failures in Chrome for: http://wpt.live/css/mediaqueries/media-query-matches-in-iframe.html Some of the expectations there seem wrong.