From 9b67ee18ebfcef5716f7a26c1de528f0173140a3 Mon Sep 17 00:00:00 2001
From: Tan Li Hau <tanhauhau@users.noreply.github.com>
Date: Mon, 15 Apr 2024 00:24:01 +0800
Subject: [PATCH] fix: throw error when auto-subscribed store variable shadow
 by local variable (#11170)

---
 .changeset/afraid-kids-hide.md                    |  5 +++++
 .../svelte/src/compiler/phases/2-analyze/index.js | 15 +++++++++------
 .../samples/store-shadow-scope-2/_config.js       |  9 +++++++++
 .../samples/store-shadow-scope-2/main.svelte      |  8 ++++++++
 .../samples/store-shadow-scope-3/_config.js       |  9 +++++++++
 .../samples/store-shadow-scope-3/main.svelte      |  8 ++++++++
 6 files changed, 48 insertions(+), 6 deletions(-)
 create mode 100644 .changeset/afraid-kids-hide.md
 create mode 100644 packages/svelte/tests/compiler-errors/samples/store-shadow-scope-2/_config.js
 create mode 100644 packages/svelte/tests/compiler-errors/samples/store-shadow-scope-2/main.svelte
 create mode 100644 packages/svelte/tests/compiler-errors/samples/store-shadow-scope-3/_config.js
 create mode 100644 packages/svelte/tests/compiler-errors/samples/store-shadow-scope-3/main.svelte

diff --git a/.changeset/afraid-kids-hide.md b/.changeset/afraid-kids-hide.md
new file mode 100644
index 0000000000..890ea86af2
--- /dev/null
+++ b/.changeset/afraid-kids-hide.md
@@ -0,0 +1,5 @@
+---
+"svelte": patch
+---
+
+fix: throw error when auto-subscribed store variable shadow by local variable
diff --git a/packages/svelte/src/compiler/phases/2-analyze/index.js b/packages/svelte/src/compiler/phases/2-analyze/index.js
index d9c6dfe64a..c1ed378ca3 100644
--- a/packages/svelte/src/compiler/phases/2-analyze/index.js
+++ b/packages/svelte/src/compiler/phases/2-analyze/index.js
@@ -302,8 +302,8 @@ export function analyze_component(root, source, options) {
 					declaration.initial.source.value === 'svelte/store'
 				))
 		) {
-			let is_nested_store_subscription = false;
-			for (const reference of references) {
+			let is_nested_store_subscription_node = undefined;
+			search: for (const reference of references) {
 				for (let i = reference.path.length - 1; i >= 0; i--) {
 					const scope =
 						scopes.get(reference.path[i]) ||
@@ -311,14 +311,17 @@ export function analyze_component(root, source, options) {
 						instance.scopes.get(reference.path[i]);
 					if (scope) {
 						const owner = scope?.owner(store_name);
-						is_nested_store_subscription =
-							!!owner && owner !== module.scope && owner !== instance.scope;
+						if (!!owner && owner !== module.scope && owner !== instance.scope) {
+							is_nested_store_subscription_node = reference.node;
+							break search;
+						}
 						break;
 					}
 				}
 			}
-			if (is_nested_store_subscription) {
-				error(references[0].node, 'illegal-store-subscription');
+
+			if (is_nested_store_subscription_node) {
+				error(is_nested_store_subscription_node, 'illegal-store-subscription');
 			}
 
 			if (options.runes !== false) {
diff --git a/packages/svelte/tests/compiler-errors/samples/store-shadow-scope-2/_config.js b/packages/svelte/tests/compiler-errors/samples/store-shadow-scope-2/_config.js
new file mode 100644
index 0000000000..f320abac21
--- /dev/null
+++ b/packages/svelte/tests/compiler-errors/samples/store-shadow-scope-2/_config.js
@@ -0,0 +1,9 @@
+import { test } from '../../test';
+
+export default test({
+	error: {
+		code: 'illegal-store-subscription',
+		message: 'Cannot subscribe to stores that are not declared at the top level of the component',
+		position: [142, 147]
+	}
+});
diff --git a/packages/svelte/tests/compiler-errors/samples/store-shadow-scope-2/main.svelte b/packages/svelte/tests/compiler-errors/samples/store-shadow-scope-2/main.svelte
new file mode 100644
index 0000000000..d7ef9306c6
--- /dev/null
+++ b/packages/svelte/tests/compiler-errors/samples/store-shadow-scope-2/main.svelte
@@ -0,0 +1,8 @@
+<script>
+	import { writable } from 'svelte/store';
+	const user = writable(0);
+	const users = [];
+	$: selected = users.find(user => user.id == $user);
+
+	$: console.log($user);
+</script>
diff --git a/packages/svelte/tests/compiler-errors/samples/store-shadow-scope-3/_config.js b/packages/svelte/tests/compiler-errors/samples/store-shadow-scope-3/_config.js
new file mode 100644
index 0000000000..74e25f3bf1
--- /dev/null
+++ b/packages/svelte/tests/compiler-errors/samples/store-shadow-scope-3/_config.js
@@ -0,0 +1,9 @@
+import { test } from '../../test';
+
+export default test({
+	error: {
+		code: 'illegal-store-subscription',
+		message: 'Cannot subscribe to stores that are not declared at the top level of the component',
+		position: [167, 172]
+	}
+});
diff --git a/packages/svelte/tests/compiler-errors/samples/store-shadow-scope-3/main.svelte b/packages/svelte/tests/compiler-errors/samples/store-shadow-scope-3/main.svelte
new file mode 100644
index 0000000000..4988835dd7
--- /dev/null
+++ b/packages/svelte/tests/compiler-errors/samples/store-shadow-scope-3/main.svelte
@@ -0,0 +1,8 @@
+<script>
+	import { writable } from 'svelte/store';
+	const user = writable(0);
+	const users = [];
+
+	$: console.log($user);
+	$: selected = users.find(user => user.id == $user);
+</script>