fix: omit this bind this arg if we know it's not a signal (#9635)

fixes #9629

Co-authored-by: Dominic Gannaway <[email protected]>

Author: dummdidumm

.changeset/lovely-rules-eat.md

@@ -0,0 +1,5 @@
+---
+'svelte': patch
+---
+
+fix: omit this bind this arg if we know it's not a signal

packages/svelte/src/compiler/phases/3-transform/client/visitors/template.js

@@ -899,7 +899,10 @@ function serialize_inline_component(node, component_name, context) {
 	if (bind_this !== null) {
 		const prev = fn;
 		const assignment = b.assignment('=', bind_this, b.id('$$value'));
-		const bind_this_id = bind_this;
+		const bind_this_id = /** @type {import('estree').Expression} */ (
+			// if expression is not an identifier, we know it can't be a signal
+			bind_this.type === 'Identifier' ? bind_this : undefined
+		);
 		fn = (node_id) =>
 			b.call(
 				'$.bind_this',
@@ -2621,18 +2624,17 @@ export const template_visitors = {
 					break;
 				}
 
-				case 'this': {
-					const expression = node.expression;
+				case 'this':
 					call_expr = b.call(
 						`$.bind_this`,
 						state.node,
 						setter,
-						expression.type === 'Identifier'
-							? expression
-							: /** @type {import('estree').Expression} */ (visit(expression))
+						/** @type {import('estree').Expression} */ (
+							// if expression is not an identifier, we know it can't be a signal
+							node.expression.type === 'Identifier' ? node.expression : undefined
+						)
 					);
 					break;
-				}
 				case 'textContent':
 				case 'innerHTML':
 				case 'innerText':

packages/svelte/tests/runtime-runes/samples/each-bind-this-member/_config.js

@@ -0,0 +1,7 @@
+import { test } from '../../test';
+
+export default test({
+	async test({ assert, target, component }) {
+		assert.equal(target.querySelector('img'), component.items[0].img);
+	}
+});

packages/svelte/tests/runtime-runes/samples/each-bind-this-member/main.svelte

@@ -0,0 +1,11 @@
+<script>
+	let { items = [{ src: 'https://ds' }] } = $props();
+</script>
+
+{#each items as item, i}
+	<img
+		src={item.src}
+		bind:this={items[i].img}
+		alt="slider{i}"
+	/>
+{/each}