CODEWITHSUNDEEP
next.jsgoogle-tag-managergoogle-analytics-4react-gtm-module
good1492
good1492

Reputation: 251

GTM firing same event multiple times

I have a NextJS app that uses GTM to pass event to GA4.

I load GTM using the package react-gtm-module and initialize it as follows:

TagManager.initialize({
        gtmId: process.env.NEXT_PUBLIC_GOOGLE_TAG_MANAGER,
        dataLayer: {
          user_id: user_id,
        }
})

I created a custom event 'view_faq' that has two variables (category and description). I trigger the event by invoke a function on a button click that pushes to the data layer. The custom event trigger fires on all events having the name 'view_faq'.

const handleClick = (index) => {
    window.dataLayer.push({
      event: 'view_faq',
      category: 'faq',
      description: 'This is a FAQ item',
    })
}

When I do this, I see the event fire in Tag Assistant (debug mode) and I see the event appear along with the correct variables in GA4 Debug view.

The problem I'm having is that the event fires about 10 additional times in succession. So I see it 10 extra times in Tag Assistant and also GA4. None of my non-custom events are doing this (e.g., page views, button clicks).

Looking at each fired event and corresponding API call, it seems only what is passed to the data layer is changing with a parameter engagement_time_metrics...

The first API call is...

dataLayer.push({
  event: "view_faq",
  category: "faq",
  description: "This is a FAQ item",
  gtm.uniqueEventId: 11
})

The subsequent 10 API calls are as follows with the exception that only the field 'engagement_time_msec' changes on each one.

dataLayer.push({
  event: "view_faq",
  eventModel: {
    category: "faq",
    description: "This is a FAQ item",
    user_id: "...",
    engagement_time_msec: 3572,   // <=== this is changing in each of the 10 calls...
    client_id: "...",
    session_id: "...",
    session_number: 19,
    session_engaged: 0,
    page_location: "http://localhost/landing?gtm_debug=...",
    page_referrer: "https://tagassistant.google.com/",
    page_title: "My page",
    language: "en-us",
    screen_resolution: "2560x1440",
    _user_agent_architecture: "arm",
    _user_agent_bitness: "64",
    _user_agent_full_version_list: "...",
    _user_agent_mobile: "0",
    _user_agent_model: "",
    _user_agent_platform: "macOS",
    _user_agent_platform_version: "12.6.0",
    _user_agent_wow64: "0"
  },
  gtm.uniqueEventId: 11,
  gtm.priorityId: 4
})

Anyone knows what is causing this?

Upvotes: 2

Views: 4234

Answers (3)

Jon
Jon

Reputation: 21

Also had this problem. The issue was that in GA4 we had created a custom event that would fire when it matched the event from code. This custom event had the exact same name as the code event, so it would also fire whenever it matched itself. This created an 'infinite' loop of the custom event firing about 10 times.

To replicate this issue do the following:

  1. Create a trigger in GTM with 'my_test_event' as the event name.
  2. Create a Custom Event in GA4 with the name 'my_test_event', and have it trigger when the event name matches 'my_test_event'.
  3. Write some code to push the custom event onto the dataLayer: 
    window.dataLayer.push({
    event: 'my_test_event',
})

Debug in GTM and you will see multiple events fire for this same event as GA4 pushes its custom event 'my_test_event' onto the data layer and then GTM processes it and fires the same tag. The GA4 event has additional data, which is why the second and subsequent events have more information.

Code Event -> GTM -> GA4 -> GTM ->GA4 -> GTM -> GA4 (repeat 10x)

Bottom line: To avoid this issue don't create a custom event in GA4 that triggers when the event name matches itself.

Upvotes: 2

Donatas Tubutis
Donatas Tubutis

Reputation: 21

Experienced the same issue and discovered that it was due to unnecessarily creating a custom event in the GA4 config (one that "creates new events from existing events").

Upvotes: 2

good1492
good1492

Reputation: 251

After some tinkering around, this was solved by creating new tags and triggers and giving the event a new name. In Tag Manager, the old and new have the same settings (just a different event name), but the new one works as expected.

Upvotes: 0

Related Questions