3

We have an extension written in Typescript working on Chrome, Firefox and Edge which we are adding Google Analytics to. We have done this by creating a simple file to load the google analytics:

import { environment } from "../environment";

(function (i, s, o, g, r, a, m) {
    i['GoogleAnalyticsObject'] = r; i[r] = i[r] || function () {
        (i[r].q = i[r].q || []).push(arguments)
    }, i[r].l = 1 * new Date().getTime(); a = s.createElement(o),
        m = s.getElementsByTagName(o)[0]; a.async = 1; a.src = g; m.parentNode.insertBefore(a, m)
})(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');

ga('create', environment.googleAnalyticsTrackingCode, 'auto');
ga('set', 'checkProtocolTask', function () { }); // Removes failing protocol check. @see: http://stackoverflow.com/a/22152353/1958200
ga('require', 'displayfeatures');

We then use webpack to build this and reference the file in the popup.html we have. We have added a reference to the NPM package:

"@types/google.analytics": "^0.0.39"

From the popup js file we are then able to make a call to the ga function like so:

ga('send', 'pageview', url);

We have also modified the manifest to include:

"content_security_policy": "script-src 'self' https://www.google-analytics.com; object-src 'self'"

Everything works without issue in Chrome and we see the page views logged in Google Analaytics but in Firefox and Edge there are no requests to Google Analytics but there are no errors of any kind either, it hits the ga function but nothing happens.

Is there anything else we would have to do in Firefox and Edge to make this work?

The structure of our application is that the content script creates an iframe on the page and loads the popup.html as the src of that iframe. Is there a restriction in Firefox/Edge but not on Chrome that would affect Google Analytics on an extension structured in this way?

Comparing the network requests, Chrome on the left, Firefox on the right:

enter image description here

I have also modified so it logs a page view from the background. Again this is working fine in Chrome but does not work in Edge/Firefox but no errors.

user351711
  • 3,171
  • 5
  • 39
  • 74
  • It looks like I may have to manually post to google analytics as per this example: https://github.com/jvillalobos/AMO-Admin-Assistant/commit/7824abbe294294af486e0899e856d8776934169e. I will try this and update if it works. – user351711 Oct 03 '18 at 08:46
  • This is most probably CORS issue. Can you double check if there are any errors in Dev Tools (Content, Popup)? – WarPro Oct 05 '18 at 06:07
  • There were no errors in the console. I could not find an answer so changed to not reference analytics.js from google and I manually posted the pageviews and events which worked without issue in Chrome, Firefox and Edge. – user351711 Oct 10 '18 at 13:26

0 Answers0