fix: prevent responsive image retention

.changeset/bright-images-release.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: prevent responsive image retention in Chromium

packages/svelte/src/internal/client/dom/template.js

@@ -52,8 +52,6 @@ export function assign_nodes(start, end) {
 /*#__NO_SIDE_EFFECTS__*/
 export function from_html(content, flags) {
 	var is_fragment = (flags & TEMPLATE_FRAGMENT) !== 0;
-	var use_import_node = (flags & TEMPLATE_USE_IMPORT_NODE) !== 0;
-
 	/** @type {Node} */
 	var node;
 
@@ -74,9 +72,9 @@ export function from_html(content, flags) {
 			if (!is_fragment) node = /** @type {TemplateNode} */ (get_first_child(node));
 		}
 
-		var clone = /** @type {TemplateNode} */ (
-			use_import_node || is_firefox ? document.importNode(node, true) : node.cloneNode(true)
-		);
+		// Keep clones in the page document to avoid repeated cross-document adoption
+		// when templates are assembled with page-document fragments.
+		var clone = /** @type {TemplateNode} */ (document.importNode(node, true));
 
 		if (is_fragment) {
 			var start = /** @type {TemplateNode} */ (get_first_child(clone));

packages/svelte/tests/runtime-runes/samples/responsive-image-anchor-fragment/Picture.js

@@ -0,0 +1,19 @@
+import { append, comment, from_html } from 'svelte/internal/client';
+
+const parent_template = from_html('<div><!></div>');
+const picture_template = from_html(
+	'<picture><source srcset="small.webp 400w, large.webp 800w" sizes="100vw" type="image/webp"> <img src="small.jpg" srcset="small.jpg 400w, large.jpg 800w" sizes="100vw" alt=""></picture>'
+);
+
+export default function Picture(anchor) {
+	const parent = parent_template();
+	const fragment = comment();
+	const fragment_anchor = fragment.lastChild;
+	const picture = picture_template();
+	const img = picture.querySelector('img');
+
+	img.dataset.pageDocument = String(img.ownerDocument === document);
+	append(fragment_anchor, picture);
+	parent.firstChild.before(fragment);
+	append(anchor, parent);
+}

packages/svelte/tests/runtime-runes/samples/responsive-image-anchor-fragment/_config.js

@@ -0,0 +1,9 @@
+import { test } from '../../test';
+
+export default test({
+	mode: ['client'],
+
+	test({ assert, target }) {
+		assert.equal(target.querySelector('img')?.dataset.pageDocument, 'true');
+	}
+});

packages/svelte/tests/runtime-runes/samples/responsive-image-anchor-fragment/main.svelte

@@ -0,0 +1,11 @@
+<script>
+	import Picture from './Picture.js';
+
+	let show = $state(true);
+</script>
+
+{#if show}
+	<div>
+		{#if true}<Picture />{/if}
+	</div>
+{/if}