diff --git a/.changeset/async-hydration-orphan-nodes.md b/.changeset/async-hydration-orphan-nodes.md new file mode 100644 index 0000000000..4c35d6b74e --- /dev/null +++ b/.changeset/async-hydration-orphan-nodes.md @@ -0,0 +1,5 @@ +--- +'svelte': patch +--- + +fix: properly track effect end node for async sibling component \ No newline at end of file diff --git a/packages/svelte/src/internal/client/dom/blocks/async.js b/packages/svelte/src/internal/client/dom/blocks/async.js index 170529a6b9..78e2ed44be 100644 --- a/packages/svelte/src/internal/client/dom/blocks/async.js +++ b/packages/svelte/src/internal/client/dom/blocks/async.js @@ -9,6 +9,7 @@ import { set_hydrating, skip_nodes } from '../hydration.js'; +import { assign_nodes } from '../template.js'; /** * @param {TemplateNode} node @@ -23,6 +24,7 @@ export function async(node, blockers = [], expressions = [], fn) { if (was_hydrating) { hydrate_next(); end = skip_nodes(false); + assign_nodes(node, end); // Necessary if this wraps the sole child of a block, else end marker can be wrong } if (expressions.length === 0 && blockers.every((b) => b.settled)) { diff --git a/packages/svelte/tests/hydration/test.ts b/packages/svelte/tests/hydration/test.ts index d2bf6fde34..0050130817 100644 --- a/packages/svelte/tests/hydration/test.ts +++ b/packages/svelte/tests/hydration/test.ts @@ -72,7 +72,7 @@ const { test, run } = suite(async (config, cwd) => { const target = window.document.body; const head = window.document.head; - const rendered = render((await import(`${cwd}/_output/server/main.svelte.js`)).default, { + const rendered = await render((await import(`${cwd}/_output/server/main.svelte.js`)).default, { props: config.server_props ?? config.props ?? {}, idPrefix: config?.id_prefix }); @@ -80,8 +80,8 @@ const { test, run } = suite(async (config, cwd) => { const override = read(`${cwd}/_override.html`); const override_head = read(`${cwd}/_override_head.html`); - fs.writeFileSync(`${cwd}/_output/body.html`, rendered.html + '\n'); - target.innerHTML = override ?? rendered.html; + fs.writeFileSync(`${cwd}/_output/body.html`, rendered.body + '\n'); + target.innerHTML = override ?? rendered.body; if (rendered.head) { fs.writeFileSync(`${cwd}/_output/head.html`, rendered.head + '\n'); @@ -145,7 +145,7 @@ const { test, run } = suite(async (config, cwd) => { flushSync(); - const expected = read(`${cwd}/_expected.html`) ?? rendered.html; + const expected = read(`${cwd}/_expected.html`) ?? rendered.body; assert_html_equal(target.innerHTML, expected); if (rendered.head) { diff --git a/packages/svelte/tests/runtime-runes/samples/async-sole-if-child/Child.svelte b/packages/svelte/tests/runtime-runes/samples/async-sole-if-child/Child.svelte new file mode 100644 index 0000000000..304b7bd8a9 --- /dev/null +++ b/packages/svelte/tests/runtime-runes/samples/async-sole-if-child/Child.svelte @@ -0,0 +1,7 @@ + + +
+