diff --git a/packages/svelte/src/internal/client/dom/blocks/boundary.js b/packages/svelte/src/internal/client/dom/blocks/boundary.js index 2ead0aed53..c57f46334e 100644 --- a/packages/svelte/src/internal/client/dom/blocks/boundary.js +++ b/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)); } diff --git a/packages/svelte/tests/runtime-runes/samples/async-attribute/_config.js b/packages/svelte/tests/runtime-runes/samples/async-attribute/_config.js index b8a450b338..5c057119d9 100644 --- a/packages/svelte/tests/runtime-runes/samples/async-attribute/_config.js +++ b/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, '
hello
'); d = deferred(); diff --git a/packages/svelte/tests/runtime-runes/samples/async-derived/_config.js b/packages/svelte/tests/runtime-runes/samples/async-derived/_config.js index 0a18aa9b2c..434853bd78 100644 --- a/packages/svelte/tests/runtime-runes/samples/async-derived/_config.js +++ b/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, '42
'); component.num = 2; diff --git a/packages/svelte/tests/runtime-runes/samples/async-each/_config.js b/packages/svelte/tests/runtime-runes/samples/async-each/_config.js index b50cb1969e..89194b9632 100644 --- a/packages/svelte/tests/runtime-runes/samples/async-each/_config.js +++ b/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, 'a
b
c
'); d = deferred(); diff --git a/packages/svelte/tests/runtime-runes/samples/async-expression/_config.js b/packages/svelte/tests/runtime-runes/samples/async-expression/_config.js index 26333c05fc..b593155946 100644 --- a/packages/svelte/tests/runtime-runes/samples/async-expression/_config.js +++ b/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, 'hello
'); } }); diff --git a/packages/svelte/tests/runtime-runes/samples/async-if/_config.js b/packages/svelte/tests/runtime-runes/samples/async-if/_config.js index 286595a977..7d73582248 100644 --- a/packages/svelte/tests/runtime-runes/samples/async-if/_config.js +++ b/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, 'hello
'); } });