[Svelte 5] bind:this on components not working

[terrywh]

Describe the bug

'undefined' is logged with the following:

https://svelte-5-preview.vercel.app/#H4sIAAAAAAAAE41QwUrFMBD8lXXx8B6U9nmtbUHwL4wHX5raYJoNyfYVCfl32Rb0IIK3nWVmZ3YyTtaZhO1LRv-2GGzxKQSskD-DgHQzjg1WmGiNWjZd0tEGHpRXbJdAkeHZLARTpAUU1o2g-tApfBSaMwzGyV6gVzytXrMlD2mm7XSGLEvFmnwiZ2pH76eDf971Rfmu-bH13Whvu3-3O2925LlX-HC5KISr9WPLs019Pm6UodszHYrrykweyGtn9UefJUEZDn-Zd1JzsAbxFS-scKHRTtaM2HJcTam-65LT_-1LisggQugVbhTdqBAK9HAfIoV0kn9_vzob56iCLMJy91ek1_IF6Flw4s0BAAA=

Reproduction

• app.svelte

<script>
	import Demo from "./Demo.svelte";
	let elDemo;

	function show() {
		console.log(elDemo);
	}
</script>

<div>
	<Demo width="100" bind:this={elDemo}></Demo>
	<button onclick={show}>
		show
	</button>
</div>

• Demo.svelte

<script>
	let { name ="world" } = $props();
</script>

<div>hello, {name}!</div>

Logs

undefined xN

System Info

MacOS/Chrome

Severity

blocking an upgrade

[dm-de]

EDIT!
I changed my mind.

I'm not sure...
but if you wanted this:

LINK

Note that i changed bind:this to bind:name
and Svelte 5 forbids default value

[terrywh]

I'm binding the component element, for method / property access. are you suggesting I should bind every method/props?

[Malix-Labs]

This could be the consequence of #9764

[trueadm]

You're binding to a component that doesn't export anything. You're going to get undefined. This is listed in the expected breaking changes for Svelte 5 – previously you'd get an instance of a component, but we don't do that anymore in Svelte 5.

[dm-de]

I want to share an example with Svelte 5 bind:this

LINK

[terrywh]

You're binding to a component that doesn't export anything. You're going to get undefined. This is listed in the expected breaking changes for Svelte 5 – previously you'd get an instance of a component, but we don't do that anymore in Svelte 5.

then access to the props should use bind like the example @dm-de provided above ( bind:name={xxx} ) or using <svelte:options accessor={true} />

[Florinstruct]

What dm-de proposed is perfectly fine for Legacy Svelte, but not for Svelte 5.

[xreider]

The only working solution that does not throw an error. Note that a function is passed that assigns a node
https://svelte.dev/playground/f2129e9f3e1d4910a0112e9c6fa47441?version=5.8.0