diff --git a/.changeset/async-store-sub-blocker.md b/.changeset/async-store-sub-blocker.md new file mode 100644 index 0000000000..0222dac846 --- /dev/null +++ b/.changeset/async-store-sub-blocker.md @@ -0,0 +1,5 @@ +--- +'svelte': patch +--- + +fix: block template store subscriptions on the promise that assigns the store diff --git a/packages/svelte/src/compiler/phases/2-analyze/index.js b/packages/svelte/src/compiler/phases/2-analyze/index.js index 67e9030188..2044ac562d 100644 --- a/packages/svelte/src/compiler/phases/2-analyze/index.js +++ b/packages/svelte/src/compiler/phases/2-analyze/index.js @@ -1265,6 +1265,13 @@ function calculate_blockers(instance, analysis) { binding.blocker = /** @type {typeof binding['blocker']} */ (blocker); } + + // a store subscription must wait on whatever blocks the store itself + for (const [name, binding] of instance.scope.declarations) { + if (binding.kind === 'store_sub') { + binding.blocker ??= instance.scope.get(name.slice(1))?.blocker ?? null; + } + } } /** diff --git a/packages/svelte/tests/runtime-runes/samples/async-store-sub-blocker/_config.js b/packages/svelte/tests/runtime-runes/samples/async-store-sub-blocker/_config.js new file mode 100644 index 0000000000..e120a4bed5 --- /dev/null +++ b/packages/svelte/tests/runtime-runes/samples/async-store-sub-blocker/_config.js @@ -0,0 +1,13 @@ +import { tick } from 'svelte'; +import { test } from '../../test'; + +// Tests that a store subscription only present in the template waits for the +// promise that assigns the store instead of subscribing to `undefined`. +export default test({ + mode: ['client', 'hydrate', 'async-server'], + ssrHtml: '

hello

', + async test({ assert, target }) { + await tick(); + assert.htmlEqual(target.innerHTML, '

hello

'); + } +}); diff --git a/packages/svelte/tests/runtime-runes/samples/async-store-sub-blocker/main.svelte b/packages/svelte/tests/runtime-runes/samples/async-store-sub-blocker/main.svelte new file mode 100644 index 0000000000..a385400a8f --- /dev/null +++ b/packages/svelte/tests/runtime-runes/samples/async-store-sub-blocker/main.svelte @@ -0,0 +1,11 @@ + + +

{$store}