Cannot call invalidateAll() on the server

[codewithpatelo]

Describe the bug

I started with a typescript boilerplate app from "@sveltejs/kit": "^1.5.0". I added a +page.server.ts with a load function (server-side). I want it to be rerun. I added an invalidateAll() in my +page.svelte but I always get "Cannot call invalidateAll() on the server".

Reproduction

run npm create svelte@latest my-app
pick skeleton project --> typescript notation
cd my-app
npm install
create a +page.server.ts in .src/routes
add an invalidateAll() function in +page.svelte
npm run dev -- --open

Logs

Error: Cannot call invalidateAll(...) on the server
    at Module.eval (/node_modules/@sveltejs/kit/src/runtime/app/navigation.js:9:9)
    at actualizarDatos (+page.svelte:20:2)
    at +page.svelte:23:1
    at Object.$$render (/node_modules/svelte/internal/index.mjs:1997:22)
    at Object.default (root.svelte:42:40)
    at eval (/src/routes/+layout.svelte:20:69)
    at Object.$$render (/node_modules/svelte/internal/index.mjs:1997:22)
    at root.svelte:41:39
    at $$render (/node_modules/svelte/internal/index.mjs:1997:22)
    at Object.render (/node_modules/svelte/internal/index.mjs:2005:26)
Error: Cannot call invalidateAll(...) on the server
    at Module.eval (/node_modules/@sveltejs/kit/src/runtime/app/navigation.js:9:9)
    at actualizarDatos (+page.svelte:20:2)
    at +page.svelte:23:1
    at Object.$$render (/node_modules/svelte/internal/index.mjs:1997:22)
    at Object.default (root.svelte:42:40)
    at eval (/src/routes/+layout.svelte:20:69)
    at Object.$$render (/node_modules/svelte/internal/index.mjs:1997:22)
    at root.svelte:41:39
    at $$render (/node_modules/svelte/internal/index.mjs:1997:22)
    at Object.render (/node_modules/svelte/internal/index.mjs:2005:26)

System Info

System:
    OS: Linux 5.15 Ubuntu 20.04.5 LTS (Focal Fossa)
    CPU: (8) x64 Intel(R) Core(TM) i5-1035G1 CPU @ 1.00GHz
    Memory: 5.42 GB / 15.29 GB
    Container: Yes
    Shell: 5.0.17 - /bin/bash
  Binaries:
    Node: 16.15.1 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/bin/yarn
    npm: 9.6.1 - /usr/local/bin/npm
  Browsers:
    Brave Browser: 110.1.48.171
    Chrome: 110.0.5481.177
    Firefox: 111.0
  npmPackages:
    @sveltejs/adapter-auto: ^2.0.0 => 2.0.0 
    @sveltejs/kit: ^1.5.0 => 1.15.2 
    svelte: ^3.54.0 => 3.58.0 
    vite: ^4.2.0 => 4.2.1

Severity

blocking all usage of SvelteKit

Additional Information

No response

[codewithpatelo]

I temporarily "fixed" by setting export const ssr = false but I know that this is not recommended.

[Conduitry]

You're getting this because you indeed cannot call invalidateAll() on the server. Invalidating data and making load() functions re-run doesn't make any sense during SSR. It's impossible to tell because you haven't provided a proper reproduction, but presumably your invalidateAll() is located somewhere that it will also be run during SSR. It should be within a DOM event handler, or some other place that will only ever be run on the browser.

[codewithpatelo]

The invalidateAll() function is within the +page.svelte file inside the <script></script> tag.
I use:

setInterval(() => {invalidateAll()}, 60000);
To refresh it each minute. Is that wrong?

[jhwz]

You should put the setInterval invocation in the onMount lifecycle function if you want it to only run on the client side. Otherwise, you can always check the browser variable

[codewithpatelo]

I'll try out that. Thanks.

[codewithpatelo]

So, without const ssr = false, I tried the suggestion but this is the result:

Code:

<script>
...
	function actualizarDatos() {
		invalidateAll();
		convertToLoaded();
	}

	onMount(async () => {
		actualizarDatos();

		setInterval(() => {
			if (chequearHorarioOperatoria(moment().tz("America/New_York"))) {
				// console.log('estamos en horario de operatoria');
				actualizarDatos();
			} else {
				//console.log('no estamos en horario de operatoria');
			}
		}, 60000);
	});
</script>

I started my project from the ts skeleton boilerplate.

[Kapsonfire]

you are missing the clear interval on deinit
also the error is telling you, that hammerjs is accessing window. you are probably importing/using on server runtime

[gtm-nayan]

Presumably your previous error with invalidateAll was masking another error where either you or some library you import is trying to access window on the server side.

Once again, we can't really investigate without a minimal repro.

[codewithpatelo]

Even though I have now this new error where I added some new stuff to the app like a graph, the invalidateAll() error just appeared at the beginning of the project when I just added a +page.server.ts file to the ts svelte skeleton app and call invalidate in the +page.svelte file. I guess if you have SSR set as true you always invalidate within onMount lifecycle (I didn't know that). Now, I did that and turned SSR again but this new issue arose (now the project evolved in something more than just the skeleton app). I can try starting a new skeleton app and try invalidateAll() in an onMount function and check if that works so we can confirm that was the fix to the initial issue.