googleanalytics / autotrack Goto Github PK

When using autotrack.js 0.6.5, Safari-Mac (not iOS) opens all external links in a new tab - other browsers behave correctly. Since i'm not a developer, I do only note that issue here.

Is this library stable enough to be used on a large-ish publishing site in production? Would be useful to test it - but I don't want to have any potential issues with causing errors in our tracking. We currently use Tag manager for most interactions

This is basically a steal from an old script I used in the past that isn't compatible with universal tracking

https://github.com/CardinalPath/gas

It would let you know how many people started to play the video and how many people finished it, paused, stopped etc.

Some other handy things in that script too.

We've tried deploying this script a few times to our site and have seen the GA real-time tab numbers drop to around 10% of their numbers. As soon as we remove the script, the numbers jump back up.

Is there a setting to get this script to behave correctly with real-time analytics reporting?

Add auto "tel:" and "mailto:" event tracking for...

<span id="telephoneNumber1" itemprop="telephone">
<a href="tel:+44123400000">+44 (0)1234 00000</a>
</span>

Thanks

Phil

Copied from here:
https://plus.google.com/+JimGianoglio/posts/DKvR95C8MWJ

I have reviewed your code because of https://www.drupal.org/node/2671716 and found some issues with the code.

You also need to bind to AREA.

this.delegate = delegate(document, 'a',
      'click', this.handleLinkClicks.bind(this));

Aside binding to all A tags like today will cause:

• Massive page rendering slowdown with many links

In the enhanced ecommerce documentation is shows sending the page view after sending the data however when using autotrack the pageview is always sent first. I could always send a pageview after my data but I'm assuming that would create a duplicate pageview hit in the stats.

