From 44bec4c8b172a47ff300f754463555bbb694bb05 Mon Sep 17 00:00:00 2001
From: paoloricciuti <ricciutipaolo@gmail.com>
Date: Tue, 24 Jun 2025 23:35:40 +0200
Subject: [PATCH] fix: use fine grained for template if the component is not
 explicitly in legacy mode

---
 .changeset/cold-dingos-dream.md               |  5 +++++
 .../src/compiler/phases/2-analyze/index.js    | 20 +++++++++++++++++++
 .../client/visitors/shared/utils.js           |  2 +-
 .../svelte/src/compiler/phases/types.d.ts     |  1 +
 .../_config.js                                | 14 +++++++++++++
 .../main.svelte                               |  8 ++++++++
 .../test.svelte.js                            |  9 +++++++++
 .../_config.js                                | 14 +++++++++++++
 .../main.svelte                               |  9 +++++++++
 .../test.svelte.js                            |  9 +++++++++
 .../_config.js                                | 14 +++++++++++++
 .../main.svelte                               | 12 +++++++++++
 .../test.svelte.js                            |  9 +++++++++
 .../samples/legacy-runes-ambiguous/_config.js | 14 +++++++++++++
 .../legacy-runes-ambiguous/main.svelte        |  7 +++++++
 .../legacy-runes-ambiguous/test.svelte.js     |  9 +++++++++
 16 files changed, 155 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/cold-dingos-dream.md
 create mode 100644 packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-explicit-false/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-explicit-false/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-explicit-false/test.svelte.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-export-const/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-export-const/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-export-const/test.svelte.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-export-let/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-export-let/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-export-let/test.svelte.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous/_config.js
 create mode 100644 packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous/main.svelte
 create mode 100644 packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous/test.svelte.js

