fix: transform derived assignments and select function bindings correctly during server-side rendering (#18669)

follow-up to the fix in #18607 - there are a two more bugs related to
writeable deriveds in that area

.changeset/slow-dots-smile.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: transform derived assignments and select function bindings correctly during server-side rendering

packages/svelte/src/compiler/phases/3-transform/server/visitors/AssignmentExpression.js

@@ -110,7 +110,7 @@ function build_assignment(operator, left, right, context) {
 			context.visit(build_assignment_value(operator, left, right))
 		);
 
-		return b.call(binding.node, value);
+		return b.call(object, value);
 	}
 
 	return null;

packages/svelte/src/compiler/phases/3-transform/server/visitors/shared/element.js

@@ -324,10 +324,9 @@ export function build_spread_object(element, attributes, context, transform) {
 				return b.prop('init', b.key(name), value);
 			} else if (attribute.type === 'BindDirective') {
 				const name = get_attribute_name(element, attribute);
+				const expression = /** @type {Expression} */ (context.visit(attribute.expression));
 				const value =
-					attribute.expression.type === 'SequenceExpression'
-						? b.call(attribute.expression.expressions[0])
-						: /** @type {Expression} */ (context.visit(attribute.expression));
+					expression.type === 'SequenceExpression' ? b.call(expression.expressions[0]) : expression;
 
 				return b.prop('init', b.key(name), value);
 			}

packages/svelte/tests/runtime-runes/samples/derived-forward-ref-leading-comments/_config.js

@@ -1,6 +0,0 @@
-import { test } from '../../test';
-
-export default test({
-	ssrHtml: '<p>LATER</p> <input value="LATER">',
-	html: '<p>LATER</p> <input>'
-});

packages/svelte/tests/runtime-runes/samples/derived-leading-comments/_config.js

@@ -0,0 +1,6 @@
+import { test } from '../../test';
+
+export default test({
+	ssrHtml: '<p>y:y</p> <p>LATER</p> <input value="LATER">',
+	html: '<p>y:y</p> <p>LATER</p> <input>'
+});

packages/svelte/tests/runtime-runes/samples/derived-leading-comments/main.svelte

@@ -1,4 +1,13 @@
 <script>
+	function write(value) {
+		return foo = value;
+	}
+
+	// a leading comment on the declaration
+	// that spans more than one line
+	let foo = $derived('x');
+	let bar = write('y');
+
 	const ctx = {
 		get later() {
 			return later;
@@ -10,5 +19,6 @@
 	let later = $derived.by(() => 'LATER');
 </script>
 
+<p>{foo}:{bar}</p>
 <p>{ctx.later}</p>
 <input bind:value={later} />

packages/svelte/tests/runtime-runes/samples/select-function-binding-derived/_config.js

@@ -0,0 +1,9 @@
+import { test } from '../../test';
+
+export default test({
+	ssrHtml: '<select><option value="a">a</option><option value="b" selected="">b</option></select>',
+	test({ assert, target }) {
+		const select = /** @type {HTMLSelectElement} */ (target.querySelector('select'));
+		assert.equal(select.value, 'b');
+	}
+});

packages/svelte/tests/runtime-runes/samples/select-function-binding-derived/main.svelte

@@ -0,0 +1,9 @@
+<script>
+	let source = $state('b');
+	let value = $derived(source);
+</script>
+
+<select bind:value={() => value, (next) => (value = next)}>
+	<option value="a">a</option>
+	<option value="b">b</option>
+</select>