Skip to content

$derived($state.eager()) reactivity loss #17130

@dylan1951

Description

@dylan1951

Describe the bug

Since 5.43.4 if you include $state.eager() in a $derived or $derived.by the reactivity can stop working.

Reproduction

REPL

<script>
    let open = $state(false);

    const derivedEagerOpen = $derived($state.eager(open));

    $inspect('derivedEagerOpen', derivedEagerOpen);
</script>

<button onclick={() => open = !open}>Toggle</button>

<p>open: {open}</p>
<p>derivedEagerOpen: {derivedEagerOpen}</p>

Please keep in mind this is just a silly minimal reproduction of the underlying cause of some complex bits-ui popover issues I've been having. Please believe me there is a good reason for using $state.eager like this. (closing a combobox immediately after selecting to be consistent with native select element behaviour). (somewhere bits-ui uses boxWith from svelte-toolbelt which uses a $derived.by on the bound $state.eager(open).

Logs

System Info

Svelte playground

Severity

blocking an upgrade

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions