diff --git a/.changeset/nice-chicken-wonder.md b/.changeset/nice-chicken-wonder.md new file mode 100644 index 000000000000..b9f6e39fb858 --- /dev/null +++ b/.changeset/nice-chicken-wonder.md @@ -0,0 +1,5 @@ +--- +'svelte': patch +--- + +fix: consider img with loading attribute not static diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/fragment.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/fragment.js index 022b8574d974..98272817df7d 100644 --- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/fragment.js +++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/fragment.js @@ -150,6 +150,11 @@ function is_static_element(node) { return false; } + // We need to apply src and loading after appending the img to the DOM for lazy loading to work + if (node.name === 'img' && attribute.name === 'loading') { + return false; + } + if (node.name.includes('-')) { return false; // we're setting all attributes on custom elements through properties } diff --git a/packages/svelte/tests/runtime-runes/samples/img-loading-lazy-no-static/_config.js b/packages/svelte/tests/runtime-runes/samples/img-loading-lazy-no-static/_config.js new file mode 100644 index 000000000000..673ff2d75465 --- /dev/null +++ b/packages/svelte/tests/runtime-runes/samples/img-loading-lazy-no-static/_config.js @@ -0,0 +1,5 @@ +import { test } from '../../test'; + +export default test({ + html: `

` +}); diff --git a/packages/svelte/tests/runtime-runes/samples/img-loading-lazy-no-static/main.svelte b/packages/svelte/tests/runtime-runes/samples/img-loading-lazy-no-static/main.svelte new file mode 100644 index 000000000000..15425d905158 --- /dev/null +++ b/packages/svelte/tests/runtime-runes/samples/img-loading-lazy-no-static/main.svelte @@ -0,0 +1,2 @@ +

+ \ No newline at end of file