@analytics/google-analytics: Not being able to track custom dimension

[TobiasKrogh]

Hi,

I really like the library. But I have a weird issue I am not able to solve and also looking through the docs and checking the code did not help. I am trying to add a custom dimension in Google Analytics' browser for a page.

Analytics({
  app: 'my-app',
  plugins: [
    googleAnalytics({
      trackingId: 'my-tracking-id',
      anonymizeIp: true,
      customDimensions: {
        userState: 'dimension1',
      },
    }),
  ],
}),

later I call the following

// i tried
this.analytics.page({}, { userState: true });
// also
this.analytics.page({}, { customDimensions: { userState:  true } });

but looking at the code it seems that custom dimensions are tried to be found in PageData instead of the passed options. This of course does not work because PageData types do only allow certain keys

[DavidWells]

Try to set setCustomDimensionsToPage to false

Analytics({
  app: 'my-app',
  plugins: [
    googleAnalytics({
      trackingId: 'my-tracking-id',
      anonymizeIp: true,
      setCustomDimensionsToPage: false,
      customDimensions: {
        userState: 'dimension1',
      },
    }),
  ],
}),

https://github.com/DavidWells/analytics/blob/master/packages/analytics-plugin-google-analytics/src/browser.js#L178

This might resolve the issue? 😃

[TobiasKrogh]

@DavidWells thanks for the quick response but unfortunately I still do not see the custom dimension mapped from userState as part of the request... I added setCustomDimensionsToPage: false, to the plugin options

Also this is confusing for me: the option name is setCustomDimensionsToPage and setting it to false allows me to use custom dimensions on .page()?

So when using false and putting a break point into the code I see this method formatObjectIntoDimensions not being executed at all, which kinda makes sense considering the naming of the option and my previous question.

When using true and checking a break point I can see the code reaches the function formatObjectIntoDimensions and runs into the following block:

  return Object.keys(customDimensions).reduce(function (acc, key) {
    var dimensionKey = customDimensions[key];
    var value = get(properties, key) || properties[key];

All keys from customDimensions (containing { userState: 'dimension1' }) are iterated over. So the key that is passed into the accumulator function is userState. The line var value = get(properties, key) || properties[key]; tries to read the dimension from properties. But properties contains the following hash

{
  hash: ""
  height: 322
  path: "/path"
  referrer: "http://localhost:4200/url"
  search: ""
  title: "Page title"
  url: "http://localhost:4200/path"
  width: 1440
}

So it seems to me that instead of properties (containing the PageData) it should be the options that are used here (the second option that can be passed to the .page() call.

What do you think?

[Bug-Reaper]

@TobiasKrogh

If you're running this inside of a node process, the current version of the @analytics/google-analytics plugin is not currently capable to report custom dimensions. See this related issue: https://github.com/DavidWells/analytics/issues/86

I have a fork that aims to implement custom dimension reporting for the node.js flavor of the @analytics/google-analytics plugin. It is currently awaiting PR but you can try using the fork I've made publicly available by including the following in your package.json. "@analytics/google-analytics": "github:Bug-Reaper/analytics-plugin-google-analytics-fork"

If you're not running the library from within a node process, it is also worth making sure the custom dimension is checked as active from the http://analytics.google.com portal. Google analytics will not record data for custom dimensions which aren't marked as active.

[TobiasKrogh]

@Bug-Reaper

I am running this in the browser

If you're not running the library from within a node process, it is also worth making sure the custom dimension is checked as active from the http://analytics.google.com portal. Google analytics will not record data for custom dimensions which aren't marked as active.

That is indeed interesting and I did not know that. Still it seems that this point is not reached at all. In my previous comment I stated that formatObjectIntoDimensions tries to get the value of a custom dimension from properties which - again - refers to the PageData - so the first parameter of .page().

So no matter whether it is checked as active - the information will not be sent to the server or even formatted properly.