Bug 230998 - Allow IntersectionObserver API to specify root for individual targets
Summary: Allow IntersectionObserver API to specify root for individual targets
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: New Bugs (show other bugs)
Version: WebKit Nightly Build
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: Nobody
URL:
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2021-09-29 16:12 PDT by Nikos Mouchtaris
Modified: 2022-02-09 10:14 PST (History)
4 users (show)

See Also:

Attachments
Add an attachment (proposed patch, testcase, etc.)

Note You need to log in before you can comment on or make changes to this bug.
Description Nikos Mouchtaris 2021-09-29 16:12:29 PDT 
IntersectionObserver API should allow the specification of multiple roots, depending on the target element. This is needed for lazy image loading, as for lazy load images in scrollable elements, we want to set their root to the scrollable element, not the viewport. The current implementation results in the images being loaded only once they partially enter the viewport, as their root is set to the top-level viewport, not the scrollable element.
Comment 1 Nikos Mouchtaris 2021-09-29 16:12:56 PDT 
rdar://83693358
Comment 2 Nikos Mouchtaris 2021-09-29 17:16:42 PDT 
https://github.com/w3c/IntersectionObserver/issues/431
Comment 3 Nikos Mouchtaris 2021-09-29 17:23:26 PDT 
See that for image in scrollable div only gets loaded once it enters the viewport: https://codepen.io/nmoucht/pen/VwWgoPv.