From 2e74928410cf6ab9e922161826b42f813efec132 Mon Sep 17 00:00:00 2001
From: Dominic Gannaway <dg@domgan.com>
Date: Fri, 16 Aug 2024 17:15:56 +0100
Subject: [PATCH] fix: correctly ensure prop bindings are reactive when bound

---
 .changeset/eighty-days-wave.md                |  5 +++++
 .../phases/3-transform/client/utils.js        |  1 +
 .../samples/binding-value-prop/Field.svelte   |  5 +++++
 .../samples/binding-value-prop/_config.js     | 21 +++++++++++++++++++
 .../samples/binding-value-prop/main.svelte    |  9 ++++++++
 5 files changed, 41 insertions(+)
 create mode 100644 .changeset/eighty-days-wave.md
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/binding-value-prop/Field.svelte
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/binding-value-prop/_config.js
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/binding-value-prop/main.svelte

diff --git a/.changeset/eighty-days-wave.md b/.changeset/eighty-days-wave.md
new file mode 100644
index 0000000000..86da3748e8
--- /dev/null
+++ b/.changeset/eighty-days-wave.md
@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: correctly ensure prop bindings are reactive when bound
diff --git a/packages/svelte/src/compiler/phases/3-transform/client/utils.js b/packages/svelte/src/compiler/phases/3-transform/client/utils.js
index 35283aed72..62f6c4b956 100644
--- a/packages/svelte/src/compiler/phases/3-transform/client/utils.js
+++ b/packages/svelte/src/compiler/phases/3-transform/client/utils.js
@@ -184,6 +184,7 @@ export function get_prop_source(binding, state, name, initial) {
 
 	if (
 		state.analysis.accessors ||
+		binding.updated ||
 		(state.analysis.immutable
 			? binding.reassigned || (state.analysis.runes && binding.mutated)
 			: binding.mutated)
diff --git a/packages/svelte/tests/runtime-legacy/samples/binding-value-prop/Field.svelte b/packages/svelte/tests/runtime-legacy/samples/binding-value-prop/Field.svelte
new file mode 100644
index 0000000000..b3bfeab84f
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/binding-value-prop/Field.svelte
@@ -0,0 +1,5 @@
+<script>
+	export let value;
+</script>
+
+<input type="text" bind:value />
diff --git a/packages/svelte/tests/runtime-legacy/samples/binding-value-prop/_config.js b/packages/svelte/tests/runtime-legacy/samples/binding-value-prop/_config.js
new file mode 100644
index 0000000000..008d53fde8
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/binding-value-prop/_config.js
@@ -0,0 +1,21 @@
+import { flushSync } from 'svelte';
+import { ok, test } from '../../test';
+
+export default test({
+	html: `<input type="text">\naaa`,
+	ssrHtml: `<input type="text" value="aaa">\naaa`,
+
+	test({ assert, target }) {
+		const input = target.querySelector('input');
+		ok(input);
+
+		const event = new window.Event('input');
+
+		input.value = 'aaa2';
+		input.dispatchEvent(event);
+
+		flushSync();
+
+		assert.htmlEqual(target.innerHTML, `<input type="text">\naaa2`);
+	}
+});
diff --git a/packages/svelte/tests/runtime-legacy/samples/binding-value-prop/main.svelte b/packages/svelte/tests/runtime-legacy/samples/binding-value-prop/main.svelte
new file mode 100644
index 0000000000..4352cb65cd
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/binding-value-prop/main.svelte
@@ -0,0 +1,9 @@
+<script>
+	import Field from './Field.svelte';
+	import { writable } from 'svelte/store';
+
+	const value = writable('aaa');
+
+</script>
+
+<Field bind:value={$value} /> {$value}