fix: allow runes for variable declarations in the template (#10879)

Author: trueadm

.changeset/red-poets-study.md

@@ -0,0 +1,5 @@
+---
+"svelte": patch
+---
+
+fix: allow runes for variable declarations in the template

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

@@ -3223,5 +3223,6 @@ export const template_visitors = {
 			node: b.id('$.document')
 		});
 	},
-	CallExpression: javascript_visitors_runes.CallExpression
+	CallExpression: javascript_visitors_runes.CallExpression,
+	VariableDeclaration: javascript_visitors_runes.VariableDeclaration
 };

packages/svelte/tests/runtime-runes/samples/state-in-template/_config.js

@@ -0,0 +1,19 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	html: `<form><input name="name"><button>Add</button></form>`,
+
+	async test({ assert, target }) {
+		const btn = target.querySelector('button');
+
+		flushSync(() => {
+			btn?.click();
+		});
+
+		assert.htmlEqual(
+			target.innerHTML,
+			`<form><input name="name"><button>Add</button></form><div></div>`
+		);
+	}
+});

packages/svelte/tests/runtime-runes/samples/state-in-template/main.svelte

@@ -0,0 +1,19 @@
+<script>
+	import { Set } from 'svelte/reactivity';
+	const set = new Set();
+</script>
+
+<form onsubmit={e => {
+	e.preventDefault();
+	const data = new FormData(e.target);
+	const state = $state({ name: data.get('name') });
+	set.add(state);
+	e.target.reset();
+}}>
+	<input name="name" />
+	<button>Add</button>
+</form>
+
+{#each set as item}
+	<div>{item.name}</div>
+{/each}