From 073c8762ef951342237b4b5719d6ad35c1a3ca01 Mon Sep 17 00:00:00 2001
From: Rich Harris <richard.a.harris@gmail.com>
Date: Wed, 24 Oct 2018 08:30:50 -0400
Subject: [PATCH] extend dependency tracking to all directives

---
 .../render-dom/wrappers/Element/index.ts      | 17 ++++++++-------
 .../event-handler-each-context/_config.js     | 21 +++++++++++++++++++
 .../event-handler-each-context/main.html      |  5 +++++
 3 files changed, 36 insertions(+), 7 deletions(-)
 create mode 100644 test/runtime/samples/event-handler-each-context/_config.js
 create mode 100644 test/runtime/samples/event-handler-each-context/main.html

diff --git a/src/compile/render-dom/wrappers/Element/index.ts b/src/compile/render-dom/wrappers/Element/index.ts
index bcdaf5a3d6..83647953b4 100644
--- a/src/compile/render-dom/wrappers/Element/index.ts
+++ b/src/compile/render-dom/wrappers/Element/index.ts
@@ -163,13 +163,16 @@ export default class ElementWrapper extends Wrapper {
 			block.addAnimation();
 		}
 
-		if (node.classes) {
-			node.classes.forEach(({ expression }) => {
-				if (expression) {
-					block.addDependencies(expression.dependencies);
-				}
-			});
-		}
+		// add directive and handler dependencies
+		[node.animation, node.outro, ...node.actions, ...node.classes].forEach(directive => {
+			if (directive && directive.expression) {
+				block.addDependencies(directive.expression.dependencies);
+			}
+		});
+
+		node.handlers.forEach(handler => {
+			block.addDependencies(handler.dependencies);
+		});
 
 		if (this.parent) {
 			if (node.actions.length > 0) this.parent.cannotUseInnerHTML();
diff --git a/test/runtime/samples/event-handler-each-context/_config.js b/test/runtime/samples/event-handler-each-context/_config.js
new file mode 100644
index 0000000000..73358545d3
--- /dev/null
+++ b/test/runtime/samples/event-handler-each-context/_config.js
@@ -0,0 +1,21 @@
+export default {
+	data: {
+		items: [
+			'whatever'
+		],
+		foo: 'wrong',
+		bar: 'right'
+	},
+
+	test(assert, component, target, window) {
+		const button = target.querySelector('button');
+		const event = new window.MouseEvent('click');
+
+		button.dispatchEvent(event);
+		assert.equal(component.get().foo, 'right');
+
+		component.set({ bar: 'left' });
+		button.dispatchEvent(event);
+		assert.equal(component.get().foo, 'left');
+	}
+};
diff --git a/test/runtime/samples/event-handler-each-context/main.html b/test/runtime/samples/event-handler-each-context/main.html
new file mode 100644
index 0000000000..830bbce47e
--- /dev/null
+++ b/test/runtime/samples/event-handler-each-context/main.html
@@ -0,0 +1,5 @@
+{#each items as item}
+	<button on:click='set({ foo: bar })'>{item}</button>
+{/each}
+
+<p>foo: {foo}</p>
\ No newline at end of file