IntersectionObserver entries inaccurate

[robert-williams-ast]

MDN URL

https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API

What specific section or headline is this issue about?

Targeting an element to be observed

What information was incorrect, unhelpful, or incomplete?

The list of entries received by the callback includes one entry for each target which reported a change in its intersection status.

What did you expect to see?

The list of entries received by the callback includes at least one entry for each target which reported a change in its intersection status. Multiple intersection changes may be reported in the same event.

either:

Check the time property to see in which order the changes occur.

or:

The entries will be listed ordered from first to last.

Do you have any supporting links, references, or citations?

I will write a test.

Something like this should work on any page with reasonable complexity and length.

[...document.querySelectorAll('*')].forEach((element) => {
  new IntersectionObserver((entries) => {
    entries.forEach(entry => console.log('intersectionRatio', entry.intersectionRatio ));
    if (entries[0].target === entries[1]?.target) {
      debugger;
    }
  });
});

and then grab the scroll-bar and crank up and down an few times.

Do you have anything more you want to share?

I do not know wether the entries are always in chronological order. Please advise.

MDN metadata

Page report details

• Folder: en-us/web/api/intersection_observer_api
• MDN URL: https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API
• GitHub URL: https://github.com/mdn/content/blob/main/files/en-us/web/api/intersection_observer_api/index.md
• Last commit: a366333
• Document last modified: 2022-09-13T19:34:57.000Z

[seanmacisaac]

We hit a bug yesterday due our code making the assumption about only getting a single entry per target in any particular callback invocation. We fixed our code not even knowing if it could be the issue and added some logging that showed that it was happening. We later read the spec on the W3C site and it showed that it could happen:

https://w3c.github.io/IntersectionObserver/#update-intersection-observations-algo
https://w3c.github.io/IntersectionObserver/#queue-intersection-observer-entry-algo
https://w3c.github.io/IntersectionObserver/#notify-intersection-observers-algo

The spec doesn't seem to explicitly state that the entries will be in chronological order, but does talk about using queues and I think implies it.