Skip to content

Add Link Option data-sveltekit-invalidate #10274

@lemmon

Description

@lemmon

Describe the problem

My client noted that when clicking the same link (user is already on) they expect the page data to reload. I must agree that in certain cases it makes sense. SvelteKit currently does nothing when user is clicking the same link over and over.

Describe the proposed solution

I propose to add data-sveltekit-invalidate link option. When user is navigating on some other page nothign will change from current system. Howerver when user clicks on the same link again and the data-sveltekit-invalidate option is present SvelteKit triggers the page load() function again and SvelteKit treats this action as if user is navigating to another page.

Alternatives considered

I have tried adding on:click event to links:

function handleClick() {
  if (this.href === $page.url.href) {
    invalidate('page:data')
  }
}

This almost works, however the load function runs twice. I asume that one runs for the invalidate event and the other runs for the navigation event.

Another try:

function handleClick() {
  if (this.href === $page.url.href) {
    goto(this.href, {
      replaceState: true,
      invalidateAll: true,
    })
  }
}

This almost works too however invalidating all the resources is not the desired outcome.

Importance

would make my life easier

Additional Information

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    needs-decisionNot sure if we want to do this yet, also design work needed

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions