FIX: Ensure lazy-load-images does not remove entire `img.style` (#16553)

Other things may have added things to the style attribute (e.g. the `image-aspect-ratio` decorator).

Unfortunately this is difficult to add a test for because `lazy-load-images` leans on the `onload` event. We have no control over image loading in tests, so race conditions would be very likely.
This commit is contained in:
David Taylor 2022-04-25 17:19:25 +01:00 committed by GitHub
parent 06462631c4
commit 32346f4ba5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 7 additions and 2 deletions

View File

@ -18,11 +18,16 @@ export function nativeLazyLoading(api) {
if (!img.complete) {
if (!img.onload) {
img.onload = () => {
img.removeAttribute("style");
img.style.removeProperty("background-image");
img.style.removeProperty("background-size");
};
}
img.style = `background-image: url(${img.dataset.smallUpload}); background-size: cover;`;
img.style.setProperty(
"background-image",
`url(${img.dataset.smallUpload});`
);
img.style.setProperty("background-size", "cover");
}
}
}),