From 254096d32041ba5bb7dd80bebffba25f31936f8a Mon Sep 17 00:00:00 2001
From: Tan Li Hau <tanhauhau@users.noreply.github.com>
Date: Sat, 19 Sep 2020 00:50:18 +0800
Subject: [PATCH] support methods as actions (#5398)

---
 CHANGELOG.md                                     |  1 +
 .../render_dom/wrappers/shared/add_actions.ts    | 16 ++++++++++++----
 test/runtime/samples/action-object/_config.js    |  8 ++++++++
 test/runtime/samples/action-object/main.svelte   | 10 ++++++++++
 4 files changed, 31 insertions(+), 4 deletions(-)
 create mode 100644 test/runtime/samples/action-object/_config.js
 create mode 100644 test/runtime/samples/action-object/main.svelte

diff --git a/CHANGELOG.md b/CHANGELOG.md
index d74279c2e0..8ed9b5a3c2 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -2,6 +2,7 @@
 
 ## Unreleased
 
+* Support `use:obj.method` as actions ([#3935](https://github.com/sveltejs/svelte/issues/3935))
 * 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))
diff --git a/src/compiler/compile/render_dom/wrappers/shared/add_actions.ts b/src/compiler/compile/render_dom/wrappers/shared/add_actions.ts
index 3d8c4fbbc0..6ca7de9a22 100644
--- a/src/compiler/compile/render_dom/wrappers/shared/add_actions.ts
+++ b/src/compiler/compile/render_dom/wrappers/shared/add_actions.ts
@@ -26,11 +26,19 @@ export function add_action(block: Block, target: string, action: Action) {
 
 	block.add_variable(id);
 
-	const fn = block.renderer.reference(action.name);
+	const [obj, ...properties] = action.name.split('.');
 
-	block.event_listeners.push(
-		x`@action_destroyer(${id} = ${fn}.call(null, ${target}, ${snippet}))`
-	);
+	const fn = block.renderer.reference(obj);
+
+	if (properties.length) {
+		block.event_listeners.push(
+			x`@action_destroyer(${id} = ${fn}.${properties.join('.')}(${target}, ${snippet}))`
+		);
+	} else {
+		block.event_listeners.push(
+			x`@action_destroyer(${id} = ${fn}.call(null, ${target}, ${snippet}))`
+		);
+	}
 
 	if (dependencies && dependencies.length > 0) {
 		let condition = x`${id} && @is_function(${id}.update)`;
diff --git a/test/runtime/samples/action-object/_config.js b/test/runtime/samples/action-object/_config.js
new file mode 100644
index 0000000000..7fdc11af2b
--- /dev/null
+++ b/test/runtime/samples/action-object/_config.js
@@ -0,0 +1,8 @@
+export default {
+	html: `
+		<button>action</button>
+	`,
+	async test({ assert, target, window }) {
+		assert.equal(target.querySelector('button').foo, 'bar1337');
+	}
+};
diff --git a/test/runtime/samples/action-object/main.svelte b/test/runtime/samples/action-object/main.svelte
new file mode 100644
index 0000000000..f15e319e6f
--- /dev/null
+++ b/test/runtime/samples/action-object/main.svelte
@@ -0,0 +1,10 @@
+<script>
+	const obj = {
+		foo : "bar",
+		action(element, { leet }) {
+			element.foo = this.foo + leet;
+		},
+	}
+</script>
+
+<button use:obj.action={{ leet: 1337 }}>action</button>
\ No newline at end of file