From 27b37bb143594c74087d967bedce2da305ab7e73 Mon Sep 17 00:00:00 2001
From: raythurnvoid <53383860+raythurnvoid@users.noreply.github.com>
Date: Sun, 15 Jun 2025 00:10:11 +0100
Subject: [PATCH] Add tests

---
 .../binding-select-reactive-block/_config.js  | 46 +++++++++++++++++++
 .../binding-select-reactive-block/main.svelte | 41 +++++++++++++++++
 .../_config.js                                | 46 +++++++++++++++++++
 .../main.svelte                               | 38 +++++++++++++++
 4 files changed, 171 insertions(+)
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/binding-select-reactive-block/_config.js
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/binding-select-reactive-block/main.svelte
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/binding-select-reactive-fallback/_config.js
 create mode 100644 packages/svelte/tests/runtime-legacy/samples/binding-select-reactive-fallback/main.svelte

diff --git a/packages/svelte/tests/runtime-legacy/samples/binding-select-reactive-block/_config.js b/packages/svelte/tests/runtime-legacy/samples/binding-select-reactive-block/_config.js
new file mode 100644
index 0000000000..79d8ffff06
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/binding-select-reactive-block/_config.js
@@ -0,0 +1,46 @@
+import { test } from '../../test';
+import { tick } from 'svelte';
+
+export default test({
+	html: `
+		<select>
+			<option value="1">1</option>
+			<option value="US">US</option>
+			<option value="FR">FR</option>
+		</select>
+		<button id="btn-us">US</button>
+		<button id="btn-reset">Reset</button>
+		<button id="btn-fr">FR</button>
+	`,
+
+	async test({ assert, component, window, logs }) {
+		// Primary assertion: No infinite loop error
+		assert.notInclude(logs, 'Infinite loop detected');
+
+		// Verify component state
+		const select = window.document.querySelector('select');
+		if (!select) {
+			assert.fail('Select element not found');
+			return;
+		}
+
+		// With default_details fallback nothing is selected
+		assert.equal(select.value, '');
+		assert.equal(select.disabled, false);
+
+		window.document.getElementById('btn-us')?.click();
+		await tick();
+		assert.equal(select.disabled, true);
+		assert.equal(select.value, 'US');
+
+		window.document.getElementById('btn-reset')?.click();
+		await tick();
+		assert.equal(select.value, '');
+		assert.equal(select.disabled, false);
+
+		window.document.getElementById('btn-fr')?.click();
+		await tick();
+		assert.equal(select.value, 'FR');
+		assert.equal(select.disabled, true);
+	}
+});
diff --git a/packages/svelte/tests/runtime-legacy/samples/binding-select-reactive-block/main.svelte b/packages/svelte/tests/runtime-legacy/samples/binding-select-reactive-block/main.svelte
new file mode 100644
index 0000000000..45f2b129e8
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/binding-select-reactive-block/main.svelte
@@ -0,0 +1,41 @@
+<script>
+	const default_details = { country: '' };
+
+	$: data = { locked: false, details: null };
+
+	let details;
+	$: {
+		details = guard_infinite_loop() ?? data.details ?? default_details;
+	}
+
+	// Guard: if this reactive block runs too often we assume an infinite loop
+	let guard_infinite_loop_counter = 0;
+	function guard_infinite_loop() {
+		guard_infinite_loop_counter++;
+		if (guard_infinite_loop_counter > 20) {
+			throw new Error('Infinite loop detected');
+		}
+	}
+
+	function setUS() {
+		data = { locked: true, details: { country: 'US' } };
+	}
+
+	function resetData() {
+		data = { locked: false, details: null };
+	}
+
+	function setFR() {
+		data = { locked: true, details: { country: 'FR' } };
+	}
+</script>
+
+<select bind:value={details.country} disabled={data.locked}>
+	<option value="1">1</option>
+	<option value="US">US</option>
+	<option value="FR">FR</option>
+</select>
+
+<button id="btn-us" on:click={setUS}>US</button>
+<button id="btn-reset" on:click={resetData}>Reset</button>
+<button id="btn-fr" on:click={setFR}>FR</button>
diff --git a/packages/svelte/tests/runtime-legacy/samples/binding-select-reactive-fallback/_config.js b/packages/svelte/tests/runtime-legacy/samples/binding-select-reactive-fallback/_config.js
new file mode 100644
index 0000000000..d4274870ca
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/binding-select-reactive-fallback/_config.js
@@ -0,0 +1,46 @@
+import { tick } from 'svelte';
+import { test } from '../../test';
+
+export default test({
+	html: `
+		<select>
+			<option value="1">1</option>
+			<option value="US">US</option>
+			<option value="FR">FR</option>
+		</select>
+		<button id="btn-us">US</button>
+		<button id="btn-reset">Reset</button>
+		<button id="btn-fr">FR</button>
+	`,
+
+	async test({ assert, component, window, logs }) {
+		// Primary assertion: No infinite loop error
+		assert.notInclude(logs, 'Infinite loop detected');
+
+		// Verify component state
+		const select = window.document.querySelector('select');
+		if (!select) {
+			assert.fail('Select element not found');
+			return;
+		}
+
+		// With default_details fallback nothing is selected
+		assert.equal(select.value, '');
+		assert.equal(select.disabled, false);
+
+		window.document.getElementById('btn-us')?.click();
+		await tick();
+		assert.equal(select.disabled, true);
+		assert.equal(select.value, 'US');
+
+		window.document.getElementById('btn-reset')?.click();
+		await tick();
+		assert.equal(select.value, '');
+		assert.equal(select.disabled, false);
+
+		window.document.getElementById('btn-fr')?.click();
+		await tick();
+		assert.equal(select.value, 'FR');
+		assert.equal(select.disabled, true);
+	}
+});
diff --git a/packages/svelte/tests/runtime-legacy/samples/binding-select-reactive-fallback/main.svelte b/packages/svelte/tests/runtime-legacy/samples/binding-select-reactive-fallback/main.svelte
new file mode 100644
index 0000000000..09b5dff734
--- /dev/null
+++ b/packages/svelte/tests/runtime-legacy/samples/binding-select-reactive-fallback/main.svelte
@@ -0,0 +1,38 @@
+<script>
+	const default_details = { country: '' };
+
+	$: data = { locked: false, details: null };
+
+	$: details = guard_infinite_loop() ?? data.details ?? default_details;
+
+	// Guard: if this reactive block runs too often we assume an infinite loop
+	let guard_infinite_loop_counter = 0;
+	function guard_infinite_loop() {
+		guard_infinite_loop_counter++;
+		if (guard_infinite_loop_counter > 20) {
+			throw new Error('Infinite loop detected');
+		}
+	}
+
+	function setUS() {
+		data = { locked: true, details: { country: 'US' } };
+	}
+
+	function resetData() {
+		data = { locked: false, details: null };
+	}
+
+	function setFR() {
+		data = { locked: true, details: { country: 'FR' } };
+	}
+</script>
+
+<select bind:value={details.country} disabled={data.locked}>
+	<option value="1">1</option>
+	<option value="US">US</option>
+	<option value="FR">FR</option>
+</select>
+
+<button id="btn-us" on:click={setUS}>US</button>
+<button id="btn-reset" on:click={resetData}>Reset</button>
+<button id="btn-fr" on:click={setFR}>FR</button>