Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Using src + data-src and loading=lazy loads the src in Firefox and Safari #994

Open
zcorpan opened this issue Mar 20, 2024 · 0 comments · May be fixed by #995
Open

Using src + data-src and loading=lazy loads the src in Firefox and Safari #994

zcorpan opened this issue Mar 20, 2024 · 0 comments · May be fixed by #995
Labels

Comments

@zcorpan
Copy link

zcorpan commented Mar 20, 2024

Describe the bug
Using lazySizes with iframe and a placeholder src and loading=lazy makes the placeholder src win.

Also see whatwg/html#10213

Possibly related: #705 , #927

To Reproduce
https://software.hixie.ch/utilities/js/live-dom-viewer/saved/12475

Steps to reproduce the behavior:

<!DOCTYPE html>
<script src=http://afarkas.github.io/lazysizes/lazysizes.min.js></script>
<iframe class=lazyload loading=lazy src="data:,original src" data-src="data:,data-src"></iframe>

What is the expected behavior:
Web pages with this pattern appear to expect the data-src to "win".

I think lazySizes could remove loading attributes on iframes with a lazyload class so that the placeholder src is loaded eagerly and to avoid timing issues with which navigation is the last one, in current Firefox and Safari. Or at least remove loading attribute right before location.replace.

What happened instead:
In Firefox and Safari (maybe subject to timing), the location.replace() navigation happens first and then the browser lazy-loads the src URL.

In what environment (browser/device etc.) does this bug happen/not happen:
Firefox, Safari: yes
Chrome: no

Keywords help others to find this issue:

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging a pull request may close this issue.

1 participant