Problems running legacy code in server.js

[ispyinternet]

Describe the bug

I have been developing an app, which I have now started to migrate to svelte 5.

Everything works in dev, but when I build it using adapter-node the site breaks.

I have a simple legacy component, that uses both getContext and $:

With $: I get the error from effects.js,

Cannot read properties of null (reading 'r1')

from this code

svelte/packages/svelte/src/internal/client/reactivity/effects.js

Line 274 in 2342c87

export function legacy_pre_effect(deps, fn) {

If I remove the reactive $: syntax and just leave the getContext I get:

Cannot read properties of null (reading 'u')

from this code

svelte/packages/svelte/src/internal/client/dom/legacy/lifecycle.js

Line 12 in 2342c87

export function init(immutable = false) {

In both cases it seems like context.l being null is the culprit. At its simplest the failing legacy component:

    import { getContext } from 'svelte';
    import { CONTEXT_PAGE_STORE } from '$lib/config/context';
    
    const page: Writable<Types.PageState> = getContext(CONTEXT_PAGE_STORE);
</script>

{#if $page.viewState == 'state_loading'}
    <div class="loading">
    </div>
{/if}

Reproduction

Will create and update the issue

Logs

System Info

System:
    OS: Linux 6.1 Amazon Linux 2023
    CPU: (4) x64 Intel(R) Xeon(R) Platinum 8175M CPU @ 2.50GHz
    Memory: 6.53 GB / 15.41 GB
    Container: Yes
    Shell: 5.2.15 - /bin/bash
  Binaries:
    Node: 20.11.0 - ~/.nvm/versions/node/v20.11.0/bin/node
    Yarn: 1.22.19 - ~/.npm-global/bin/yarn
    npm: 8.15.1 - ~/.npm-global/bin/npm
    pnpm: 8.15.0 - ~/.local/share/pnpm/pnpm
  npmPackages:
    svelte: ^5.25.6 => 5.25.6

Severity

blocking all usage of svelte

[7nik]

It looks like something wrong with your setup: legacy_pre_effect is client-only, which means you're trying to run client's code on the server.

[ispyinternet]

No this is error is in the browser. So far my minimal reproduction on stackblitz is not exhibiting the error so i am still struggling to isolate root cause

[ispyinternet]

What is context.l supposed to represent? Might help me on where to look.

[7nik]

From what I see, context.l is null when the component in the runes mode due to using runes or setting options.runes.

[ispyinternet]

so why if a component is in runes mode, is svelte calling legacy functions?

[7nik]

No idea, this is why we always ask for a reproduction

[ispyinternet]

For anyone who might stumble on a similar issue, this was resolved by changing the treeshake property from rollupOptions in vite config from smallest to recommended.

Particularly painful bug.