-
-
Notifications
You must be signed in to change notification settings - Fork 4.7k
Open
Description
Describe the bug
{@const} in child component loses reactivity after navigation when parent uses svelte:boundary with await
eg. in parent
<svelte:boundary>
{@const data = await getPayments(params)
<TestComponent value={(data) => JSON.stringify(data.rows)} arg={data} />
</svelte:boundary>eg. child component
<script lang="ts">
type Props = {
value: string | number | ((arg: any) => any);
arg?: any;
};
let { value, arg = {} }: Props = $props();
</script>
{#if typeof value === "string" || typeof value === "number"}
{value}
{:else if value instanceof Function}
{@const result = value(arg)}
{result}
{/if}Workarounds that fix it:
- Adding 100ms delay to async function 😁
- move const to the script tag and $derive it from the props
- force read the
{@const result}in the block , eg. console.logging, or result.toString(), etc. - downgrading to 5.43.0
Reproduction
https://github.com/yayza/async-const-test
- on initial load, paginate, everything sync correctly
- click the button to navigate to some other page
- go back
- now paginate again and notice the value in the child doesn't change, the remote data, and the child's props are reactive, but result doesn't re-evaulate
Logs
Nothing logsSystem Info
System:
OS: Windows 11 10.0.26100
CPU: (24) x64 AMD Ryzen 9 9900X 12-Core Processor
Memory: 5.22 GB / 31.08 GB
Binaries:
Node: 24.6.0 - C:\nvm4w\nodejs\node.EXE
npm: 11.5.1 - C:\nvm4w\nodejs\npm.CMD
pnpm: 10.15.0 - C:\nvm4w\nodejs\pnpm.CMD
Deno: 2.5.6 - C:\Users\admin\AppData\Local\Microsoft\WinGet\Packages\DenoLand.Deno_Microsoft.Winget.Source_8wekyb3d8bbwe\deno.EXE
Browsers:
Edge: Chromium (140.0.3485.54)
Firefox Developer Edition: 145.0 - C:\Program Files\Firefox Developer Edition\firefox.exe
npmPackages:
svelte: ^5.45.6 => 5.45.6Severity
annoyance
Metadata
Metadata
Assignees
Labels
No labels