Google Analytics Tester Bookmarklet

Grab the Google Analytics Bookmarklet!

To use the bookmarklet, simply drag the following link to your toolbar, then click on the bookmark whenever you want to test a page! – Drag this link: Google Analytics Tool

---

Warning: This tool is in beta! Released 3/6/2016. Page will be revised if updates are made.

---

What does this tool do?

I created this bookmarklet primarily for my own uses, but seeing as there is nothing out there like it, I felt it was worth sharing. Here is what this Google Analytics checker and event testing bookmarklet does:

• Google Analytics Code Checker: Checks for ALL Google Analytics tracking codes that are on a page (regardless of what version of GA they are using – e.g. newer analytics.js vs older ga.js)
• Google Analytics Accound ID Report Generator: Spits out a report of all the google analytics account IDs that are found on the page, and what type of analytics library they are using.
• Google Analytics Event Tester: Verify that your Google Analytics is receiving data by clicking a button and triggering an event to be recorded. My bookmarklet will send the event to all the analytics accounts that are properly tracking the page.
• Retest the page after DOM has changed: You can temporarily close the floating bookmarklet overlay panel by pressing on the x, manipulate the page and trigger changes, then reopen by clicking on the eye icon in the upper left, and continue to re-test Google Analytics or trigger more events!

This tool does NOT inject any external script sources into the page. Although doing so would allow me to update the bookmarklet without requiring it be removed and re-added to users’ browsers, it also would mean that the bookmarklet wouldn’t work on sites that use the newer Content Security Policy (CSP), which I wanted to avoid as CSP gains momentum. The downside means that you might want to check this page every once in a while if you care about if the tool gets updated. This bookmarklet is composed of a few major components:

• Code that detects GA scripts and what type they are – this is trivial to do, and you can do so simply by regex testing against all scripts and their sources on the page (see here)
• Code that handles creating events for both versions of the Google Analytics JS library and sending them to ALL attached accounts – this took me a while to make, and ended up being a project on its own. I’ll post about it soon and the reusable JS you can use to easily trigger Google Analytics events on button clicks, hovers, and other event listeners.
• An injected UI widget – this is the floating div that appears on the page when you use the bookmarklet. I am severely graphically untalented, so CSS continues to be a struggle for me. I think I did alright with this though.