svelte icon indicating copy to clipboard operation
svelte copied to clipboard

Svelte 5: Migration doesn't convert variables set by store function into derived

Open KieranP opened this issue 1 year ago • 1 comments

Describe the bug

Have simplified this, basically, need to run store function when store changes at all:

<script lang="ts">
  import selectedEmailsStore from "$stores";

  const selectedEmails = $selectedEmailsStore && selectedEmailsStore.getSelectedEmails();
</script>

When running migration, nothing changes. Would expect this to be kept reactive:

<script lang="ts">
  import selectedEmailsStore from "$stores";

  const selectedEmails = $derived($selectedEmailsStore && selectedEmailsStore.getSelectedEmails())
</script>

Unless referencing a store magically makes the const store reactive without using state or derived runes?

Reproduction

See above

Logs

No response

System Info

System:
    OS: macOS 15.0.1
    CPU: (12) arm64 Apple M3 Pro
    Memory: 195.69 MB / 18.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 20.15.1 - ~/.asdf/installs/nodejs/20.15.1/bin/node
    Yarn: 4.3.1 - ~/.asdf/installs/nodejs/20.15.1/bin/yarn
    npm: 10.8.2 - ~/.asdf/plugins/nodejs/shims/npm
    bun: 1.1.0 - ~/.bun/bin/bun
  Browsers:
    Chrome: 130.0.6723.70
    Safari: 18.0.1
  npmPackages:
    svelte: ^5.1.3 => 5.1.3

Severity

annoyance

KieranP avatar Oct 27 '24 04:10 KieranP

const selectedEmails = $selectedEmailsStore && selectedEmailsStore.getSelectedEmails(); in Svelte 4 isn't reactive, and so the migrated runes code is also not reactive. Something like $: selectedEmails = $selectedEmailsStore && selectedEmailsStore.getSelectedEmails(); is reactive, and would be migrated to use $derived().

Conduitry avatar Oct 27 '24 05:10 Conduitry

@Conduitry Fascinating. Am wondering how this ever manged to work in our Svelte 4 production site then :-/

KieranP avatar Oct 28 '24 01:10 KieranP