Google Analytics (GA4) not working in SvelteKit 2

[hesselmid]

Describe the bug

Google Analytics (GA4) should automatically collect pageviews based on browser history events. Pre 2.0 SvelteKit projects do this without a problem. Pageviews are triggered automatically by history.pushState() on route navigation.

In SvelteKit 2 pageviews are no longer triggered on route change, only on a full page refresh.

None of the solutions in "SvelteKit & Google Analytics" tutorials, blogs, videos are working at the moment.

Reproduction

Minimal project with a Google Analytics tracking code in +layout.svelte and 2 routes to navigate between: https://github.com/hesselmid/ga4

Logs

No response

System Info

"@sveltejs/kit": "^2.0.0"

Severity

blocking an upgrade

Additional Information

Understandably a lot of the Svelte community suggest to use another analytics tool like Plausible of Fathom, but a lot of real world clients are dependent on GA because of historic data, an e-commerce tracking setup or an integration with an ad platform.

[matindow]

I don't know if this is directly related, and I haven't yet had time to begin to troubleshoot, but I did have to rollback sveltekit 2 from a site because after making the update a number of analytics pixels were then inconsistently receiving page view events. I assumed it might be in someway related to the changes to throw redirect(), no longer always properly triggering the pushState() for some reason, but as I said I have not yet done any real troubleshooting. Mainly because I'm really not sure where to begin with testing it?

[elliott-with-the-longest-name-on-github]

I assumed it might be in someway related to the changes to throw redirect()

I don't have a solution for you, but I will say this is unlikely -- throw redirect just became redirect, where redirect is just a function throwing the same thing that used to be returned from redirect. So there's really no functional change there.

[matindow]

Thanks, yeah, that totally makes sense to me, didn't expect there to be any change, but also it seems like something isn't working as intended, so i'm just trying to think through what could be related. Very open to suggestions of where to look/how to test.

[teemingc]

Possibly related changes here due to how history.pushState is being intercepted for shallow routing.

Can you provide more information on how to reproduce or how to setup Google Analytics to help with testing this? (for someone like me who has never touched google analytics).

[hesselmid]

Minimal project with a Google Analytics tracking code in +layout.svelte and 2 routes to navigate between: https://github.com/hesselmid/ga4

A window.dataLayer object should fill up with events. But the pageview events are not triggered by history.pushState().

Example of an event (from a pre 2.0 project):

event: "gtm.historyChange-v2"
gtm.historyChangeSource: "pushState"
gtm.newHistoryState: {sveltekit:index: 1704305190852}
gtm.newUrl: "https://www.example.com/contact/"
gtm.newUrlFragment: ""
gtm.oldHistoryState: {sveltekit:index: 1704305190851}
gtm.oldUrl: "https://www.example.com/"
gtm.oldUrlFragment: ""
gtm.triggers: "4"
gtm.uniqueEventId: 10