Umami breaks client side navigation when paired with anchors. Forces full page reload.

[HighPriest]

Describe the Bug

I have bothered friends on sveltekit side, about broken client side navigation. But, as it turns out, the culprit has been Umami all this time.

If you open the comment on sveltekit project, you are going to find two links to the same website. One is accessed through a domain name & proxy. Another one is accessed directly, through an IP.

When Umami script gets loaded, send messages do not appear on the site accessed through IP, because of data-domains.
But, on website accessed through domain. Where Umami is active & when data-umami-event is attached to an anchor. After click on the anchor & the send completing, instead of normal client side navigation through svelte, entire page is reloaded.

I have mentioned in there, that adding on:click|preventDefault={() => goto(${address}) fixes the client side navigation. But what it really does, is just allow for client side navigation to be handled first (or asynchronously?), then Umami kicks in & triggers whole page reload (which I didn't notice, because all the stuff is already loaded for the next page, so triggered reload is very fast).

Maybe relevant issues: #3144 #2949 #2637

Database

PostgreSQL

Relevant log output

Which Umami version are you using? (if relevant)

2.16

Which browser are you using? (if relevant)

Latest Chromium

How are you deploying your application? (if relevant)

Node server on VPS

[mikecao]

What Umami does is intercept requests to any links with data-umami-event, send a request to collect the data, then sets location.href to the original href to do the navigation. The issue is likely the use of location.href as it doesn't use the framework's mechanism for navigation without reloads. This happens in Next.js as well when you don't use the Link component.

We probably need to come up with a hook to allow complete the navigation without using location.href. Open to any ideas.