Merge branch 'sveltejs:main' into docs-track-state-async-callbacks

.changeset/tidy-select-spreads.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: preserve select selection when spread attributes omit value

packages/svelte/src/internal/client/dom/elements/bindings/select.js

@@ -56,8 +56,10 @@ export function select_option(select, value, mounting = false) {
  */
 export function init_select(select) {
 	var observer = new MutationObserver(() => {
-		// @ts-ignore
+		if ('__value' in select) {
-		select_option(select, select.__value);
+			// @ts-ignore
+			select_option(select, select.__value);
+		}
 		// Deliberately don't update the potential binding value,
 		// the model should be preserved unless explicitly changed
 	});

packages/svelte/tests/runtime-legacy/samples/select-spread-preserve-selection/_config.js

@@ -0,0 +1,25 @@
+import { flushSync } from 'svelte';
+import { ok, test } from '../../test';
+
+export default test({
+	mode: ['client', 'hydrate'],
+
+	async test({ assert, component, target }) {
+		const select = target.querySelector('select');
+		ok(select);
+
+		assert.equal(select.selectedIndex, 0);
+
+		component.toggle();
+		flushSync();
+		await Promise.resolve();
+
+		assert.equal(select.selectedIndex, 0);
+
+		component.toggle();
+		flushSync();
+		await Promise.resolve();
+
+		assert.equal(select.selectedIndex, 0);
+	}
+});

packages/svelte/tests/runtime-legacy/samples/select-spread-preserve-selection/main.svelte

@@ -0,0 +1,16 @@
+<script>
+	let show_extra = false;
+	const attributes = { 'aria-label': 'choice' };
+
+	export function toggle() {
+		show_extra = !show_extra;
+	}
+</script>
+
+<select {...attributes}>
+	<option value="">Choose an option</option>
+	<option value="first">First</option>
+	{#if show_extra}
+		<option value="extra">Extra</option>
+	{/if}
+</select>