I just successfully added autotrack to my site (thanks to the help in #68!) but it doesn't seem like the page source gets recorded. I'm not 100% sure yet as I'm only able to see the realtime data, but I assume it's not. This small piece of information would be more or less crucial.

In outbound-link-tracker.js there's the following code:

this.tracker.send('event', 'Outbound Link', 'click', link.href, { transport: 'beacon' });

What I'm looking for is to change it to something like this:

this.tracker.send('event', 'Outbound Link', location.href, link.href, { transport: 'beacon' });

Is this possible somehow?

First of all, thanks for the great library. I like how easy is to implement it with Browserify.

I'd like to ask how exactly urlChangeTracker works - we'd like to use it for tracking overlays as additional pageviews, eg. /team/#name. So in the overlay code we are using History API and have something like:

history.pushState({type: "overlay", url: id}, document.title, url + "#" + id);

But it doesn't seem to generate additional pageviews. Is the problem that only hash portion of the URL changes as mentioned in documentation? I guess so just wanted be sure before messing with URL rewriting.

Thanks

This is more of a feature/suggestion than a bug.

I understand why browsers that don't support beacons currently open links in a new tab but I think it would be good to include some additional alternative methods for those who dislike the current behaviour.

For example:

• No link behaviour modification, no delay.
  If a browser doesn't support beacons, just don't track the outbound click events.
• No link behaviour modification, with a minimal delay.
  Use the hitCallback method outlined in this support article combined with a timeout of say 500ms (could be a user configurable value) that opens the link after 500ms even if the analytics event hasn't completed transmitting.

While these alternative methods might miss some data capture, I feel they're preferable alternatives to forcing links to open in a new tab.

Does your script work with Turbolinks ?

I found no mention of this on the readme. I know I had to adapt the original GA script to work with turbolinks 5, otherwise the tracking wouldn't take place during ajax-turbolinks navigation.

I have reviewed your code because of https://www.drupal.org/node/2671716 and found some issues with the code.

This open _blank causes serious malfunctions.

if (!navigator.sendBeacon) {
      link.target = '_blank';
    }

The following issues and amyn other will arise:

• https://www.drupal.org/node/1057914

This library is great but there is no option to track clicks on links allowing to download files like PDF

I tried to track both left and right click events on an A link with

ga-on="mouseup"

using

`ga('require', 'eventTracker', {events: ['click', 'mouseup']});

but only left-click events are visible in the Real Time view. Am I missing something? It looks like it should work, but apparently it doesn't.

It would be nice to be able to filter URLs, for example to strip out IDs from a URL. Maybe this would be part of the cleanUrlTracker?

For me, I'd be using a filter like this:

function (url) {
  url.replace(/\/\d+/g, '/_id_');
}

I have reviewed your code because of https://www.drupal.org/node/2671716 and like to ask how you would solve Touchstart event logging non-existent clicks.

I have a document listener bound to "mousedown keyup touchstart" as you can see in http://cgit.drupalcode.org/google_analytics/tree/js/google_analytics.js to overcome the other serious bugs autotrack currently has like:

• #62
• #63

Monitoring the mouse movement looks also a problem as I found on the net. Any other ideas?

Pls Change the default from...
ga('require', 'autotrack', {'attributePrefix': 'data-tracking-event-'});
ga('require', 'autotrack', {'attributePrefix': 'data-event-'});
https://github.com/googleanalytics/autotrack#passing-configuration-options

User-case: This makes it obvious to developers that this is used for tracking, and reduces the chance of conflicts.

Thanks

Phil

Copied from here:
https://plus.google.com/+JimGianoglio/posts/DKvR95C8MWJ

Hi,

on one of my websites it´s working perfectly. But on deine-angelwelt.de are some issues.

When I insert this:

ga('create', 'UA-???????-1', 'auto');
ga('require', 'autotrack');
ga('send', 'pageview');

Its counting nothing - also no visitors. When I change this:

ga('create', 'UA-???????-1', 'auto');
ga('send', 'pageview');
ga('require', 'autotrack');

It´s counting only the visitors, but no clicks.

Maybe there are some security plugins, which stop the .js?!

Best,
Paul

Add missing "data-event-noninteractive"
https://github.com/googleanalytics/autotrack/blob/master/lib/plugins/event-tracker.js

Add missing "data-event-social-path"
https://github.com/googleanalytics/autotrack/blob/master/lib/plugins/social-tracker.js

Thanks

Phil.

Copied from here:
https://plus.google.com/+JimGianoglio/posts/DKvR95C8MWJ

I am not sure if this is the right place to ask.
Currently I am using eventTracker to track the links on a div container, So I have setup data attributes on the div container and want to track the link clicks.

Can i have the Event Label value as the value of href,

This way, I can track the module category and which link was clicked?

I'm interested in including autotrack in my project using Bower, but I don't see it listed in the bower registry.

Is there a reason why its not registered as a bower package?

As per the following excerpt from the docs:

Note, this plugin does not support tracking hash changes as most Google Analytics implementations do not capture the hash portion of the URL when tracking pageviews.

Does it mean that it will not track virtual page changes in an angularjs app?

In /test/utilities.js(Line 71-85), I think the spell is a

__stopLinkClicks__

instead of

__stopClinkClicks__

I installed Autotrack, now I can see session duration, outbound links reports clearly.

But where can I check the "socialTracker" report? I read the usage guide time after time, and can't find this report in my GA's profile.

Hi,
after I include autotrack.js in my project, I get the following error :

Uncaught ReferenceError: require is not defined (autotrack.js line 19)

any help appreciated !
thanks

@nebosuker and @stevezhuang, please update your forks at your convenience with the new documentation changes for the 1.0 release.

Also, please update the settings in your forks to allow for issues to be reported, so users can file issues with your forks rather than this repo. These instructions will show you how:
http://programmers.stackexchange.com/questions/179468/forking-a-repo-on-github-but-allowing-new-issues-on-the-fork

Thanks, and let me know if you have any questions.

I found that this event from the session duration tracker fired hundreds of times (with a huge value that I don't understand) and I found it a little bit unnecessary since it only provides me with a number and doesn't give me an event label or any other data that I could use in analyzing my visitor actions.

I don't really understand too much about how the plugin works, but can I comment out this send event code and not effect the rest of the plugin?

Thanks for your help!

Please support viewport for impressions as well.

If a developer loads the autotrack.js script on the page before defining the global ga object in the tracking snippet (or before the analytics.js script defines it), none of the plugins will load. This happens because the providePlugin method first checks to see if the global ga function exists before calling ga('provide', ...) to avoid errors.

One possible solution is to run the command queue initialization code in the providePlugin method. This will solve the problem in the vast majority of cases, with the exception of the case where the developer wants to rename the global ga object to something else.

The other option is to console.error if the developer tries to load an autotrack plugins before defining the global ga object. The only downside to this approach is users who don't have their developer tools open may not realize an error occurred.

Sorry it's so peculiar that can't help to wonder why the heck this is happening, and only with your repo, any other project around is just fine.

Is this just an issue with me because I'm speshul or what?

I'm basing this on when I view the real time stats the active page url doesn't change.

I have a Marionette app compiled using browserify so I've tried require('autotrack') and a direct link to the autotrack.js file

Here my tracking code snippet.

<script>
    window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
    ga('create', 'UA-XXXXX-Y', 'auto');
    ga('require', 'autotrack');
    ga('require', 'ec');
    ga('send', 'pageview');
  </script>
  <script async src='https://www.google-analytics.com/analytics.js'></script>

I feel like I'm missing something obvious here, but there's no tracking of internal form submissions, only forms that submit to other websites?

I've used the options to track internal forms by removing the domain check

shouldTrackOutboundForm: function(form) {
var action = form.getAttribute('action');
// Checks that the action is set and starts with "http" to exclude relative
// paths, then checks that it does not contain the string "example.com".
return action &&
    action.indexOf('http') === 0 ;
   // && action.indexOf('example.com') < 0; //we wnat to track internal forma as well
  }

Is this something that should happen by default?

I would have thought that adding events to internal forms would be one of the most important things to track.

https://github.com/googleanalytics/autotrack/blob/master/lib/plugins/outbound-form-tracker.js#L83-L88

In this method when getting the action attribute, for Chrome if it doesn't exist getAttribute("action") returns empty string, so "".indexOf("http") works perfectly, but in IE and FF the same returns null, what happens is something like this null.indexOf("some string") , so the error is "action is null" in FF .... and similar in IE. What I did to fix this in the project that I work on is to add an empty attribute in the form, e.g. action="". The simplest fix that could be done is: when declaring action variable and assigning it the value of the action attribute to put some condition ... if no action then empty string for example:

var action = form.getAttribute('action') || "";

Set enable ga('require','autotrack'); on all new GA installations in the UI (unless gtm.js found on homepage).

I can see that GA is trying to fix the problem of incorrect AvgSesisonDurations & BounceRates at scale for website that do not use GTM. I have seen both snowplow and YandexMetric introduce simular features (both vendors appears to have this enable by default on "new" implementations in the installation interface).

1. enableActivityTracking (aka "Page pings")
   http://snowplowanalytics.com/documentation/recipes/catalog-analytics/measuring-and-comparing-content-page-performance.html#page_pings
   https://github.com/snowplow/snowplow/wiki/2-Specific-event-tracking-with-the-Javascript-tracker#enableActivityTracking
2. accurateTrackBounce
   https://yandex.com/support/metrica/code/counter-initialize.xml

Thanks

Phil.

Copied from here:
https://plus.google.com/+JimGianoglio/posts/DKvR95C8MWJ

Hello,

In terms of implementation, assuming you use all the 9 plugins, that'd be 9 additional http requests. Is there a way to reduce this and have 1-2 consolidated JS files (analytics.js + all_plugin.js)

Thanks

Let's say I have the following URL structure:

www.example.com/goto/site1
www.example.com/goto/site2
www.example.com/goto/site3

Is there a way to setup autotrack to track all these links, for example by matching www.example.com/goto/* ?

A workaround would of course be to setup a subdomain so that the links would look like:

ext.example.com/goto/site1
ext.example.com/goto/site2
ext.example.com/goto/site3

This way, if I'm understanding the documentation correctly, the links should be autotracked. But I'd rather not complicate things like this if there's an easier way.

This may be a silly question, but is there a way to use this in Tag Manager with the Page View tag?

Hi!

I have such simple case:

1. I init EventTracker as usual
2. Later on, I update DOM, ie. I add some new links with data-event-* attributes.

How do I make sure EventTracker binds to click event on these newly inserted links and handle click events properly?

Is there a way to add custom metric/dimension data to events being sent through the event-tracker.js plugin?

The sessionDurationTracker plugin partially solves this problem by sending an event hit to Google Analytics (in browsers that support navigator.sendBeacon) when the document is being unloaded. The event category is "Window" and the action is "unload".

Unload does not fire in many cases, see: https://www.igvita.com/2015/11/20/dont-lose-user-and-app-state-use-page-visibility/ - you should listen for visibilitychange instead.

I have reviewed your code because of https://www.drupal.org/node/2671716 and found some issues with the code.

That is not the way how oubound need to work.

OutboundLinkTracker.prototype.shouldTrackOutboundLink = function(link) {
  return link.hostname != location.hostname &&
      link.protocol.indexOf('http') === 0;
};

There is cross domain suppoet in GA and also subdomain support. That means you need to support *,example.com and also a list/array of cross domain hostnames. Outbound is than only if you leave the site and not because you switch from "example.de" to "example.es". In this case you stay on the same site, you only switch the language of the site (cross domain support).

If you switch from www.example.com to shop.example.com you also do not leave the site.

I've been doing some work on a single-page javascript application that calls history.replaceState with only two arguments - the optional URL is unspecified. I've been integrating GA to track visits and some internal events. Since some of our events update the URL to reflect a change in state, I figured it would be nice not to have to manually handle those occasions, and tried using the urlChangeTracker plugin to capture those events for me. Works great in Chrome. But I hit a snag in IE11.

The problem seems to be thanks to

1. Visit some website, for example, http://github.com/
2. In the dev console, run var t;
3. Now run history.replaceState({}, '', t)
4. In Chrome, the location doesn't change. In IE11, it changes to http://github.com/undefined

In any case, this is of course throwing off my stats tracking. I'm going to get around this in my project my manually tracking the extra events. I imagine others who want a proper workaround for this could override history.replaceState themselves prior to running the plugin, using a function that explicitly checks if that third variable is undefined, and if it is, directly calls the original history.replaceState with only two arguments instead (which does still work as expected in IE11).

I raise this here to ask if it's worth making such a change in the plugin directly. It might prevent other users having issues like mine in the future.

<form action="/subscribe.php" data-form-category="Forms" data-form-action="Submit" data-form-label="Newsletter Subscribe">

Anyone? :)

I added autotrack.js to a site that uses ASP.net, which generates links that use "javascript:" in the href attribute:

<a id="foo_bar" href="javascript:__doPostBack('foo$bar','')">Linked Item</a>

When clicked, those links attempt to open "javascript:__doPostBack('foo$bar','')" as a URL (whi, and don't execute the javascript.

This only happened to us in IE 11. It worked fine in the latest Chrome and Firefox.

Sorry if I'm not reporting this correctly or well... I'm new to Github (, and I don't totally understand why this is happening, I can only confirm that it is happening. I'm just reporting this in case the script can be edited in some way to account for this edge problem.

Add optional "event-id, event-entity-type, event-action-type"
data-event-id="12345"
data-event-entity-type="component"
data-event-action-type="click"
https://github.com/googleanalytics/autotrack#using-individual-plugins

User-case: event-id is needed for auto-QA testing, and event-action-type=onclick | onload is needed for determining nonInteractive value.

Thanks

Phil.

Copied from here:
https://plus.google.com/+JimGianoglio/posts/DKvR95C8MWJ

In docs there already are some official plugins for GA. Will autotrack be added there? If yes, will it also be available as an option within GTMs GA tag config screen?

Hello!

Little question regarding autotrack, is it or will it be supporting GTM?

Please polymer element for Polymer Starter Kit...

https://github.com/PolymerElements/polymer-starter-kit

Hello,
I am very excited to use your script. I installed the complete files, although I am currently only using the outboundLinkTacker. Where can I set the fieldsObject to true nonInteraction:true?
I do not want those single page users added to the bounce rate.

Below are GA's code examples:

ga('send','event', [eventCategory],[eventAction],[eventLabel],[eventValue],[fieldsObject]);

ga('send', 'event', 'Videos', 'play', 'Fall Campaign', { nonInteraction: true });

Just for reference here is my outbound link example:
<a href="" target="_blank" data-event-category="Appointment" data-event-action="Schedule" data-event-label="Clicked" data-event-value="500" class="">Schedule Appointment Online</a>