From b3f54bd2cffa3c9f146b62f10565a5d98f068a84 Mon Sep 17 00:00:00 2001
From: Tan Li Hau <tanhauhau@users.noreply.github.com>
Date: Sat, 19 Sep 2020 00:17:36 +0800
Subject: [PATCH] fix store direct property assignment (#5416)

---
 CHANGELOG.md                                  |  1 +
 src/compiler/compile/render_dom/invalidate.ts |  2 +-
 .../_config.js                                | 32 +++++++++++++++++++
 .../main.svelte                               | 24 ++++++++++++++
 4 files changed, 58 insertions(+), 1 deletion(-)
 create mode 100644 test/runtime/samples/store-assignment-updates-property/_config.js
 create mode 100644 test/runtime/samples/store-assignment-updates-property/main.svelte

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 8d953183bf..d74279c2e0 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -3,6 +3,7 @@
 ## Unreleased
 
 * Support `_` as numeric separator ([#5407](https://github.com/sveltejs/svelte/issues/5407))
+* Fix assignments to properties on store values ([#5412](https://github.com/sveltejs/svelte/issues/5412))
 * Support `import.meta` in template expressions ([#5422](https://github.com/sveltejs/svelte/issues/5422))
 
 ## 3.25.1
diff --git a/src/compiler/compile/render_dom/invalidate.ts b/src/compiler/compile/render_dom/invalidate.ts
index c7d9759ccd..b045db079f 100644
--- a/src/compiler/compile/render_dom/invalidate.ts
+++ b/src/compiler/compile/render_dom/invalidate.ts
@@ -62,7 +62,7 @@ export function invalidate(renderer: Renderer, scope: Scope, node: Node, names:
 			}
 
 			let invalidate = is_store_value
-				? x`@set_store_value(${head.name.slice(1)}, ${node}, ${extra_args})`
+				? x`@set_store_value(${head.name.slice(1)}, ${node}, ${head.name})`
 				: !main_execution_context
 					? x`$$invalidate(${renderer.context_lookup.get(head.name).index}, ${node}, ${extra_args})`
 					: extra_args.length
diff --git a/test/runtime/samples/store-assignment-updates-property/_config.js b/test/runtime/samples/store-assignment-updates-property/_config.js
new file mode 100644
index 0000000000..65df38f9e4
--- /dev/null
+++ b/test/runtime/samples/store-assignment-updates-property/_config.js
@@ -0,0 +1,32 @@
+export default {
+	html: `
+		<p>a: {"foo":3,"bar":2}</p>
+		<p>b: {"foo":3}</p>
+		<button></button>
+		<button></button>
+	`,
+	skip_if_ssr: true,
+
+	async test({ assert, component, target, window }) {
+		const [btn1, btn2] = target.querySelectorAll('button');
+		const click = new window.MouseEvent('click');
+
+		await btn1.dispatchEvent(click);
+
+		assert.htmlEqual(target.innerHTML, `
+			<p>a: {"foo":4,"bar":2}</p>
+			<p>b: {"foo":4,"baz":0}</p>
+			<button></button>
+			<button></button>
+		`);
+
+		await btn2.dispatchEvent(click);
+
+		assert.htmlEqual(target.innerHTML, `
+			<p>a: {"foo":5,"bar":2}</p>
+			<p>b: {"foo":5,"qux":0}</p>
+			<button></button>
+			<button></button>
+		`);
+	}
+};
\ No newline at end of file
diff --git a/test/runtime/samples/store-assignment-updates-property/main.svelte b/test/runtime/samples/store-assignment-updates-property/main.svelte
new file mode 100644
index 0000000000..c3196a278c
--- /dev/null
+++ b/test/runtime/samples/store-assignment-updates-property/main.svelte
@@ -0,0 +1,24 @@
+<script>
+	import { writable } from '../../../../store';
+
+	const a = writable({ foo: 1, bar: 2 });
+	$a.foo = 3;
+
+	const b = writable({ foo: 1, bar: 2 });
+	$b = { foo: 3 };
+
+	function update() {
+		$a.foo = $a.foo + 1;
+		$b = { foo: $b.foo + 1, qux: 0 };
+	}
+</script>
+
+<p>a: {JSON.stringify($a)}</p>
+<p>b: {JSON.stringify($b)}</p>
+
+<button on:click={() => {
+	$a.foo = $a.foo + 1;
+	$b = { foo: $b.foo + 1, baz: 0 };
+}} />
+
+<button on:click={update} />
\ No newline at end of file