From 88f2fcfbb5392282daf06e0f700d77c5ccfcb455 Mon Sep 17 00:00:00 2001
From: Peter Maatman <blackwolf12333@gmail.com>
Date: Sun, 29 Sep 2019 16:26:45 +0200
Subject: [PATCH 1/6] tests: add test that exposes #3634

---
 .../reactive-compound-operator/_config.js     | 27 +++++++++++++++++++
 .../reactive-compound-operator/main.svelte    |  8 ++++++
 2 files changed, 35 insertions(+)
 create mode 100644 test/runtime/samples/reactive-compound-operator/_config.js
 create mode 100644 test/runtime/samples/reactive-compound-operator/main.svelte

diff --git a/test/runtime/samples/reactive-compound-operator/_config.js b/test/runtime/samples/reactive-compound-operator/_config.js
new file mode 100644
index 000000000000..7b16676410b2
--- /dev/null
+++ b/test/runtime/samples/reactive-compound-operator/_config.js
@@ -0,0 +1,27 @@
+export default {
+	html: `
+		<button>+1</button>
+		<p>count:0</p>
+	`,
+
+	async test({ assert, component, target, window }) {
+		const click = new window.MouseEvent('click');
+		const button = target.querySelector('button');
+
+		await button.dispatchEvent(click);
+
+		assert.equal(component.x, 2);
+		assert.htmlEqual(target.innerHTML, `
+			<button>+1</button>
+			<p>count:2</p>
+		`);
+
+		await button.dispatchEvent(click);
+
+		assert.equal(component.x, 6);
+		assert.htmlEqual(target.innerHTML, `
+			<button>+1</button>
+			<p>count:6</p>
+		`);
+	}
+};
diff --git a/test/runtime/samples/reactive-compound-operator/main.svelte b/test/runtime/samples/reactive-compound-operator/main.svelte
new file mode 100644
index 000000000000..611dde7176f6
--- /dev/null
+++ b/test/runtime/samples/reactive-compound-operator/main.svelte
@@ -0,0 +1,8 @@
+<script>
+	export let x = 0;
+
+    $: x *= 2;
+</script>
+
+<button on:click='{() => x += 1}'>+1</button>
+<p>count:{x}</p>

From d57204bc6ffcd7c94219dd6db7418f9568fefb56 Mon Sep 17 00:00:00 2001
From: Peter Maatman <blackwolf12333@gmail.com>
Date: Sun, 29 Sep 2019 17:06:30 +0200
Subject: [PATCH 2/6] Fix #3634: Add left hand side of compound assignment as
 dependency

Compound assignments ('x += y', 'x *= y', etc) should have the
left-hand side of the assignment as a dependency.
---
 src/compiler/compile/Component.ts | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

diff --git a/src/compiler/compile/Component.ts b/src/compiler/compile/Component.ts
index fa8665ffde50..54d86689fd3f 100644
--- a/src/compiler/compile/Component.ts
+++ b/src/compiler/compile/Component.ts
@@ -46,6 +46,9 @@ childKeys.EachBlock = childKeys.IfBlock = ['children', 'else'];
 childKeys.Attribute = ['value'];
 childKeys.ExportNamedDeclaration = ['declaration', 'specifiers'];
 
