From 1cc5bdb9ca475c6ab523efa8c30444505dbdef11 Mon Sep 17 00:00:00 2001 From: Tan Li Hau Date: Tue, 24 Nov 2020 00:57:44 +0800 Subject: [PATCH] reactive dependency not referenced can't set to undefined initially (#5600) --- CHANGELOG.md | 1 + src/compiler/compile/render_dom/Renderer.ts | 7 ++--- .../expected.js | 2 +- .../expected.js | 6 ++--- .../expected.js | 2 +- .../_config.js | 26 +++++++++++++++++++ .../main.svelte | 19 ++++++++++++++ 7 files changed, 55 insertions(+), 8 deletions(-) create mode 100644 test/runtime/samples/reactive-value-dependency-not-referenced/_config.js create mode 100644 test/runtime/samples/reactive-value-dependency-not-referenced/main.svelte diff --git a/CHANGELOG.md b/CHANGELOG.md index 29857123dc..81c7ddd138 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -2,6 +2,7 @@ ## Unreleased +* Fix setting reactive dependencies which don't appear in the template to `undefined` ([#5538](https://github.com/sveltejs/svelte/issues/5538)) * Fix ordering of elements when using `{#if}` inside `{#key}` ([#5680](https://github.com/sveltejs/svelte/issues/5680)) * Add `hasContext` lifecycle function ([#5690](https://github.com/sveltejs/svelte/pull/5690)) * Fix missing `walk` types in `svelte/compiler` ([#5696](https://github.com/sveltejs/svelte/pull/5696)) diff --git a/src/compiler/compile/render_dom/Renderer.ts b/src/compiler/compile/render_dom/Renderer.ts index fb04be1574..7db8cf645b 100644 --- a/src/compiler/compile/render_dom/Renderer.ts +++ b/src/compiler/compile/render_dom/Renderer.ts @@ -111,8 +111,9 @@ export default class Renderer { // these determine whether variable is included in initial context // array, so must have the highest priority - if (variable.export_name) member.priority += 16; - if (variable.referenced) member.priority += 32; + if (variable.is_reactive_dependency && (variable.mutated || variable.reassigned)) member.priority += 16; + if (variable.export_name) member.priority += 32; + if (variable.referenced) member.priority += 64; } else if (member.is_non_contextual) { // determine whether variable is included in initial context // array, so must have the highest priority @@ -131,7 +132,7 @@ export default class Renderer { while (i--) { const member = this.context[i]; if (member.variable) { - if (member.variable.referenced || member.variable.export_name) break; + if (member.variable.referenced || member.variable.export_name || (member.variable.is_reactive_dependency && (member.variable.mutated || member.variable.reassigned))) break; } else if (member.is_non_contextual) { break; } diff --git a/test/js/samples/instrumentation-script-main-block/expected.js b/test/js/samples/instrumentation-script-main-block/expected.js index bc80924602..a471a50b37 100644 --- a/test/js/samples/instrumentation-script-main-block/expected.js +++ b/test/js/samples/instrumentation-script-main-block/expected.js @@ -62,7 +62,7 @@ function instance($$self, $$props, $$invalidate) { } }; - return [x]; + return [x, y]; } class Component extends SvelteComponent { diff --git a/test/js/samples/reactive-values-non-topologically-ordered/expected.js b/test/js/samples/reactive-values-non-topologically-ordered/expected.js index 15290496d5..dbfd794dc7 100644 --- a/test/js/samples/reactive-values-non-topologically-ordered/expected.js +++ b/test/js/samples/reactive-values-non-topologically-ordered/expected.js @@ -12,15 +12,15 @@ function instance($$self, $$props, $$invalidate) { $$self.$$.update = () => { if ($$self.$$.dirty & /*x*/ 1) { - $: $$invalidate(2, b = x); + $: $$invalidate(1, b = x); } - if ($$self.$$.dirty & /*b*/ 4) { + if ($$self.$$.dirty & /*b*/ 2) { $: a = b; } }; - return [x]; + return [x, b]; } class Component extends SvelteComponent { diff --git a/test/js/samples/unreferenced-state-not-invalidated/expected.js b/test/js/samples/unreferenced-state-not-invalidated/expected.js index b10ea815b9..599d18f114 100644 --- a/test/js/samples/unreferenced-state-not-invalidated/expected.js +++ b/test/js/samples/unreferenced-state-not-invalidated/expected.js @@ -64,7 +64,7 @@ function instance($$self, $$props, $$invalidate) { }; $: x = a * 2; - return [y]; + return [y, b]; } class Component extends SvelteComponent { diff --git a/test/runtime/samples/reactive-value-dependency-not-referenced/_config.js b/test/runtime/samples/reactive-value-dependency-not-referenced/_config.js new file mode 100644 index 0000000000..893b183d78 --- /dev/null +++ b/test/runtime/samples/reactive-value-dependency-not-referenced/_config.js @@ -0,0 +1,26 @@ +export default { + html: ` +

42

+

42

+ `, + + async test({ assert, component, target }) { + await component.updateStore(undefined); + assert.htmlEqual(target.innerHTML, '

undefined

42

'); + + await component.updateStore(33); + assert.htmlEqual(target.innerHTML, '

33

42

'); + + await component.updateStore(undefined); + assert.htmlEqual(target.innerHTML, '

undefined

42

'); + + await component.updateVar(undefined); + assert.htmlEqual(target.innerHTML, '

undefined

undefined

'); + + await component.updateVar(33); + assert.htmlEqual(target.innerHTML, '

undefined

33

'); + + await component.updateVar(undefined); + assert.htmlEqual(target.innerHTML, '

undefined

undefined

'); + } +}; diff --git a/test/runtime/samples/reactive-value-dependency-not-referenced/main.svelte b/test/runtime/samples/reactive-value-dependency-not-referenced/main.svelte new file mode 100644 index 0000000000..57e6ba84f3 --- /dev/null +++ b/test/runtime/samples/reactive-value-dependency-not-referenced/main.svelte @@ -0,0 +1,19 @@ + + +

{ value }

+

{ value2 }

\ No newline at end of file