fix: deduplicate generated props and action arg names (#10669)

fixes #10662

.changeset/unlucky-steaks-warn.md

@@ -0,0 +1,5 @@
+---
+"svelte": patch
+---
+
+fix: deduplicate generated props and action arg names

packages/svelte/src/compiler/phases/3-transform/client/visitors/template.js

@@ -2668,7 +2668,7 @@ export const template_visitors = {
 		const params = [b.id('$$node')];
 
 		if (node.expression) {
-			params.push(b.id('$$props'));
+			params.push(b.id('$$action_arg'));
 		}
 
 		/** @type {import('estree').Expression[]} */

packages/svelte/tests/runtime-legacy/samples/action-component/_config.js

@@ -0,0 +1,14 @@
+import { tick } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	accessors: false,
+	async test({ assert, target }) {
+		assert.htmlEqual(target.innerHTML, '<button>foo / foo</button><div></div>');
+
+		const button = target.querySelector('button');
+		button?.click();
+		await tick();
+		assert.htmlEqual(target.innerHTML, '<button>bar / bar</button><div></div>');
+	}
+});

packages/svelte/tests/runtime-legacy/samples/action-component/main.svelte

@@ -0,0 +1,17 @@
+<script>
+	import Component from "./sub.svelte"
+	let state = 'foo';
+	let param = '';
+
+	function action(node, _param) {
+		param = _param
+		return {
+			update(_param) {
+				param = _param;
+			}
+		};
+	}
+</script>
+
+<button on:click={() => state = 'bar'}>{state} / {param}</button>
+<Component {action} {state}></Component>

packages/svelte/tests/runtime-legacy/samples/action-component/sub.svelte

@@ -0,0 +1,6 @@
+<script>
+	export let action;
+	export let state;
+</script>
+
+<div use:action={state}></div>