diff --git a/src/compiler/compile/nodes/EventHandler.ts b/src/compiler/compile/nodes/EventHandler.ts
index 19da3d9dd7..bee10be659 100644
--- a/src/compiler/compile/nodes/EventHandler.ts
+++ b/src/compiler/compile/nodes/EventHandler.ts
@@ -44,6 +44,8 @@ export default class EventHandler extends Node {
this.reassigned = component.var_lookup.get(info.expression.name).reassigned;
}
+ } else if (this.expression.dynamic_dependencies().length > 0) {
+ this.reassigned = true;
}
} else {
this.handler_name = component.get_unique_name(`${sanitize(this.name)}_handler`);
diff --git a/test/runtime/samples/event-handler-dynamic-expression/_config.js b/test/runtime/samples/event-handler-dynamic-expression/_config.js
new file mode 100644
index 0000000000..c4d259a542
--- /dev/null
+++ b/test/runtime/samples/event-handler-dynamic-expression/_config.js
@@ -0,0 +1,20 @@
+export default {
+ html: ``,
+
+ async test({ assert, component, target, window }) {
+ const [button] = target.querySelectorAll(
+ 'button'
+ );
+
+ const event = new window.MouseEvent('click');
+
+ await button.dispatchEvent(event);
+ assert.htmlEqual(target.innerHTML, ``);
+
+ await button.dispatchEvent(event);
+ assert.htmlEqual(target.innerHTML, ``);
+
+ await button.dispatchEvent(event);
+ assert.htmlEqual(target.innerHTML, ``);
+ },
+};
diff --git a/test/runtime/samples/event-handler-dynamic-expression/main.svelte b/test/runtime/samples/event-handler-dynamic-expression/main.svelte
new file mode 100644
index 0000000000..f53aa7aadd
--- /dev/null
+++ b/test/runtime/samples/event-handler-dynamic-expression/main.svelte
@@ -0,0 +1,12 @@
+
+
+
\ No newline at end of file