html icon indicating copy to clipboard operation
html copied to clipboard

Intersection observer and mark paint timing steps should run after (or during) "update the rendering", not before.

Open emilio opened this issue 3 years ago • 1 comments

https://html.spec.whatwg.org/#update-the-rendering says that step 14 is:

For each fully active Document in docs, run the update intersection observations steps for that Document, passing in now as the timestamp

Same for mark paint timing.

And step 16 is:

For each fully active Document in docs, update the rendering or user interface of that Document and its browsing context to reflect the current state.

Which is presumably when layout and style updates happen, or at least that's where ResizeObserver expects them to happen: https://drafts.csswg.org/resize-observer/#html-event-loop

It seems to me like IntersectionObserver and mark paint timing should happen at least after updating layout and style, not before. That's what happens in Gecko and I'd be extremely surprised if it wasn't what happens in other browsers. ResizeObserver needs to be during, because it can run script and cause further layout and style changes.

cc @rniwa @Loirooriol

emilio avatar Sep 09 '22 20:09 emilio

Quick test:

new IntersectionObserver(() => console.log("IntersectionObserver")).observe(document.documentElement);
new ResizeObserver(() => console.log("ResizeObserver")).observe(document.documentElement);

Gecko and Blink: 1st ResizeObserver, 2nd IntersectionObserver WebKit: 1st IntersectionObserver, 2nd ResizeObserver

Loirooriol avatar Sep 09 '22 22:09 Loirooriol