Repository: sveltejs/svelte (JavaScript)

Issue:
Svelte 5: select value doesn't match bound value after removing option
### Describe the bug

When options are rendered from an array via an `#each` loop, and the selected item is removed from the array, no option should be selected since none match the bound value. This works as expected in Svelte 4, but in Svelte 5 an option that doesn't match the bound value incorrectly appears selected.

### Reproduction

[Svelte 5 REPL](https://svelte-5-preview.vercel.app/#H4sIAAAAAAAAClVRy26EMAz8FTe9gLQqdxqQKu0XtMfNHngYNRIkaeIgVZR_bx7QVU9OZuzxTLKxSc7oWH3bmOoWZDV7M4ZdGH2beHErzoTh7rS3Q0S4G6w01AolaEYCSbg4aOAmWCfYBQTrcxkEu7-eXQ5nHAjHCARo8mogqRWMASf8ONiihC3Sgk7VVF-CR0JbFLKEpgUJT03zp1imHbtQvHo4U3zSdgGtauf7RdKPsbiioitOnZ-p2f7v3VManiWhl2qs12722Gznlh0sfnlpcWyzwe0Zu-HzSN-5dNgzFZS0SekOkcS1ufAqc6dMFWXSYPCflrX5iXjviULfOy56RchTvDrQGDdGzGFNeyap4WGZVybQ4e8WPcpJ4shqsh73-_4LNknWfvYBAAA=)

[Svelte 4 REPL](https://svelte.dev/repl/491353c2882941199ef2678a18fd593d?version=4.2.7) for comparison.

I implemented [a test which fails in Svelte 5](https://github.com/theodorejb/svelte/commit/a4b14a1513a437f120b0bd2402cd316e3805177a) while passing in Svelte 4.

### Logs

_No response_

### System Info

```shell
Firefox, Edge
```


### Severity

blocking an upgrade


Discussion: I'm unsure what the correct behavior should be here. Should the selected option be updated, or should it be out of sync?
I would suggest making it behave like v4 for compatibility.

It can just be the responsibility of whoever removes the option to also update the selection/value if necessary/desired.
I agree the behavior should match Svelte 4. I got stuck trying to implement this myself, though, as I'm not sure how to detect that the selected option was removed from the DOM, or else run `select_option` as an effect after options have been replaced.
Probably the most robust way is using a mutationobserver to check the list for changes



Fix (patch):
diff --git a/.changeset/smart-turkeys-tell.md b/.changeset/smart-turkeys-tell.md
new file mode 100644
index 000000000000..b4598ca14bc0
--- /dev/null
+++ b/.changeset/smart-turkeys-tell.md
@@ -0,0 +1,5 @@
+---
+"svelte": patch
+---
+
+fix: ensure select value is updated upon select element removal
diff --git a/packages/svelte/src/internal/client/dom/elements/bindings/select.js b/packages/svelte/src/internal/client/dom/elements/bindings/select.js
index 5e6241f8cd54..8c0f535cd11b 100644
--- a/packages/svelte/src/internal/client/dom/elements/bindings/select.js
+++ b/packages/svelte/src/internal/client/dom/elements/bindings/select.js
@@ -91,6 +91,28 @@ export function bind_select_value(select, get_value, update) {
 		select.__value = value;
 		mounting = false;
 	});
+
+	// If one of the options gets removed from the DOM, the value might have changed
+	effect(() => {
+		var observer = new MutationObserver(() => {
+			// @ts-ignore
+			var value = select.__value;
+			select_option(select, value, mounting);
+			/** @type {HTMLOptionElement | null} */
+			var selected_option = select.querySelector(':checked');
+			if (selected_option === null || get_option_value(selected_option) !== value) {
+				update('');
+			}
+		});
+
+		observer.observe(select, {
+			childList: true
+		});
+
+		return () => {
+			observer.disconnect();
+		};
+	});
 }
 
 /**