Bug 240083 – Use correct document as root for lazy image observer

• Status: RESOLVED
• Resolution: FIXED
• Component: Images

Hi,

In Safari 15.4 we've noticed an error with the attribute loading="lazy". HTML img tag with this attribute are not loading consistently. If you check the network tab you will see that the images are not being requested at all. So far, the solution is to remove the attribute or use loading="eager".

You can successfully replicate it with this codesanbox (https://codepen.io/intellix/pen/JjMwWae). Found it here (https://github.com/Fyrd/caniuse/issues/6243).

Additionally if you go to "Develop > Experimental Features" and disable "Lazy image loading" the images with loading="lazy" will load consistently.

[Rob Buis]

The html seems to work fine in a standalone file, but as soon as it is embedded in an iframe no image load is triggered.

[Radar WebKit Bug Importer]

<rdar://problem/92798878>

[Rob Buis]

Created attachment 458903 [details]
Patch

[Simon Fraser (smfr)]

Comment on attachment 458903 [details]
Patch

View in context: https://bugs.webkit.org/attachment.cgi?id=458903&action=review

> Source/WebCore/ChangeLog:8
> +        Use document as root for lazy image observer.

The iframe's document?

[Simon Fraser (smfr)]

Can you test lazy image loading with Command-+ zoom too? I believe we might have some intersection observer bugs with zooming.

[Rob Buis]

Created attachment 458952 [details]
Patch

[EWS Watchlist]

This patch modifies the imported WPT tests. Please ensure that any changes on the tests (not coming from a WPT import) are exported to WPT. Please see https://trac.webkit.org/wiki/WPTExportProcess

[EWS]

Committed r293933 (250379@main): <https://commits.webkit.org/250379@main>

All reviewed patches have been landed. Closing bug and clearing flags on attachment 458952 [details].