5.43.0: Using `await` with `@const` in a boundary with no `pending` snippet causing every elements to be doubled

[henrykrinkle01]

Describe the bug

Before this, I used const foo = $derived(await getFoo()); in the script tag. However, this causes every dropdown elements to not function. In an attempt to fix the issue, I move it down to the markup section using @const and now everything is displayed twice. It seems one version is from SSR and non-interactive and the other is from hydration.

Reproduction

//test.remote.ts
import { query } from '$app/server';
export const getFoo = query(() => 'foo');

<script lang="ts">
	import { getFoo } from './test.remote.js';
</script>

<svelte:boundary>
	{@const foo = await getFoo()}
	<p>Everything here is doubled</p>
	<button class="border" onclick={() => console.log("I'm clickable")}>
		Click me and check log
	</button>
</svelte:boundary>

https://www.sveltelab.dev/re9l2v5211tgm03

Logs

System Info

svelte@5.43.0
kit@2.48.3

Severity

blocking an upgrade

[henrykrinkle01]

At first I thought this was caused by the shadcn-svelte sidebar component but it wasn't. I eliminated all the dependencies and it's still happening. Updated SvelteLab REPL. Pinpointed the version to 5.43.0.