Invalidate + Goto triggers load() twice with custom identifier

[camboui]

Describe the bug

Hi,

It seems that using a goto() + invalidate() triggers twice an invalidate method which calls twice the load() method from +page.server. This happens only when using custom identifiers as stated by official documentation : https://kit.svelte.dev/docs/modules#$app-navigation-invalidate

If the argument is given as a string or URL, it must resolve to the same URL that was passed to fetch or depends (including query parameters). To create a custom identifier, use a string beginning with [a-z]+: (e.g. custom:state) — this is a valid URL.

GIVEN load() depending on (foo:bar) WHEN goto + invalidate(foo:bar) THEN load method called twice (KO)
GIVEN load() depending on (foo-bar) WHEN goto + invalidate(foo-bar) THEN load method called once (OK)

If I just misunderstood this documentation, please let me know :)
Maybe invalidate + goto should be used together ? But goto doesn't seem to invalidate at every searchParams change (when modyfing existing searchParam value)
Thanks for your work !

Reproduction

Minimal reproduction:

https://stackblitz.com/edit/stackblitz-starters-axljya?file=src%2Froutes%2F%2Bpage.svelte

+page.js

  import { goto, invalidate } from "$app/navigation";

  /** @type {import('./$types').PageData} */  
  export let data;

  async function onBtnClickKO () {
    await goto(`?page=${data.page +1 ?? 0}`);
    await invalidate('search:something');
  };

    async function onBtnClickOK () {
    await goto(`?page=${data.page +1 ?? 0}`);
    await invalidate('search-something');
  };
</script> 

<h1>Welcome to SvelteKit</h1>
<p>Visit <a href="https://kit.svelte.dev">kit.svelte.dev</a> to read the documentation</p>

<button type="button" on:click={onBtnClickKO}>Invalidate KO</button>
<button type="button" on:click={onBtnClickOK}>Invalidate OK</button>

+page.server.js

	const searchParams = new URL(url).searchParams;

	const page = +(searchParams.get('page') ?? 0);

	depends('search:something');
	depends('search-something');
	console.log('LOAD, THIS LOG SHOULD BE DISPLAYED ONLY ONCE PER REFRESH');

	return {
		page,
		results: [{ a: '1', b: '2' }]
	};
};

Logs

No response

System Info

"@sveltejs/kit": "1.22.1",

Severity

annoyance

Additional Information

No response

[realvasko]

We just discovered the same issue in our application. Whenever we have the following code:

someAPI.updateEntity(entity)
  .then(async () => {
    await invalidate("app:someEntity")
    await goto("/url/of/entity")
  })

we end up with the respective load function being called twice:

To add to the fun, if we have something like this:

someAPI.updateEntity(entity)
  .then(async (res) => {
    await invalidate("app:someEntity")
    await invalidate("app:listOfEntities")
    await goto("/url/of/entity")
  })

we end up with the load function that has depends("app:someEntity") being triggered 3 times (the depends("app:listOfEntities" load function is in the +page.ts of a parent route).

We tried that both with using URL or custom identifier, the results are the same.

I'd argue that the severity is more than "annoyance", as this slows down the page, as we have to wait for 2 or 3 repeated GET requests to finish. Also it puts unnecessary pressure on the API server, as it has to serve a lot of pointless GET requests.

[gterras]

I'd argue that the severity is more than "annoyance"

Indeed in our case we have frequently invalidated load functions triggering large computations and this bug causes us trouble, is it expected to be fixed at some point ?

Edit : seems like SvelteKit2 solved the issue

[ShriPunta]

Great to know I am not going crazy! I was flumoxxed about this issue! #11663
Needs a fix ASAP

[realvasko]

I can also confirm that upgrading to SvelteKit v2.0 solved the problem for us.

[gterras]

I can also confirm that upgrading to SvelteKit v2.0 solved the problem for us.

Careful there are chances you went from a major annoyance bug to an app breaking bug, see #11268 (comment), it's not obvious to see at first.

[dummdidumm]

The original issue is about await goto(..); await invalidate(..), which calls load twice which is expected behavior: In the linked reproduction, the goto makes load rerun because of the changed search parameter and the invalidate afterwards makes it run again because the dependency it has declared with depends is invalidated.

The issue some others in this thread have about await invalidate(..); await goto(..) calling it twice was a bug that has been fixed by #11268