fix: improve select handling of dynamic value with placeholders (#12181)

* fix: improve select handling of dynamic value with placeholders

* format

Author: trueadm

.changeset/wicked-ways-reply.md

@@ -0,0 +1,5 @@
+---
+"svelte": patch
+---
+
+fix: improve select handling of dynamic value with placeholders

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

@@ -39,10 +39,12 @@ export function select_option(select, value, mounting) {
  * @param {() => V} [get_value]
  */
 export function init_select(select, get_value) {
+	let mounting = true;
 	effect(() => {
 		if (get_value) {
-			select_option(select, untrack(get_value));
+			select_option(select, untrack(get_value), mounting);
 		}
+		mounting = false;
 
 		var observer = new MutationObserver(() => {
 			// @ts-ignore

packages/svelte/tests/runtime-runes/samples/snippet-select/Select.svelte

@@ -0,0 +1,6 @@
+<script>
+	let { children, ...rest } = $props();
+</script>
+<select name="pets" id="pet-select1" {...rest}>
+  {@render children()}
+</select>

packages/svelte/tests/runtime-runes/samples/snippet-select/_config.js

@@ -0,0 +1,7 @@
+import { test } from '../../test';
+
+export default test({
+	html: `<div><label for="pet-select">Choose a pet 1:</label><select id="pet-select1" name="pets">
+	<option value="">--Please choose an option--</option><option value="dog">Dog</option><option value="cat">Cat</option></select></div><div><label for="pet-select">Choose a pet 2:</label>
+	<select id="pet-select2" name="pets"><option value="">--Please choose an option--</option><option value="dog">Dog</option><option value="cat">Cat</option></select></div>`
+});

packages/svelte/tests/runtime-runes/samples/snippet-select/main.svelte

@@ -0,0 +1,21 @@
+<script>
+	import Select from './Select.svelte'
+</script>
+
+<div>
+	<label for="pet-select">Choose a pet 1:</label>
+	<Select>
+		<option value="">--Please choose an option--</option>
+		<option value="dog">Dog</option>
+		<option value="cat">Cat</option>
+	</Select>
+</div>
+
+<div>
+	<label for="pet-select">Choose a pet 2:</label>
+	<select name="pets" id="pet-select2">
+		<option value="">--Please choose an option--</option>
+		<option value="dog">Dog</option>
+		<option value="cat">Cat</option>
+	</select>
+</div>