Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Using in Nuxt 3 project. page_view works, but trackEvent doesn't #324

Closed
YosefMets opened this issue Jan 10, 2023 · 5 comments
Closed

Using in Nuxt 3 project. page_view works, but trackEvent doesn't #324

YosefMets opened this issue Jan 10, 2023 · 5 comments

Comments

@YosefMets
Copy link

I'm using @gtm-support/vue-gtm in Nuxt 3 App

Info

Tool Version
Plugin v2.0.0
Vue v3.2.45

vue-gtm.client.js:

import { createGtm } from '@gtm-support/vue-gtm'

export default defineNuxtPlugin((nuxtApp) => {
  nuxtApp.vueApp.use(createGtm({
    id: 'XXX-XXXXXXX',
    defer: false,
    compatibility: false,
    enabled: true,
    debug: true,
    loadScript: true,
    vueRouter: useRouter(),
    trackOnNextTick: false
  }))
})

Then page_view works. Then I try use trackEvent in the setup:

composables/useGTM.js:

import { useGtm as useVueGtm } from '@gtm-support/vue-gtm'

export default () => {
  const gtm = useVueGtm()
  return gtm;
}

myComponent.vue:

const $gtm = useGTM();
$gtm.trackEvent({
  event: 'add_to_cart',
  category: 'ecommerce',
  action: 'click',
  label: 'Adding item to cart',
  value: 5000,
  noninteraction: false,
})

When I'm adding item to cart nothing's happened in the Googlу Analytics. There is also no new request in the "Network". But in the console I see

[GTM-Support]: Dispatching event {event: 'add_to_cart', category: 'ecommerce', action: 'click', label: 'Adding item to cart', value: 5000}

What am I doing wrong?
@Shinigami92
Copy link
Contributor

Please make sure that you are in browser context and you have correctly enabled it

https://github.com/gtm-support/core/blob/9391b2d691dcff0dd75446c4ddbce3b916e60652/src/gtm-support.ts#L222-L238

You can test/debug/log $gtm.enabled() and $gtm.isInBrowserContext() and see if both returns true

The debugging is performed (by design) even if the trigger gets not executed

@YosefMets
Copy link
Author

@Shinigami92,
console.log:

$gtm.enabled(): true
$gtm.isInBrowserContext(): true
[GTM-Support]: Dispatching event {event: 'add_to_cart', category: 'ecommerce', action: 'click', label: 'Adding item to cart', value: 5000}

Looks like everything is ok but still not working

@Shinigami92
Copy link
Contributor

Okay, sadly in that case I don't know what's going on
Feel free to also log what's happening with window.dataLayer, but I'm done with my knowledge

@YosefMets
Copy link
Author

The datalayer gets new records every time the event is called, as expected

@Shinigami92
Copy link
Contributor

Then the issue is not anymore on the plugin's side, but on something with GTM itself
Check your GTM-ID or anything like that, look into the account
Search or ask on Stack Overflow
...

@Shinigami92 Shinigami92 closed this as not planned Won't fix, can't repro, duplicate, stale Jan 10, 2023
@Saurou Saurou mentioned this issue Mar 15, 2023
Open
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@Shinigami92 @YosefMets