From c0d670d8a3369fa850a88ea654e483b9f9d9a823 Mon Sep 17 00:00:00 2001
From: Rich Harris <rich.harris@vercel.com>
Date: Wed, 28 May 2025 18:02:25 -0400
Subject: [PATCH] simplify a bit (pass callback direct to valueless_option)

---
 .../server/visitors/RegularElement.js         | 16 +++++++--
 .../server/visitors/shared/element.js         | 10 ------
 packages/svelte/src/internal/server/index.js  | 34 ++++++++++---------
 .../_expected/server/index.svelte.js          |  8 +----
 4 files changed, 32 insertions(+), 36 deletions(-)

diff --git a/packages/svelte/src/compiler/phases/3-transform/server/visitors/RegularElement.js b/packages/svelte/src/compiler/phases/3-transform/server/visitors/RegularElement.js
index 000df4b086..c19e995349 100644
--- a/packages/svelte/src/compiler/phases/3-transform/server/visitors/RegularElement.js
+++ b/packages/svelte/src/compiler/phases/3-transform/server/visitors/RegularElement.js
@@ -127,7 +127,16 @@ export function RegularElement(node, context) {
 		}
 	}
 
-	if (body === null) {
+	const is_option_with_implicit_value =
+		node.name === 'option' &&
+		!node.attributes.some(
+			(attribute) =>
+				attribute.type === 'SpreadAttribute' ||
+				((attribute.type === 'Attribute' || attribute.type === 'BindDirective') &&
+					attribute.name === 'value')
+		);
+
+	if (body === null && !is_option_with_implicit_value) {
 		process_children(trimmed, { ...context, state });
 	} else {
 		// we need the body if:
@@ -137,14 +146,15 @@ export function RegularElement(node, context) {
 		const inner_state = { ...state, template: [], init: [] };
 		process_children(trimmed, { ...context, state: inner_state });
 
-		if (node.name === 'option') {
+		if (is_option_with_implicit_value) {
 			// in case of a valueless `<option>` element, $$body is a function that accepts the children...internally it
 			// will run the children to get the value of the body at runtime since it's needed to for the implicit value
 			// selection
 			state.template.push(
 				b.stmt(
 					b.call(
-						body,
+						'$.valueless_option',
+						b.id('$$payload'),
 						b.thunk(b.block([...inner_state.init, ...build_template(inner_state.template)]))
 					)
 				)
diff --git a/packages/svelte/src/compiler/phases/3-transform/server/visitors/shared/element.js b/packages/svelte/src/compiler/phases/3-transform/server/visitors/shared/element.js
index 5aba3e6cf0..7207564ef9 100644
--- a/packages/svelte/src/compiler/phases/3-transform/server/visitors/shared/element.js
+++ b/packages/svelte/src/compiler/phases/3-transform/server/visitors/shared/element.js
@@ -200,12 +200,6 @@ export function build_element_attributes(node, context) {
 		}
 	}
 
-	let is_option_with_implicit_value =
-		node.name === 'option' &&
-		!attributes.some(
-			(attribute) => attribute.type === 'SpreadAttribute' || attribute.name === 'value'
-		);
-
 	if (has_spread) {
 		build_element_spread_attributes(node, attributes, style_directives, class_directives, context);
 		if (node.name === 'option') {
@@ -306,10 +300,6 @@ export function build_element_attributes(node, context) {
 		}
 	}
 
-	if (is_option_with_implicit_value) {
-		content = b.call('$.valueless_option', b.id('$$payload'));
-	}
-
 	if (events_to_capture.size !== 0) {
 		for (const event of events_to_capture) {
 			context.state.template.push(b.literal(` ${event}="this.__e=event"`));
diff --git a/packages/svelte/src/internal/server/index.js b/packages/svelte/src/internal/server/index.js
index 27a4198840..5b69fc320f 100644
--- a/packages/svelte/src/internal/server/index.js
+++ b/packages/svelte/src/internal/server/index.js
@@ -547,21 +547,23 @@ export function maybe_selected(payload, value) {
 
 /**
  * @param {Payload} payload
- * @returns {(child: () => void) => void}
+ * @param {() => void} children
+ * @returns {void}
  */
-export function valueless_option(payload) {
-	return (child) => {
-		// store the initial payload before executing the child
-		let initial_payload = payload.out;
-		// execute the child to get the runtime body of the option
-		child();
-		// remove the initial payload and eventual hydration comments
-		let body = payload.out.substring(initial_payload.length).replace(/<!---->/g, '');
-		// check the value of the body with the select_value
-		if (body === payload.select_value) {
-			// substring the initial payload to remove the last character (the closing `>`)
-			// append selected and the body (the closing tag will be added later)
-			payload.out = initial_payload.substring(0, initial_payload.length - 1) + ' selected>' + body;
-		}
-	};
+export function valueless_option(payload, children) {
+	// store the initial payload before rendering children
+	let initial_payload = payload.out;
+
+	// execute the child to get the runtime body of the option
+	children();
+
+	// remove the initial payload and eventual hydration comments
+	let body = payload.out.substring(initial_payload.length).replace(/<!---->/g, '');
+
+	// check the value of the body with the select_value
+	if (body === payload.select_value) {
+		// substring the initial payload to remove the last character (the closing `>`)
+		// append selected and the body (the closing tag will be added later)
+		payload.out = initial_payload.substring(0, initial_payload.length - 1) + ' selected>' + body;
+	}
 }
diff --git a/packages/svelte/tests/snapshot/samples/skip-static-subtree/_expected/server/index.svelte.js b/packages/svelte/tests/snapshot/samples/skip-static-subtree/_expected/server/index.svelte.js
index b9f9c79c07..0532ec5aa9 100644
--- a/packages/svelte/tests/snapshot/samples/skip-static-subtree/_expected/server/index.svelte.js
+++ b/packages/svelte/tests/snapshot/samples/skip-static-subtree/_expected/server/index.svelte.js
@@ -3,11 +3,5 @@ import * as $ from 'svelte/internal/server';
 export default function Skip_static_subtree($$payload, $$props) {
 	let { title, content } = $$props;
 
-	$$payload.out += `<header><nav><a href="/">Home</a> <a href="/away">Away</a></nav></header> <main><h1>${$.escape(title)}</h1> <div class="static"><p>we don't need to traverse these nodes</p></div> <p>or</p> <p>these</p> <p>ones</p> ${$.html(content)} <p>these</p> <p>trailing</p> <p>nodes</p> <p>can</p> <p>be</p> <p>completely</p> <p>ignored</p></main> <cant-skip><custom-elements with="attributes"></custom-elements></cant-skip> <div><input autofocus/></div> <div><source muted/></div> <select><option value="a"${$.maybe_selected($$payload, 'a')}>`;
-
-	$.valueless_option($$payload)(() => {
-		$$payload.out += `a`;
-	});
-
-	$$payload.out += `</option></select> <img src="..." alt="" loading="lazy"/> <div><img src="..." alt="" loading="lazy"/></div>`;
+	$$payload.out += `<header><nav><a href="/">Home</a> <a href="/away">Away</a></nav></header> <main><h1>${$.escape(title)}</h1> <div class="static"><p>we don't need to traverse these nodes</p></div> <p>or</p> <p>these</p> <p>ones</p> ${$.html(content)} <p>these</p> <p>trailing</p> <p>nodes</p> <p>can</p> <p>be</p> <p>completely</p> <p>ignored</p></main> <cant-skip><custom-elements with="attributes"></custom-elements></cant-skip> <div><input autofocus/></div> <div><source muted/></div> <select><option value="a"${$.maybe_selected($$payload, 'a')}>a</option></select> <img src="..." alt="" loading="lazy"/> <div><img src="..." alt="" loading="lazy"/></div>`;
 }
\ No newline at end of file