diff --git a/.changeset/cold-dingos-dream.md b/.changeset/cold-dingos-dream.md
new file mode 100644
index 0000000000..c48414abc2
--- /dev/null
+++ b/.changeset/cold-dingos-dream.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: use fine grained for template if the component is not explicitly in legacy mode
diff --git a/packages/svelte/src/compiler/phases/2-analyze/index.js b/packages/svelte/src/compiler/phases/2-analyze/index.js
index fded183b86..d11bd1e758 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/index.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/index.js
@@ -431,6 +431,26 @@ export function analyze_component(root, source, options) {
 		template,
 		elements: [],
 		runes,
+		// if we are not in runes mode but we have no reserved references ($$props, $$restProps)
+		// and no `export let` we might be in a wannabe runes component that is using runes in an external
+		// module...we need to fallback to the runic behavior
+		maybe_runes:
+			!runes &&
+			// if they explicitly disabled runes, use the legacy behavior
+			options.runes !== false &&
+			!module.scope.references.keys().some((name) => ['$$props', '$$restProps'].includes(name)) &&
+			!instance.ast.body.some(
+				(node) =>
+					node.type === 'ExportNamedDeclaration' &&
+					((node.declaration &&
+						node.declaration.type === 'VariableDeclaration' &&
+						node.declaration.kind === 'let') ||
+						node.specifiers.some(
+							(specifier) =>
+								specifier.local.type === 'Identifier' &&
+								instance.scope.get(specifier.local.name)?.declaration_kind === 'let'
+						))
+			),
 		tracing: false,
 		classes: new Map(),
 		immutable: runes || options.immutable,
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/utils.js b/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/utils.js
index 15982899c9..5ee962d0ae 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/utils.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/visitors/shared/utils.js
@@ -370,7 +370,7 @@ export function validate_mutation(node, context, expression) {
 export function build_expression(context, expression, metadata, state = context.state) {
 	const value = /** @type {Expression} */ (context.visit(expression, state));
 
-	if (context.state.analysis.runes) {
+	if (context.state.analysis.runes || context.state.analysis.maybe_runes) {
 		return value;
 	}
 
diff --git a/packages/svelte/src/compiler/phases/types.d.ts b/packages/svelte/src/compiler/phases/types.d.ts
index 67cbd75ff8..8fa4bff619 100644
--- a/packages/svelte/src/compiler/phases/types.d.ts
+++ b/packages/svelte/src/compiler/phases/types.d.ts
@@ -51,6 +51,7 @@ export interface ComponentAnalysis extends Analysis {
 	/** Used for CSS pruning and scoping */
 	elements: Array<AST.RegularElement | AST.SvelteElement>;
 	runes: boolean;
+	maybe_runes: boolean;
 	tracing: boolean;
 	exports: Array<{ name: string; alias: string | null }>;
 	/** Whether the component uses `$$props` */
diff --git a/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-explicit-false/_config.js b/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-explicit-false/_config.js
new file mode 100644
index 0000000000..002b66b8e3
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-explicit-false/_config.js
@@ -0,0 +1,14 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	mode: ['client'],
+	async test({ assert, target }) {
+		const p = target.querySelector('p');
+		const btn = target.querySelector('button');
+		flushSync(() => {
+			btn?.click();
+		});
+		assert.equal(p?.innerHTML, '0');
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-explicit-false/main.svelte b/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-explicit-false/main.svelte
new file mode 100644
index 0000000000..cb5837dcd6
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-explicit-false/main.svelte
@@ -0,0 +1,8 @@
+<svelte:options runes={false} />
+<script>
+	import { get, set } from "./test.svelte.js";
+</script>
+
+<p>{get()}</p>
+
+<button onclick={()=>set()}></button>
\ No newline at end of file
diff --git a/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-explicit-false/test.svelte.js b/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-explicit-false/test.svelte.js
new file mode 100644
index 0000000000..f0e7181c29
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-explicit-false/test.svelte.js
@@ -0,0 +1,9 @@
+let count = $state(0);
+
+export function get() {
+	return count;
+}
+
+export function set() {
+	count++;
+}
diff --git a/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-export-const/_config.js b/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-export-const/_config.js
new file mode 100644
index 0000000000..0610aed865
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-export-const/_config.js
@@ -0,0 +1,14 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	mode: ['client'],
+	async test({ assert, target }) {
+		const p = target.querySelector('p');
+		const btn = target.querySelector('button');
+		flushSync(() => {
+			btn?.click();
+		});
+		assert.equal(p?.innerHTML, '1');
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-export-const/main.svelte b/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-export-const/main.svelte
new file mode 100644
index 0000000000..49aef81518
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-export-const/main.svelte
@@ -0,0 +1,9 @@
+<script>
+	import { get, set } from "./test.svelte.js";
+
+	export const x = 42;
+</script>
+
+<p>{get()}</p>
+
+<button onclick={()=>set()}></button>
\ No newline at end of file
diff --git a/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-export-const/test.svelte.js b/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-export-const/test.svelte.js
new file mode 100644
index 0000000000..f0e7181c29
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-export-const/test.svelte.js
@@ -0,0 +1,9 @@
+let count = $state(0);
+
+export function get() {
+	return count;
+}
+
+export function set() {
+	count++;
+}
diff --git a/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-export-let/_config.js b/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-export-let/_config.js
new file mode 100644
index 0000000000..0610aed865
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-export-let/_config.js
@@ -0,0 +1,14 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	mode: ['client'],
+	async test({ assert, target }) {
+		const p = target.querySelector('p');
+		const btn = target.querySelector('button');
+		flushSync(() => {
+			btn?.click();
+		});
+		assert.equal(p?.innerHTML, '1');
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-export-let/main.svelte b/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-export-let/main.svelte
new file mode 100644
index 0000000000..1449b7d582
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-export-let/main.svelte
@@ -0,0 +1,12 @@
+<script>
+	import { get, set } from "./test.svelte.js";
+
+	let x = 42;
+
+	export { x };
+</script>
+
+{x}
+<p>{get()}</p>
+
+<button onclick={()=>set()}></button>
\ No newline at end of file
diff --git a/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-export-let/test.svelte.js b/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-export-let/test.svelte.js
new file mode 100644
index 0000000000..f0e7181c29
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous-export-let/test.svelte.js
@@ -0,0 +1,9 @@
+let count = $state(0);
+
+export function get() {
+	return count;
+}
+
+export function set() {
+	count++;
+}
diff --git a/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous/_config.js b/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous/_config.js
new file mode 100644
index 0000000000..0610aed865
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous/_config.js
@@ -0,0 +1,14 @@
+import { flushSync } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	mode: ['client'],
+	async test({ assert, target }) {
+		const p = target.querySelector('p');
+		const btn = target.querySelector('button');
+		flushSync(() => {
+			btn?.click();
+		});
+		assert.equal(p?.innerHTML, '1');
+	}
+});
diff --git a/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous/main.svelte b/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous/main.svelte
new file mode 100644
index 0000000000..698a852ac9
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous/main.svelte
@@ -0,0 +1,7 @@
+<script>
+	import { get, set } from "./test.svelte.js";
+</script>
+
+<p>{get()}</p>
+
+<button onclick={()=>set()}></button>
\ No newline at end of file
diff --git a/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous/test.svelte.js b/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous/test.svelte.js
new file mode 100644
index 0000000000..f0e7181c29
--- /dev/null
+++ b/packages/svelte/tests/runtime-runes/samples/legacy-runes-ambiguous/test.svelte.js
@@ -0,0 +1,9 @@
+let count = $state(0);
+
+export function get() {
+	return count;
+}
+
+export function set() {
+	count++;
+}