From 4c2fdcf65783e03ef6b19de82295a2b953c095a0 Mon Sep 17 00:00:00 2001
From: Rich Harris <richard.a.harris@gmail.com>
Date: Wed, 21 Nov 2018 16:44:06 -0500
Subject: [PATCH] fix contextual component bindings

---
 src/compile/render-dom/wrappers/Element/index.ts     |  2 ++
 .../render-dom/wrappers/InlineComponent/index.ts     | 12 +++++++++++-
 test/runtime/samples/bindings-coalesced/main.html    |  2 ++
 .../samples/component-binding-each/_config.js        |  2 +-
 .../runtime/samples/component-binding-each/main.html |  2 +-
 5 files changed, 17 insertions(+), 3 deletions(-)

diff --git a/src/compile/render-dom/wrappers/Element/index.ts b/src/compile/render-dom/wrappers/Element/index.ts
index d289b84c4c..bae2d00dc9 100644
--- a/src/compile/render-dom/wrappers/Element/index.ts
+++ b/src/compile/render-dom/wrappers/Element/index.ts
@@ -445,8 +445,10 @@ export default class ElementWrapper extends Wrapper {
 			const contextual_dependencies = new Set();
 
 			group.bindings.forEach(binding => {
+				// TODO this is a mess
 				addToSet(dependencies, binding.dependencies);
 				addToSet(contextual_dependencies, binding.contextual_dependencies);
+				addToSet(contextual_dependencies, binding.handler.contextual_dependencies);
 
 				if (!binding.updateDom) return;
 
diff --git a/src/compile/render-dom/wrappers/InlineComponent/index.ts b/src/compile/render-dom/wrappers/InlineComponent/index.ts
index 57875da004..654de5cac9 100644
--- a/src/compile/render-dom/wrappers/InlineComponent/index.ts
+++ b/src/compile/render-dom/wrappers/InlineComponent/index.ts
@@ -192,7 +192,17 @@ export default class InlineComponentWrapper extends Wrapper {
 
 			const contextual_dependencies = Array.from(binding.expression.contextual_dependencies);
 			const dependencies = Array.from(binding.expression.dependencies);
-			const lhs = component.source.slice(binding.expression.node.start, binding.expression.node.end).trim();
+
+			let lhs = component.source.slice(binding.expression.node.start, binding.expression.node.end).trim();
+
+			if (binding.isContextual && binding.expression.node.type === 'Identifier') {
+				// bind:x={y} — we can't just do `y = x`, we need to
+				// to `array[index] = x;
+				const { name } = binding.expression.node;
+				const { object, property, snippet } = block.bindings.get(name)();
+				lhs = snippet;
+				contextual_dependencies.push(object, property);
+			}
 
 			const args = ['value'];
 			if (contextual_dependencies.length > 0) {
diff --git a/test/runtime/samples/bindings-coalesced/main.html b/test/runtime/samples/bindings-coalesced/main.html
index 8b82af9e67..820c1812e9 100644
--- a/test/runtime/samples/bindings-coalesced/main.html
+++ b/test/runtime/samples/bindings-coalesced/main.html
@@ -1,6 +1,8 @@
 <script>
 	import Foo from './Foo.html';
 
+	export let p;
+
 	export let foo;
 	export let bar;
 	export let baz;
diff --git a/test/runtime/samples/component-binding-each/_config.js b/test/runtime/samples/component-binding-each/_config.js
index 13f3f9d7df..262ed9cdf4 100644
--- a/test/runtime/samples/component-binding-each/_config.js
+++ b/test/runtime/samples/component-binding-each/_config.js
@@ -18,7 +18,7 @@ export default {
 		inputs[0].value = 'blah';
 		await inputs[0].dispatchEvent(event);
 
-		assert.deepEqual(component.a, [ 'blah', 'bar', 'baz' ]);
+		assert.deepEqual(component.a, ['blah', 'bar', 'baz']);
 		assert.htmlEqual(target.innerHTML, `
 			<input><input><input>
 			<p>blah, bar, baz</p>
diff --git a/test/runtime/samples/component-binding-each/main.html b/test/runtime/samples/component-binding-each/main.html
index bb03ad531d..49ab04e68f 100644
--- a/test/runtime/samples/component-binding-each/main.html
+++ b/test/runtime/samples/component-binding-each/main.html
@@ -1,7 +1,7 @@
 <script>
 	import Widget from './Widget.html';
 
-	export let a = [ 'foo', 'bar', 'baz' ];
+	export let a = ['foo', 'bar', 'baz'];
 </script>
 
 {#each a as x}