kit icon indicating copy to clipboard operation
kit copied to clipboard

Outdated return value from invalidated load function on navigation

Open jackgdll opened this issue 1 year ago • 1 comments

Describe the bug

I've been trying to get data from a nested +layout.server.ts to invalidate using a custom identifier.

I have a file structure like this:

routes/
|- counter/
	|- +layout.server.ts   	<-- `depends('increment:counter')`
	|- [id]/
		|- +page.server.ts 	<-- loads more data and lets sveltekit merge the returned value
		|- +page.svelte 	<-- has a button that calls `invalidate('increment:counter')` and a link to change the `id` param

Since SvelteKit v2, calling invalidate in the nested +page.svelte will increase the counter, but a navigation to a different subroute of /counter/ will reset the counter to the value it had on initial load

This doesn't happen with invalidateAll but it will increment the first time you navigate after calling it, this is unexpected to me.

Adding a call to parent in the +page.server.ts and manually merging it into the returned data will stop the counter resetting but it will now increment on every navigation.

Is there a reason why the +page.server.ts is using the outdated value of counter instead on using the value from the last invalidation?

Reproduction

SvelteKit v2: https://stackblitz.com/edit/sveltejs-kit-template-default-7psjuw?file=package.json

SvelteKit v1: https://stackblitz.com/edit/sveltejs-kit-template-default-3ju85k?file=package.json

Logs

No response

System Info

System:
    OS: Linux 5.0 undefined
    CPU: (2) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
    Memory: 0 Bytes / 0 Bytes
    Shell: 1.0 - /bin/jsh
  Binaries:
    Node: 18.18.0 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 9.4.2 - /usr/local/bin/npm
    pnpm: 8.10.5 - /usr/local/bin/pnpm
  npmPackages:
    @sveltejs/adapter-auto: ^3.0.0 => 3.0.1 
    @sveltejs/kit: ^2.0.0 => 2.0.5 
    @sveltejs/vite-plugin-svelte: ^3.0.0 => 3.0.1 
    svelte: ^4.2.7 => 4.2.8 
    vite: ^5.0.3 => 5.0.10

Severity

serious, but I can work around it

Additional Information

This was introduced in SvelteKit v2, here is a v1 reproduction that doesn't have the issue: https://stackblitz.com/edit/sveltejs-kit-template-default-3ju85k?file=package.json

jackgdll avatar Dec 22 '23 11:12 jackgdll

I'm also having a similar issue where I use a +layout.server.ts for AuthJS, and a +layout.ts for fetching some data.

The load function in +layout.ts is run when invalidated but the data in +page.svelte isn't changing, if I console log on both sides (reactively in +page.svelte), it shows different values

WhyAsh5114 avatar Dec 23 '23 09:12 WhyAsh5114

We are experiencing this as well.

  • Let's say we have a value of x = 1 stored in our database, and it is loaded in a value in a '/+layout.server.ts' with a depends('app:number').
  • In "/RouteA/+page.svelte", we display the value (correctly), then we call an API that updates x to 2 in the database, then call the invalidate('app:number'), it displays the new value of 2 in the page (again, correctly).
  • Then, we navigate to '/RouteB/+page.svelte' which also displays the value of x, but it will show the non-invalidated value of 1.
  • Then, refresh the browser, and now '/RouteB/+page.svelte' shows the corrected value of x as 2.

Additional notes:

If the '/Route.../' DOES NOT have a +page.server.ts

  • The problem DOES NOT exist, and it navigates as expected with the correct value

If the '/Route.../' DOES have a +page.server.ts

  • If parent() IS NOT called, the problem DOES exist, and a navigation will show the incorrect value
  • If parent() IS called, the problem DOES NOT EXISTS, and it navigates as expected with the correct value

Note that this behavior is different from SvelteKit 1, which would have always refreshed properly, with or without a parent() call.

denjpeters avatar Jan 12 '24 00:01 denjpeters

If it helps, I created a small sample app that demonstrates the problem using a persisted value in the hooks file. See: https://github.com/denjpeters/SK2Test

denjpeters avatar Jan 19 '24 15:01 denjpeters