Input with function bindings not working when not in root element

[henrykrinkle01]

Describe the bug

I'm testing the new function binding feature but can't get it to work for some reason. After comparing with the official demo, I found that putting an input inside a label makes it stop working:

<script>
	let value = $state(0);
</script>

{value}
<br />
<label for="workingInput">Working input</label> <br />
<input id="workingInput" bind:value={() => value + 1, (v) => (value = v - 1)} />
<br />
<label for="notWorkingInput">
	Not working Input <br />
	<input id="notWorkingInput" bind:value={() => value + 1, (v) => (value = v - 1)} />
</label>

Reproduction

https://svelte.dev/playground/1b9f67eca20944acb6376ab676204ecb?version=5.9.0

Logs

No response

System Info

System:
    OS: Windows 10 10.0.17763
    CPU: (32) x64 AMD Ryzen 9 3950X 16-Core Processor
    Memory: 34.65 GB / 63.94 GB
  Binaries:
    Node: 22.5.1 - C:\Program Files\nodejs\node.EXE
    npm: 10.8.3 - C:\Program Files\nodejs\npm.CMD
    pnpm: 9.10.0 - C:\ProgramData\chocolatey\bin\pnpm.EXE
  Browsers:
    Chrome: 131.0.6778.109
    Internet Explorer: 11.0.17763.2989

Severity

blocking an upgrade

[Prinzhorn]

It's not specific to <label>. It appears this only works on root elements.

Broken:

<script>
	let value = $state(0);

	function redraw() {
		console.log('redraw');
	}
</script>

<div><input bind:value={() => value + 1, (v) => (value = v - 1)} /></div>

<div>
	<div bind:clientWidth={null, redraw}
		bind:clientHeight={null, redraw}>helo</div>
</div>

https://svelte.dev/playground/1b9f67eca20944acb6376ab676204ecb?version=5.9.0#H4sIAAAAAAAAA22QQU-EMBCF_8qkMVmIuLhXLCR68h94EA8szC6Nddq0A2oI_90WWDXGU5v3pt9700lQ84aiEA_OvCKBIjuwyMRJafSieJ4Ef9roRyHo2_S9tXs_ouaoHRuP_-mtIUbigBHSt05ZrmqqWSPD2OgBoYQrzw1jcpveBSd4p4FaVobAYeea9ySFKco1B5Y3GvfanJPdau6WRzzXJPMfPMlOjZVc9oCjoq5YssopsMpqC76GQwbJuCjJpcsIN3BIZ8grmUfGNyymxMuKa7UKSz2pjvtyokHrbCs7r01_DT2iOvf8Z6rqUZtLwnqGv2L8YFGwG3B-mb8AX7niJpUBAAA=

Works:

<script>
	let value = $state(0);

	function redraw() {
		console.log('redraw');
	}
</script>

<input bind:value={() => value + 1, (v) => (value = v - 1)} />

<div bind:clientWidth={null, redraw}
		bind:clientHeight={null, redraw}>helo</div>

https://svelte.dev/playground/1b9f67eca20944acb6376ab676204ecb?version=5.9.0#H4sIAAAAAAAAA22QzU7EMAyEX8WKkDYVZcteS1uJPe0bcKAcsq13GxGcKnELKOq7k_4gEOL6zXg8dhCk3lDk4ujsKxJo6gcWqbhog17kz0HwZz_rM4h8cz_2_d6PaHhmZ-XxP95YYiSOMaLwjdM9VzXVbJBhVGZAKOHGs2KU98lDVKJ2GahhbQkctk69ywTCjGuOWd4a3Bt7lbtV3C1DPNVUZD_xVCwnwFlTmy9ryhBjymrbeQuHFOS4EPldY4Q7OCQTZGtCq8d1vjE6HvCkW-7KQIMx6VZsWlv9Mp1QXzv-46o6NLbIYl4V_8H4wSJnN-D0Mn0BHVg4FXkBAAA=