fix: ensure `$effect.root` is ignored on the server (#12332)

Ignore the contents of the effect root, just return a noop where necessary

fixes #12322

.changeset/wicked-emus-drive.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: ensure `$effect.root` is ignored on the server

packages/svelte/src/compiler/phases/3-transform/server/transform-server.js

@@ -412,11 +412,8 @@ const global_visitors = {
 		}
 
 		if (rune === '$effect.root') {
-			const args = /** @type {import('estree').Expression[]} */ (
+			// ignore $effect.root() calls, just return a noop which mimics the cleanup function
-				node.arguments.map((arg) => context.visit(arg))
+			return b.arrow([], b.block([]));
-			);
-			// Just call the function directly
-			return b.call(args[0]);
 		}
 
 		if (rune === '$state.snapshot') {

packages/svelte/tests/runtime-legacy/shared.ts

@@ -61,7 +61,7 @@ export interface RuntimeTest<Props extends Record<string, any> = Record<string,
 		warnings: any[];
 		hydrate: Function;
 	}) => void | Promise<void>;
-	test_ssr?: (args: { assert: Assert }) => void | Promise<void>;
+	test_ssr?: (args: { logs: any[]; assert: Assert }) => void | Promise<void>;
 	accessors?: boolean;
 	immutable?: boolean;
 	intro?: boolean;
@@ -285,6 +285,7 @@ async function run_test_variant(
 
 			if (config.test_ssr) {
 				await config.test_ssr({
+					logs,
 					// @ts-expect-error
 					assert: {
 						...assert,

packages/svelte/tests/runtime-runes/samples/effect-root-4/_config.js

@@ -0,0 +1,18 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	html: '<button>cleanup</button>',
+
+	async test({ assert, target, logs }) {
+		const btn = target.querySelector('button');
+
+		btn?.click();
+		flushSync();
+
+		assert.deepEqual(logs, ['effect1', 'effect2']);
+	},
+	test_ssr({ assert, logs }) {
+		assert.deepEqual(logs, []);
+	}
+});

packages/svelte/tests/runtime-runes/samples/effect-root-4/main.svelte

@@ -0,0 +1,10 @@
+<script>
+	$effect.root(() => {
+		console.log('effect1');
+	});
+	const cleanup = $effect.root(() => {
+		console.log('effect2');
+	});
+</script>
+
+<button onclick={cleanup}>cleanup</button>

packages/svelte/tests/runtime-runes/samples/effect-root/_config.js

@@ -24,5 +24,8 @@ export default test({
 		});
 
 		assert.deepEqual(logs, [0, 1, 'cleanup 1', 'cleanup 2']);
+	},
+	test_ssr({ assert, logs }) {
+		assert.deepEqual(logs, []);
 	}
 });

packages/svelte/tests/runtime-runes/samples/event-store-no-hoisting/main.svelte

@@ -5,8 +5,7 @@
 
 	function setStore() {
 		store = writable(0, () => {
-			console.log('start');
+			return () => {};
-			return () => console.log('stop');
 		});
 	}
 </script>