RGBCube/serenity
1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-06-01 08:28:11 +00:00
Code Issues Activity Actions

LibWeb: Process all pending lazy loading intersection observations

Browse source 
This fixes an issue where images outside the viewport could prevent
loading of images inside the viewport, depending on DOM order.
This commit is contained in:
Andreas Kling 2023-12-24 12:32:25 +01:00
parent b344d39014
commit fe04d83ef5
3 changed files with 26 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

1
Tests/LibWeb/Text/expected/IntersectionObserver/img-lazy-loading-not-blocked-by-img-outside-viewport.txt Normal file
View file

@ -0,0 +1 @@
PASS

19
Tests/LibWeb/Text/input/IntersectionObserver/img-lazy-loading-not-blocked-by-img-outside-viewport.html Normal file
View file

@ -0,0 +1,19 @@
<!doctype html><style>
img {
border: 1px solid black;
width: 30px;
height: 30px;
}
/* This element will not be visible in the viewport */
#notInViewport {
position: relative;
top: -1000px;
}
</style><body><img id="notInViewport" loading="lazy" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAIAAAAlC+aJAAAAUElEQVRo3u3PQQ0AMAgEsGP+xeEIVOxB0jpodSaXvRwnICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAg8N8ChgACTxD8p8QAAAAASUVORK5CYII="><img id="inViewport" loading="lazy" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAIAAAAlC+aJAAAAUElEQVRo3u3PQQ0AMAgEsGP+xeEIVOxB0jpodSaXvRwnICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAg8N8ChgACTxD8p8QAAAAASUVORK5CYII=">
<script>
const inViewport = document.getElementById("inViewport");
inViewport.addEventListener("load", function() {
document.body.innerHTML = "PASS";
internals.signalTextTestIsDone();
});
</script>

8
Userland/Libraries/LibWeb/DOM/Document.cpp
View file

@ -3357,8 +3357,12 @@ void Document::start_intersection_observing_a_lazy_loading_element(Element& elem
}
// 3. If resumptionSteps is null, then return.
if (!resumption_steps)
return JS::js_undefined();
if (!resumption_steps) {
// NOTE: This is wrong in the spec, since we want to keep processing
// entries even if one of them doesn't have resumption steps.
// FIXME: Spec bug: https://github.com/whatwg/html/issues/10019
continue;
}
// 4. Stop intersection-observing a lazy loading element for entry.target.
// https://html.spec.whatwg.org/multipage/urls-and-fetching.html#stop-intersection-observing-a-lazy-loading-element