fix: support $state.snapshot as part of variable declarations (#11235)

fixes #11234

Author: dummdidumm

.changeset/sixty-numbers-hope.md

@@ -0,0 +1,5 @@
+---
+"svelte": patch
+---
+
+fix: support `$state.snapshot` as part of variable declarations

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

@@ -197,7 +197,13 @@ export const javascript_visitors_runes = {
 		for (const declarator of node.declarations) {
 			const init = declarator.init;
 			const rune = get_rune(init, state.scope);
-			if (!rune || rune === '$effect.active' || rune === '$effect.root' || rune === '$inspect') {
+			if (
+				!rune ||
+				rune === '$effect.active' ||
+				rune === '$effect.root' ||
+				rune === '$inspect' ||
+				rune === '$state.snapshot'
+			) {
 				if (init != null && is_hoistable_function(init)) {
 					const hoistable_function = visit(init);
 					state.hoisted.push(

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

@@ -1,12 +1,12 @@
 import { test } from '../../test';
 
 export default test({
-	html: `<button>[{"a":0}]</button>`,
+	html: `[{"a":0}] <button>[{"a":0}]</button>`,
 
 	async test({ assert, target }) {
 		const btn = target.querySelector('button');
 
 		await btn?.click();
-		assert.htmlEqual(target.innerHTML, `<button>[{"a":0},{"a":1}]</button>`);
+		assert.htmlEqual(target.innerHTML, `[{"a":0}] <button>[{"a":0},{"a":1}]</button>`);
 	}
 });

packages/svelte/tests/runtime-runes/samples/state-snapshot/main.svelte

@@ -1,5 +1,7 @@
 <script>
     let items = $state([{a: 0}]);
+    let start = $state.snapshot(items);
 </script>
 
+{JSON.stringify(start)}
 <button on:click={() => items.push({a: items.length})}>{JSON.stringify(structuredClone($state.snapshot(items)))}</button>