fix deep object property as action (#5845)

CHANGELOG.md

@@ -8,6 +8,7 @@
 * Fix checkbox `bind:group` in nested `{#each}` contexts ([#5811](https://github.com/sveltejs/svelte/issues/5811))
 * Add graphics roles as known ARIA roles ([#5822](https://github.com/sveltejs/svelte/pull/5822))
 * Fix local transitions if a parent has a cancelled outro transition ([#5822](https://github.com/sveltejs/svelte/issues/5822))
+* Support `use:obj.some.deep.function` as actions ([#5844](https://github.com/sveltejs/svelte/issues/5844))
 
 ## 3.31.0
 

src/compiler/compile/render_dom/wrappers/shared/add_actions.ts

@@ -31,8 +31,9 @@ export function add_action(block: Block, target: string, action: Action) {
 	const fn = block.renderer.reference(obj);
 
 	if (properties.length) {
+		const member_expression = properties.reduce((lhs, rhs) => x`${lhs}.${rhs}`, fn);
 		block.event_listeners.push(
-			x`@action_destroyer(${id} = ${fn}.${properties.join('.')}(${target}, ${snippet}))`
+			x`@action_destroyer(${id} = ${member_expression}(${target}, ${snippet}))`
 		);
 	} else {
 		block.event_listeners.push(

test/runtime/samples/action-object-deep/_config.js

@@ -0,0 +1,8 @@
+export default {
+	html: `
+		<button>action</button>
+	`,
+	async test({ assert, target, window }) {
+		assert.equal(target.querySelector('button').foo, 'bar1337');
+	}
+};

test/runtime/samples/action-object-deep/main.svelte

@@ -0,0 +1,12 @@
+<script>
+	const obj = {
+		deep: {
+			foo : 'bar',
+			action(element, { leet }) {
+				element.foo = this.foo + leet;
+			}
+		}
+	};
+</script>
+
+<button use:obj.deep.action={{ leet: 1337 }}>action</button>