IntersectionObserver Document Root

Category: JavaScript
Type: New or changed feature
Status: Enabled by default (Chrome 81)
Intent stage: Prepare to ship

Breaking change: No
Enterprise impact: None
Spec maturity: Unknown status
Web Platform Tests: Yes

WPT details: https://github.com/web-platform-tests/wpt/pull/21222

Summary

Allow the IntersectionObserver constructor to take a Document as the 'root' argument, causing intersections to be calculated against the scrolling viewport of the document.

Motivation

This is primarily targeted towards observers running in an iframe; prior to this feature, there was no way to measure intersection with the scrolling viewport of the iframe's document.

Standards & signals

Specification: https://github.com/w3c/IntersectionObserver/pull/411
Firefox: No signal
Safari: No signal
Web developers: Positive
Tracking bug: https://bugs.chromium.org/p/chromium/issues/detail?id=1015183

Ecosystem

Web Platform Tests: https://wpt.fyi/results/?q=intersectionobserver-document-root
Chrome Platform Showcase: https://chrome-platform-showcase.paulkinlan-ea.deno.net/features
GenDN reference: https://gendn.paulkinlan-ea.deno.net/features
chrome.dev demos search: https://www.google.com/search?q=site%3Achrome.dev+IntersectionObserver%20Document%20Root
MDN Web Docs: https://developer.mozilla.org/en-US/search?q=IntersectionObserver%20Document%20Root
Baseline status: https://webstatus.dev/?q=IntersectionObserver%20Document%20Root

Docs: https://w3c.github.io/IntersectionObserver/#calculate-intersection-rect-algo

Explainers: https://github.com/w3c/IntersectionObserver/issues/372

View on chromestatus.com