ijkml/nuxt-umami

`page:finish` hook won't be triggered

Closed this issue · 8 comments

sxzz commented

If ssr option is disabled, then page:finish hook won't be triggered.

'page:finish': function () {
const { autoTrack } = umConfig.value;
if (!autoTrack)
return;
setTimeout(umTrackView, 300);

Oh, boy... I'll look into this, thanks @sxzz.

Hello again, @sxzz.
I finally had a chance but I couldn't reproduce it. The hook seems to trigger with ssr: false 🤷.
Anyway, could you take a look at this repro and let me know if I missed something?
https://stackblitz.com/edit/nuxt-umami?file=nuxt.config.ts

Thanks, again.

sxzz commented

Seems not relate to SSR, but relate to Suspense

Minimal reproduction repo: https://github.com/sxzz/nuxt-page-finish

Yeah, you're right. It is related to Suspense.
But, the hook triggers when you add <NuxtPage />.
Repo: https://github.com/ijkml/nuxt-page-finish

Will look into how much of an effect this has 'cause the code is for autoTrack (useful when you have pages).

'page:finish': function () {
const { autoTrack } = umConfig.value;
if (!autoTrack)
return;
setTimeout(umTrackView, 300);

How did you find the bug, please?

sxzz commented

I have an SPA project that doesn't automatically track pages. To fix this, I manually added another plugin using app:mounted hook.

https://github.com/sxzz/ast-explorer/blob/main/plugins/umami.ts

Absolutely right, it is a <NuxtPage> / Suspense thing.

I'm stuck. Do you have any suggestions on a fix for this?

Also, instead of a plugin, onMounted(() => umTrackView()) in app.vue might work, no?

sxzz commented

Of course, it works. Can we use hook app:mounted (with 300ms delay), instead of page:finish?

Unfortunately, no.
app:mounted is only triggered once (https://nuxt.com/docs/api/advanced/hooks#app-hooks-runtime).

Mean time, I would add this behavior to faqs/quirks 👍.