fix hydration

packages/svelte/src/internal/client/dom/blocks/boundary.js

@@ -1,6 +1,6 @@
 /** @import { Effect, TemplateNode, } from '#client' */
 
-import { BOUNDARY_EFFECT, EFFECT_TRANSPARENT } from '../../constants.js';
+import { BOUNDARY_EFFECT, DESTROYED, EFFECT_TRANSPARENT } from '../../constants.js';
 import {
 	block,
 	branch,
@@ -27,7 +27,7 @@ import {
 	set_hydrate_node
 } from '../hydration.js';
 import { get_next_sibling } from '../operations.js';
-import { queue_boundary_micro_task } from '../task.js';
+import { queue_boundary_micro_task, queue_post_micro_task } from '../task.js';
 
 const ASYNC_INCREMENT = Symbol();
 const ASYNC_DECREMENT = Symbol();
@@ -231,6 +231,14 @@ export function boundary(node, props, boundary_fn) {
 			// need to use hydration boundary comments to report whether
 			// the pending or main block was rendered for a given
 			// boundary, and hydrate accordingly
+			queueMicrotask(() => {
+				if ((!boundary_effect || boundary_effect.f & DESTROYED) !== 0) return;
+
+				destroy_effect(boundary_effect);
+				with_boundary(boundary, () => {
+					boundary_effect = branch(() => boundary_fn(anchor));
+				});
+			});
 		} else {
 			boundary_effect = branch(() => boundary_fn(anchor));
 		}

packages/svelte/tests/runtime-runes/samples/async-attribute/_config.js

@@ -1,4 +1,4 @@
-import { tick } from 'svelte';
+import { flushSync, tick } from 'svelte';
 import { deferred } from '../../../../src/internal/shared/utils.js';
 import { test } from '../../test';
 
@@ -22,6 +22,7 @@ export default test({
 		await Promise.resolve();
 		await Promise.resolve();
 		await tick();
+		flushSync();
 		assert.htmlEqual(target.innerHTML, '<p class="cool">hello</p>');
 
 		d = deferred();

packages/svelte/tests/runtime-runes/samples/async-derived/_config.js

@@ -1,4 +1,4 @@
-import { tick } from 'svelte';
+import { flushSync, tick } from 'svelte';
 import { deferred } from '../../../../src/internal/shared/utils.js';
 import { test } from '../../test';
 
@@ -24,6 +24,7 @@ export default test({
 		await Promise.resolve();
 		await Promise.resolve();
 		await tick();
+		flushSync();
 		assert.htmlEqual(target.innerHTML, '<p>42</p>');
 
 		component.num = 2;

packages/svelte/tests/runtime-runes/samples/async-each/_config.js

@@ -1,4 +1,4 @@
-import { tick } from 'svelte';
+import { flushSync, tick } from 'svelte';
 import { deferred } from '../../../../src/internal/shared/utils.js';
 import { test } from '../../test';
 
@@ -22,6 +22,7 @@ export default test({
 		await Promise.resolve();
 		await Promise.resolve();
 		await tick();
+		flushSync();
 		assert.htmlEqual(target.innerHTML, '<p>a</p><p>b</p><p>c</p>');
 
 		d = deferred();

packages/svelte/tests/runtime-runes/samples/async-expression/_config.js

@@ -1,4 +1,4 @@
-import { tick } from 'svelte';
+import { flushSync, tick } from 'svelte';
 import { deferred } from '../../../../src/internal/shared/utils.js';
 import { test } from '../../test';
 
@@ -22,6 +22,7 @@ export default test({
 		await Promise.resolve();
 		await Promise.resolve();
 		await tick();
+		flushSync();
 		assert.htmlEqual(target.innerHTML, '<p>hello</p>');
 	}
 });

packages/svelte/tests/runtime-runes/samples/async-if/_config.js

@@ -1,4 +1,4 @@
-import { tick } from 'svelte';
+import { flushSync, tick } from 'svelte';
 import { deferred } from '../../../../src/internal/shared/utils.js';
 import { test } from '../../test';
 
@@ -22,6 +22,7 @@ export default test({
 		await Promise.resolve();
 		await Promise.resolve();
 		await tick();
+		flushSync();
 		assert.htmlEqual(target.innerHTML, '<h1>yes</h1>');
 
 		d = deferred();

packages/svelte/tests/runtime-runes/samples/async-key/_config.js

@@ -1,4 +1,4 @@
-import { tick } from 'svelte';
+import { flushSync, tick } from 'svelte';
 import { deferred } from '../../../../src/internal/shared/utils.js';
 import { test } from '../../test';
 
@@ -22,6 +22,7 @@ export default test({
 		await Promise.resolve();
 		await Promise.resolve();
 		await tick();
+		flushSync();
 		assert.htmlEqual(target.innerHTML, '<h1>hello</h1>');
 
 		const h1 = target.querySelector('h1');

packages/svelte/tests/runtime-runes/samples/async-prop/_config.js

@@ -1,4 +1,4 @@
-import { tick } from 'svelte';
+import { flushSync, tick } from 'svelte';
 import { deferred } from '../../../../src/internal/shared/utils.js';
 import { test } from '../../test';
 
@@ -22,6 +22,7 @@ export default test({
 		await Promise.resolve();
 		await Promise.resolve();
 		await tick();
+		flushSync();
 		assert.htmlEqual(target.innerHTML, '<h1>hello</h1>');
 
 		d = deferred();

packages/svelte/tests/runtime-runes/samples/async-top-level/_config.js

@@ -1,4 +1,4 @@
-import { tick } from 'svelte';
+import { flushSync, tick } from 'svelte';
 import { deferred } from '../../../../src/internal/shared/utils.js';
 import { test } from '../../test';
 
@@ -20,6 +20,7 @@ export default test({
 		d.resolve('hello');
 		await Promise.resolve();
 		await tick();
+		flushSync();
 		assert.htmlEqual(target.innerHTML, '<p>hello</p>');
 	}
 });