diff --git a/.changeset/cold-beans-tease.md b/.changeset/cold-beans-tease.md new file mode 100644 index 000000000..dc02ea750 --- /dev/null +++ b/.changeset/cold-beans-tease.md @@ -0,0 +1,5 @@ +--- +'svelte': patch +--- + +fix: increment version when creating new source in Map.get or Map.has diff --git a/packages/svelte/src/reactivity/map.js b/packages/svelte/src/reactivity/map.js index 400f60708..e473bd529 100644 --- a/packages/svelte/src/reactivity/map.js +++ b/packages/svelte/src/reactivity/map.js @@ -45,6 +45,7 @@ export class ReactiveMap extends Map { if (ret !== undefined) { s = source(Symbol()); sources.set(key, s); + this.#increment_version(); } else { // We should always track the version in case // the Set ever gets this value in the future. @@ -77,6 +78,7 @@ export class ReactiveMap extends Map { if (ret !== undefined) { s = source(Symbol()); sources.set(key, s); + this.#increment_version(); } else { // We should always track the version in case // the Set ever gets this value in the future. diff --git a/packages/svelte/tests/runtime-runes/samples/reactive-map/_config.js b/packages/svelte/tests/runtime-runes/samples/reactive-map/_config.js index 03fa1bd9a..aad217813 100644 --- a/packages/svelte/tests/runtime-runes/samples/reactive-map/_config.js +++ b/packages/svelte/tests/runtime-runes/samples/reactive-map/_config.js @@ -2,10 +2,10 @@ import { flushSync } from '../../../../src/index-client'; import { test } from '../../test'; export default test({ - html: ``, + html: `
0:0
`, test({ assert, target }) { - const [btn, btn2, btn3] = target.querySelectorAll('button'); + const [btn, btn2, btn3, btn4, btn5] = target.querySelectorAll('button'); flushSync(() => { btn?.click(); @@ -13,38 +13,56 @@ export default test({ assert.htmlEqual( target.innerHTML, - `
1:1
` + `
0:1
` ); flushSync(() => { - btn?.click(); + btn2?.click(); }); + assert.htmlEqual( + target.innerHTML, + `
0:0
` + ); + flushSync(() => { - btn?.click(); + btn3?.click(); }); assert.htmlEqual( target.innerHTML, - `
1:1
2:2
3:3
` + `
0:0
2:2
` ); flushSync(() => { - btn2?.click(); + btn3?.click(); + }); + + flushSync(() => { + btn3?.click(); }); assert.htmlEqual( target.innerHTML, - `
1:1
2:2
` + `
0:0
2:2
3:3
4:4
` ); flushSync(() => { - btn3?.click(); + btn4?.click(); + }); + + assert.htmlEqual( + target.innerHTML, + `
0:0
2:2
3:3
` + ); + + flushSync(() => { + btn5?.click(); }); assert.htmlEqual( target.innerHTML, - `` + `` ); } }); diff --git a/packages/svelte/tests/runtime-runes/samples/reactive-map/main.svelte b/packages/svelte/tests/runtime-runes/samples/reactive-map/main.svelte index 703ef4cf9..d712b12a2 100644 --- a/packages/svelte/tests/runtime-runes/samples/reactive-map/main.svelte +++ b/packages/svelte/tests/runtime-runes/samples/reactive-map/main.svelte @@ -1,20 +1,46 @@ - + - + - + + + + + {#each state as [key, value]}
{key}:{value}