From dc8ab171f87c6e91b530196377c0bc384c17a515 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <dg@domgan.com>
Date: Fri, 18 Oct 2024 15:42:01 +0100
Subject: [PATCH 1/2] fix: correct migration of uninitialised state

---
 .changeset/neat-rabbits-divide.md             |  5 +++
 packages/svelte/src/compiler/migrate/index.js | 34 +++++++++++--------
 .../output.svelte                             | 12 ++++---
 .../single-assignment-labeled/output.svelte   | 15 +++++---
 .../samples/state-no-initial/input.svelte     | 13 +++++++
 .../samples/state-no-initial/output.svelte    | 13 +++++++
 6 files changed, 67 insertions(+), 25 deletions(-)
 create mode 100644 .changeset/neat-rabbits-divide.md
 create mode 100644 packages/svelte/tests/migrate/samples/state-no-initial/input.svelte
 create mode 100644 packages/svelte/tests/migrate/samples/state-no-initial/output.svelte

diff --git a/.changeset/neat-rabbits-divide.md b/.changeset/neat-rabbits-divide.md
new file mode 100644
index 000000000000..ffe57a6f1804
--- /dev/null
+++ b/.changeset/neat-rabbits-divide.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: correct migration of uninitialised state
diff --git a/packages/svelte/src/compiler/migrate/index.js b/packages/svelte/src/compiler/migrate/index.js
index 69c840aedbac..dc9ce0dbfb0d 100644
--- a/packages/svelte/src/compiler/migrate/index.js
+++ b/packages/svelte/src/compiler/migrate/index.js
@@ -549,23 +549,27 @@ const instance_script = {
 				let labeled_statement;
 
 				// Analyze declaration bindings to see if they're exclusively updated within a single reactive statement
-				const possible_derived = bindings.every((binding) =>
-					binding.references.every((reference) => {
-						const declaration = reference.path.find((el) => el.type === 'VariableDeclaration');
-						const assignment = reference.path.find((el) => el.type === 'AssignmentExpression');
-						const update = reference.path.find((el) => el.type === 'UpdateExpression');
-						const labeled = reference.path.find(
-							(el) => el.type === 'LabeledStatement' && el.label.name === '$'
-						);
+				const possible_derived = bindings.every(
+					(binding) =>
+						binding.initial !== null &&
+						binding.references.every((reference) => {
+							const declaration = reference.path.find((el) => el.type === 'VariableDeclaration');
+							const assignment = reference.path.find((el) => el.type === 'AssignmentExpression');
+							const update = reference.path.find((el) => el.type === 'UpdateExpression');
+							const labeled = reference.path.find(
+								(el) => el.type === 'LabeledStatement' && el.label.name === '$'
+							);
 
-						if (assignment && labeled) {
-							if (assignment_in_labeled) return false;
-							assignment_in_labeled = /** @type {AssignmentExpression} */ (assignment);
-							labeled_statement = /** @type {LabeledStatement} */ (labeled);
-						}
+							if (assignment && labeled) {
+								if (assignment_in_labeled) return false;
+								assignment_in_labeled = /** @type {AssignmentExpression} */ (assignment);
+								labeled_statement = /** @type {LabeledStatement} */ (labeled);
+							}
 
-						return !update && (declaration || (labeled && assignment) || (!labeled && !assignment));
-					})
+							return (
+								!update && (declaration || (labeled && assignment) || (!labeled && !assignment))
+							);
+						})
 				);
 
 				const labeled_has_single_assignment =
diff --git a/packages/svelte/tests/migrate/samples/reactive-statements-reorder-with-comments/output.svelte b/packages/svelte/tests/migrate/samples/reactive-statements-reorder-with-comments/output.svelte
index 48a3378d515c..af4048137904 100644
--- a/packages/svelte/tests/migrate/samples/reactive-statements-reorder-with-comments/output.svelte
+++ b/packages/svelte/tests/migrate/samples/reactive-statements-reorder-with-comments/output.svelte
@@ -6,10 +6,7 @@
 
 
 	// triple
-	//  update triple
-	let triple = $derived(count * 3)
-	//  trailing comment
-	//  in triple;
+	let triple = $state();
 
 	function increment() {
 		count += 1;
@@ -19,7 +16,12 @@
 	run(() => {
 		console.log({ count, double });
 	});
-	
+	run(() => {
+		// update triple
+		triple = count * 3;
+		// trailing comment
+		// in triple
+	});
 </script>
 
 <button onclick={increment}>
diff --git a/packages/svelte/tests/migrate/samples/single-assignment-labeled/output.svelte b/packages/svelte/tests/migrate/samples/single-assignment-labeled/output.svelte
index 8e07000f5c7e..5bb786d2ebe0 100644
--- a/packages/svelte/tests/migrate/samples/single-assignment-labeled/output.svelte
+++ b/packages/svelte/tests/migrate/samples/single-assignment-labeled/output.svelte
@@ -2,8 +2,10 @@
 	import { run } from 'svelte/legacy';
 
 	let count = $state(0);
-	let double = $derived(count * 2);
-	
+	let double = $state();
+	run(() => {
+		double = count * 2;
+	});
 	
 	let quadruple = $state();
 	run(() => {
@@ -41,10 +43,13 @@
 		evenmore_doubled = evenmore * 2;
 	});
 
-	let almost_infinity = $derived(count * 128);
-	
+	let almost_infinity = $state();
+	run(() => {
+		almost_infinity = count * 128;
+	});
 
-	let should_be_state = $state(42);
+	let should_be_state = $state();
+	let should_be_state = $state();
 	
 	let should_be_state_too = $state(42);
 	
diff --git a/packages/svelte/tests/migrate/samples/state-no-initial/input.svelte b/packages/svelte/tests/migrate/samples/state-no-initial/input.svelte
new file mode 100644
index 000000000000..c2c4183465e0
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/state-no-initial/input.svelte
@@ -0,0 +1,13 @@
+<script lang="ts">
+	let bounds: DOMRect | undefined;
+	$: position = calculatePosition(bounds);
+
+	const openDropdown = () => {
+    bounds = getInputPosition();
+  };
+
+	const getInputPosition = () => {};
+  const calculatePosition = (boundary?: DOMRect) => ({});
+</script>
+
+<div style:top={position.top}></div>
diff --git a/packages/svelte/tests/migrate/samples/state-no-initial/output.svelte b/packages/svelte/tests/migrate/samples/state-no-initial/output.svelte
new file mode 100644
index 000000000000..2f6a9933ee6c
--- /dev/null
+++ b/packages/svelte/tests/migrate/samples/state-no-initial/output.svelte
@@ -0,0 +1,13 @@
+<script lang="ts">
+	let bounds: DOMRect | undefined = $state();
+
+	const openDropdown = () => {
+    bounds = getInputPosition();
+  };
+
+	const getInputPosition = () => {};
+  const calculatePosition = (boundary?: DOMRect) => ({});
+	let position = $derived(calculatePosition(bounds));
+</script>
+
+<div style:top={position.top}></div>
\ No newline at end of file

From c2566ce259253ae6d128d8341d6c28aa581cb1e1 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <dg@domgan.com>
Date: Fri, 18 Oct 2024 15:46:43 +0100
Subject: [PATCH 2/2] better fix

---
 packages/svelte/src/compiler/migrate/index.js | 39 ++++++++++---------
 .../output.svelte                             | 12 +++---
 .../single-assignment-labeled/output.svelte   | 15 +++----
 3 files changed, 30 insertions(+), 36 deletions(-)

diff --git a/packages/svelte/src/compiler/migrate/index.js b/packages/svelte/src/compiler/migrate/index.js
index dc9ce0dbfb0d..3d70d54d9f0a 100644
--- a/packages/svelte/src/compiler/migrate/index.js
+++ b/packages/svelte/src/compiler/migrate/index.js
@@ -549,27 +549,28 @@ const instance_script = {
 				let labeled_statement;
 
 				// Analyze declaration bindings to see if they're exclusively updated within a single reactive statement
-				const possible_derived = bindings.every(
-					(binding) =>
-						binding.initial !== null &&
-						binding.references.every((reference) => {
-							const declaration = reference.path.find((el) => el.type === 'VariableDeclaration');
-							const assignment = reference.path.find((el) => el.type === 'AssignmentExpression');
-							const update = reference.path.find((el) => el.type === 'UpdateExpression');
-							const labeled = reference.path.find(
-								(el) => el.type === 'LabeledStatement' && el.label.name === '$'
-							);
+				const possible_derived = bindings.every((binding) =>
+					binding.references.every((reference) => {
+						const declaration = reference.path.find((el) => el.type === 'VariableDeclaration');
+						const assignment = reference.path.find((el) => el.type === 'AssignmentExpression');
+						const update = reference.path.find((el) => el.type === 'UpdateExpression');
+						const labeled = reference.path.find(
+							(el) => el.type === 'LabeledStatement' && el.label.name === '$'
+						);
 
-							if (assignment && labeled) {
-								if (assignment_in_labeled) return false;
-								assignment_in_labeled = /** @type {AssignmentExpression} */ (assignment);
-								labeled_statement = /** @type {LabeledStatement} */ (labeled);
-							}
+						if (assignment && labeled) {
+							if (assignment_in_labeled) return false;
+							assignment_in_labeled = /** @type {AssignmentExpression} */ (assignment);
+							labeled_statement = /** @type {LabeledStatement} */ (labeled);
+						}
 
-							return (
-								!update && (declaration || (labeled && assignment) || (!labeled && !assignment))
-							);
-						})
+						return (
+							!update &&
+							((declaration && binding.initial) ||
+								(labeled && assignment) ||
+								(!labeled && !assignment))
+						);
+					})
 				);
 
 				const labeled_has_single_assignment =
diff --git a/packages/svelte/tests/migrate/samples/reactive-statements-reorder-with-comments/output.svelte b/packages/svelte/tests/migrate/samples/reactive-statements-reorder-with-comments/output.svelte
index af4048137904..48a3378d515c 100644
--- a/packages/svelte/tests/migrate/samples/reactive-statements-reorder-with-comments/output.svelte
+++ b/packages/svelte/tests/migrate/samples/reactive-statements-reorder-with-comments/output.svelte
@@ -6,7 +6,10 @@
 
 
 	// triple
-	let triple = $state();
+	//  update triple
+	let triple = $derived(count * 3)
+	//  trailing comment
+	//  in triple;
 
 	function increment() {
 		count += 1;
@@ -16,12 +19,7 @@
 	run(() => {
 		console.log({ count, double });
 	});
-	run(() => {
-		// update triple
-		triple = count * 3;
-		// trailing comment
-		// in triple
-	});
+	
 </script>
 
 <button onclick={increment}>
diff --git a/packages/svelte/tests/migrate/samples/single-assignment-labeled/output.svelte b/packages/svelte/tests/migrate/samples/single-assignment-labeled/output.svelte
index 5bb786d2ebe0..8e07000f5c7e 100644
--- a/packages/svelte/tests/migrate/samples/single-assignment-labeled/output.svelte
+++ b/packages/svelte/tests/migrate/samples/single-assignment-labeled/output.svelte
@@ -2,10 +2,8 @@
 	import { run } from 'svelte/legacy';
 
 	let count = $state(0);
-	let double = $state();
-	run(() => {
-		double = count * 2;
-	});
+	let double = $derived(count * 2);
+	
 	
 	let quadruple = $state();
 	run(() => {
@@ -43,13 +41,10 @@
 		evenmore_doubled = evenmore * 2;
 	});
 
-	let almost_infinity = $state();
-	run(() => {
-		almost_infinity = count * 128;
-	});
+	let almost_infinity = $derived(count * 128);
+	
 
-	let should_be_state = $state();
-	let should_be_state = $state();
+	let should_be_state = $state(42);
 	
 	let should_be_state_too = $state(42);