+// There is no datatype that describes only the compound operators so we create this list here
+const compoundAssignmentOperators = ["+=" , "-=" ,"*=", "/=" ,"%=" ,"**=", "<<=" ,">>=", ">>>=", "|=" ,"^=" ,"&="];
+
 function remove_node(
 	code: MagicString,
 	start: number,
@@ -1265,10 +1268,18 @@ export default class Component {
 						}
 
 						if (node.type === 'AssignmentExpression') {
-							extract_identifiers(get_object(node.left)).forEach(node => {
+							const left = get_object(node.left);
+
+							extract_identifiers(left).forEach(node => {
 								assignee_nodes.add(node);
 								assignees.add(node.name);
 							});
+
+
+
+							if (compoundAssignmentOperators.findIndex(op => op === node.operator) !== -1) {
+								dependencies.add(left.name);
+							}
 						} else if (node.type === 'UpdateExpression') {
 							const identifier = get_object(node.argument);
 							assignees.add(identifier.name);

From 1998739524c8c9992068ab701f182141a0c8ee58 Mon Sep 17 00:00:00 2001
From: Peter Maatman <blackwolf12333@gmail.com>
Date: Sun, 29 Sep 2019 19:28:00 +0200
Subject: [PATCH 3/6] tests: add tests for update expression

---
 .../reactive-update-expression/_config.js     | 29 +++++++++++++++++++
 .../reactive-update-expression/main.svelte    | 12 ++++++++
 2 files changed, 41 insertions(+)
 create mode 100644 test/runtime/samples/reactive-update-expression/_config.js
 create mode 100644 test/runtime/samples/reactive-update-expression/main.svelte

diff --git a/test/runtime/samples/reactive-update-expression/_config.js b/test/runtime/samples/reactive-update-expression/_config.js
new file mode 100644
index 000000000000..c90da8255e3b
--- /dev/null
+++ b/test/runtime/samples/reactive-update-expression/_config.js
@@ -0,0 +1,29 @@
+export default {
+	html: `
+	<button>+1</button>
+	<p>count:1</p>
+	`,
+
+	async test({ assert, component, target, window }) {
+		const click = new window.MouseEvent('click');
+		const button = target.querySelector('button');
+
+		assert.equal(component.x, 1);
+
+		await button.dispatchEvent(click);
+
+		assert.equal(component.x, 3);
+		assert.htmlEqual(target.innerHTML, `
+			<button>+1</button>
+			<p>count:3</p>
+		`);
+
+		await button.dispatchEvent(click);
+
+		assert.equal(component.x, 5);
+		assert.htmlEqual(target.innerHTML, `
+			<button>+1</button>
+			<p>count:5</p>
+		`);
+	}
+};
diff --git a/test/runtime/samples/reactive-update-expression/main.svelte b/test/runtime/samples/reactive-update-expression/main.svelte
new file mode 100644
index 000000000000..887d7a57e86c
--- /dev/null
+++ b/test/runtime/samples/reactive-update-expression/main.svelte
@@ -0,0 +1,12 @@
+<script>
+	export let x = 0;
+
+    $: x++;
+
+    function onClick() {
+      x += 1;
+    }
+</script>
+
+<button on:click='{() => x += 1}'>+1</button>
+<p>count:{x}</p>

From 253615fed545a74212910033ff1603db1ad8468a Mon Sep 17 00:00:00 2001
From: Conduitry <git@chor.date>
Date: Fri, 4 Oct 2019 08:17:53 -0400
Subject: [PATCH 4/6] tidy tests

---
 .../samples/reactive-compound-operator/_config.js      |  4 ++--
 .../samples/reactive-compound-operator/main.svelte     |  4 ++--
 .../samples/reactive-update-expression/_config.js      |  4 ++--
 .../samples/reactive-update-expression/main.svelte     | 10 +++++-----
 4 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/test/runtime/samples/reactive-compound-operator/_config.js b/test/runtime/samples/reactive-compound-operator/_config.js
index 7b16676410b2..94a726f403b8 100644
--- a/test/runtime/samples/reactive-compound-operator/_config.js
+++ b/test/runtime/samples/reactive-compound-operator/_config.js
@@ -13,7 +13,7 @@ export default {
 		assert.equal(component.x, 2);
 		assert.htmlEqual(target.innerHTML, `
 			<button>+1</button>
-			<p>count:2</p>
+			<p>count: 2</p>
 		`);
 
 		await button.dispatchEvent(click);
@@ -21,7 +21,7 @@ export default {
 		assert.equal(component.x, 6);
 		assert.htmlEqual(target.innerHTML, `
 			<button>+1</button>
-			<p>count:6</p>
+			<p>count: 6</p>
 		`);
 	}
 };
diff --git a/test/runtime/samples/reactive-compound-operator/main.svelte b/test/runtime/samples/reactive-compound-operator/main.svelte
index 611dde7176f6..52654aed59df 100644
--- a/test/runtime/samples/reactive-compound-operator/main.svelte
+++ b/test/runtime/samples/reactive-compound-operator/main.svelte
@@ -1,8 +1,8 @@
 <script>
 	export let x = 0;
 
-    $: x *= 2;
+	$: x *= 2;
 </script>
 
 <button on:click='{() => x += 1}'>+1</button>
-<p>count:{x}</p>
+<p>count: {x}</p>
diff --git a/test/runtime/samples/reactive-update-expression/_config.js b/test/runtime/samples/reactive-update-expression/_config.js
index c90da8255e3b..1355e165a44d 100644
--- a/test/runtime/samples/reactive-update-expression/_config.js
+++ b/test/runtime/samples/reactive-update-expression/_config.js
@@ -15,7 +15,7 @@ export default {
 		assert.equal(component.x, 3);
 		assert.htmlEqual(target.innerHTML, `
 			<button>+1</button>
-			<p>count:3</p>
+			<p>count: 3</p>
 		`);
 
 		await button.dispatchEvent(click);
@@ -23,7 +23,7 @@ export default {
 		assert.equal(component.x, 5);
 		assert.htmlEqual(target.innerHTML, `
 			<button>+1</button>
-			<p>count:5</p>
+			<p>count: 5</p>
 		`);
 	}
 };
diff --git a/test/runtime/samples/reactive-update-expression/main.svelte b/test/runtime/samples/reactive-update-expression/main.svelte
index 887d7a57e86c..0e0b45ddd684 100644
--- a/test/runtime/samples/reactive-update-expression/main.svelte
+++ b/test/runtime/samples/reactive-update-expression/main.svelte
@@ -1,12 +1,12 @@
 <script>
 	export let x = 0;
 
-    $: x++;
+  $: x++;
 
-    function onClick() {
-      x += 1;
-    }
+  function onClick() {
+    x += 1;
+  }
 </script>
 
 <button on:click='{() => x += 1}'>+1</button>
-<p>count:{x}</p>
+<p>count: {x}</p>

From 5f1b3c1b54e902f794d643e1a830497ad80a3554 Mon Sep 17 00:00:00 2001
From: Conduitry <git@chor.date>
Date: Fri, 4 Oct 2019 08:20:27 -0400
Subject: [PATCH 5/6] tidy assignment operator check

---
 src/compiler/compile/Component.ts | 7 +------
 1 file changed, 1 insertion(+), 6 deletions(-)

diff --git a/src/compiler/compile/Component.ts b/src/compiler/compile/Component.ts
index 54d86689fd3f..423186e4f393 100644
--- a/src/compiler/compile/Component.ts
+++ b/src/compiler/compile/Component.ts
@@ -46,9 +46,6 @@ childKeys.EachBlock = childKeys.IfBlock = ['children', 'else'];
 childKeys.Attribute = ['value'];
 childKeys.ExportNamedDeclaration = ['declaration', 'specifiers'];
 
-// There is no datatype that describes only the compound operators so we create this list here
-const compoundAssignmentOperators = ["+=" , "-=" ,"*=", "/=" ,"%=" ,"**=", "<<=" ,">>=", ">>>=", "|=" ,"^=" ,"&="];
-
 function remove_node(
 	code: MagicString,
 	start: number,
@@ -1275,9 +1272,7 @@ export default class Component {
 								assignees.add(node.name);
 							});
 
-
-
-							if (compoundAssignmentOperators.findIndex(op => op === node.operator) !== -1) {
+							if (node.operator !== '=') {
 								dependencies.add(left.name);
 							}
 						} else if (node.type === 'UpdateExpression') {

From 46af4917a79f00859ab97392c930edefd9a2725d Mon Sep 17 00:00:00 2001
From: Conduitry <git@chor.date>
Date: Fri, 4 Oct 2019 08:29:53 -0400
Subject: [PATCH 6/6] oops

---
 test/runtime/samples/reactive-compound-operator/_config.js | 2 +-
 test/runtime/samples/reactive-update-expression/_config.js | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/test/runtime/samples/reactive-compound-operator/_config.js b/test/runtime/samples/reactive-compound-operator/_config.js
index 94a726f403b8..dd59fbbf0a70 100644
--- a/test/runtime/samples/reactive-compound-operator/_config.js
+++ b/test/runtime/samples/reactive-compound-operator/_config.js
@@ -1,7 +1,7 @@
 export default {
 	html: `
 		<button>+1</button>
-		<p>count:0</p>
+		<p>count: 0</p>
 	`,
 
 	async test({ assert, component, target, window }) {
diff --git a/test/runtime/samples/reactive-update-expression/_config.js b/test/runtime/samples/reactive-update-expression/_config.js
index 1355e165a44d..111460f7dd82 100644
--- a/test/runtime/samples/reactive-update-expression/_config.js
+++ b/test/runtime/samples/reactive-update-expression/_config.js
@@ -1,7 +1,7 @@
 export default {
 	html: `
 	<button>+1</button>
-	<p>count:1</p>
+	<p>count: 1</p>
 	`,
 
 	async test({ assert, component, target, window }) {