From 36e188b5c681b55983183c52a1685a45af449f28 Mon Sep 17 00:00:00 2001 From: Simon Holthausen Date: Mon, 21 Jul 2025 15:18:57 +0200 Subject: [PATCH] fix: ensure subscriptions are picked up correctly by deriveds Increment the version to ensure any dependent deriveds are marked dirty when the subscription is picked up again later. If we didn't do this then the comparison of write versions would determine that the derived has a later version than the subscriber, and it would not be re-run. Fixes #16311 Fixes #15888 --- .changeset/fresh-penguins-impress.md | 5 +++ .../src/reactivity/create-subscriber.js | 4 ++ .../samples/store-inside-derived/_config.js | 45 +++++++++++++++++++ .../samples/store-inside-derived/main.svelte | 36 +++++++++++++++ 4 files changed, 90 insertions(+) create mode 100644 .changeset/fresh-penguins-impress.md create mode 100644 packages/svelte/tests/runtime-runes/samples/store-inside-derived/_config.js create mode 100644 packages/svelte/tests/runtime-runes/samples/store-inside-derived/main.svelte diff --git a/.changeset/fresh-penguins-impress.md b/.changeset/fresh-penguins-impress.md new file mode 100644 index 0000000000..35ff4f0aaa --- /dev/null +++ b/.changeset/fresh-penguins-impress.md @@ -0,0 +1,5 @@ +--- +'svelte': patch +--- + +fix: ensure subscriptions are picked up correctly by deriveds diff --git a/packages/svelte/src/reactivity/create-subscriber.js b/packages/svelte/src/reactivity/create-subscriber.js index 4dcac4e6f6..6f9313eb0a 100644 --- a/packages/svelte/src/reactivity/create-subscriber.js +++ b/packages/svelte/src/reactivity/create-subscriber.js @@ -82,6 +82,10 @@ export function createSubscriber(start) { if (subscribers === 0) { stop?.(); stop = undefined; + // Increment the version to ensure any dependent deriveds are marked dirty when the subscription is picked up again later. + // If we didn't do this then the comparison of write versions would determine that the derived has a later version than + // the subscriber, and it would not be re-run. + increment(version); } }); }; diff --git a/packages/svelte/tests/runtime-runes/samples/store-inside-derived/_config.js b/packages/svelte/tests/runtime-runes/samples/store-inside-derived/_config.js new file mode 100644 index 0000000000..de078b1e75 --- /dev/null +++ b/packages/svelte/tests/runtime-runes/samples/store-inside-derived/_config.js @@ -0,0 +1,45 @@ +import { flushSync } from 'svelte'; +import { test } from '../../test'; + +export default test({ + test: ({ assert, target }) => { + const [loading, increment] = target.querySelectorAll('button'); + + assert.htmlEqual( + target.innerHTML, + ` +
$value: 0
+
valueFromStore.current: 0
+
valueDerivedCurrent: 0
+ + + ` + ); + + loading.click(); + flushSync(); + assert.htmlEqual( + target.innerHTML, + ` +
$value: Loading...
+
valueFromStore.current: Loading...
+
valueDerivedCurrent: Loading...
+ + + ` + ); + + increment.click(); + flushSync(); + assert.htmlEqual( + target.innerHTML, + ` +
$value: 1
+
valueFromStore.current: 1
+
valueDerivedCurrent: 1
+ + + ` + ); + } +}); diff --git a/packages/svelte/tests/runtime-runes/samples/store-inside-derived/main.svelte b/packages/svelte/tests/runtime-runes/samples/store-inside-derived/main.svelte new file mode 100644 index 0000000000..06d0a0d4b4 --- /dev/null +++ b/packages/svelte/tests/runtime-runes/samples/store-inside-derived/main.svelte @@ -0,0 +1,36 @@ + + +
+ $value: {isLoading ? 'Loading...' : $value} +
+ +
+ valueFromStore.current: {isLoading ? 'Loading...' : valueFromStore.current} +
+ +
+ valueDerivedCurrent: {isLoading ? 'Loading...' : valueDerivedCurrent} +
+ + + +