Note: This entry is applicable to Google Analytics 3 but not GA4. Cantilever has not yet transitioned over to regularly using GA4, so this still applies to most of our sites.
We use Google Analytics (GA) on virtually every site we do. This means we should test to make sure that it is working properly upon launch, and should be testing it continually as new updates go in so that we can be sure there are no regressions.
Most of the time, we implement GA using Google Tag Manager (GTM). GTM is a tag manager, so the site only needs to load GTM, and then GTM in turn loads GA.
Regardless of how GA is loaded, we can test it similarly, using the Google Analytics Debugger for Chrome. However, if it is loaded through GTM, there is an alternate method using only the Google Tag Manager preview pane, which we find a little more intuitive.
Who can do this
Anyone with basic knowledge of the browser.
What you need
- A site to test
- Access to the GA property for the site you are testing.
- Understanding of what custom events need to be tested for, if any.
Google Analytics Debugger method
TL;DR Summary: To test for events you can go to the Realtime > Events tab in GA. Then click on something that should fire off an event and you should see it register in GA.
Install the Google Analytics Debugger and activate it
The extension requires access to view all of your browsing history. Google already has this if you use Chrome regularly, but if you want to be more restrictive, you can install the plugin in a sandbox user account:
If you already have GA Debugger, turn it on via the extension in your browser
Open Google Analytics https://analytics.google.com/ and open up the property you are testing. Note the ID. Navigate to correct "View" for the environment you are testing.
For instance, if you are testing staging, navigate to the "Staging" view.
Navigate to the site and open your developer tools. Click "Console".
You can right-click any part of the page and click "Inspect" to open the dev tools.
Reload the page. You should see the GA debug information logged to the console. Make sure that the GA ID matches the one you see in GA.
This screenshot show the tag firing initially. You can see that it runs
ga("create", [The ID]) to start things off. Make sure that ID is what you expect Then it sets some variables, and triggers a pageview event. Within the pageview event, you can see a few of the variables it sends along with that event, such as a language and version. It also sends data like the screen resolution, so that GA can segment based on that info in the future.
Verify that GA sees you on the page using the "Real-Time" tool.
Try an event. You should see the event logged to the console, with relevant metadata.
Verify that the event you triggered appears in the Real-Time tool.
Try the rest of the events on your list and verify that they are sending the right data to GA.
Google Tag Manager Method
If a site uses GTM, you can use GTM’s preview pane to test GA as well. For more background on the GTM preview pane, see
Go to GTM at https://tagmanager.google.com/ and turn on Preview Mode.
Go to the site and open the preview pane. On "DOM Ready", you should see the GA tag fire.
Click the GA tag to see the metadata it sent when it fired. It should include the correct GA ID.
Fire an event. It should appear within a new "Interaction" pane within the summary.
Using the same steps from the other method, make sure that the event and pageview are appearing in GA itself. Then run through all of your events and test them the same way
A Note on testing GTM
- GTM is a tag manager that runs on all pages.
- When testing, you are often looking for custom tag events. We would pretty much never add a custom event for clicking the logo. Similarly, we should always have them for dropdowns, sliders, mobile nav, etc.