QA'ing Through GTM

Subscribe to our monthly newsletter to get the latest updates in your inbox

One of the most foundational aspects of a well-built analytics system is ensuring your tracking is doing what you intend it to. Without knowing how to approach QA, it often comes down to a cross-our-fingers-and-hope-we-see-data method. Fortunately, learning how to do rigorous QA will be explained in this article. Hopefully you’ll be able to come out on the other side feeling significantly more comfortable jumping in and self-reviewing your analytics additions. If this blog were to cover all of the different QA scenarios you may find yourself in, we’d crash the site. For the purposes of this exercise, I’m going to list out some assumptions about our testing scenario:
  • There is a Google Analytics baseline installation already in place, and you’d like to add tagging for a new interaction
  • You’ve added this tag through Google Tag Manager
  • Chrome is installedand is the browser you’ll be testing with
  • You have a user story or conditions for a pass which will inform QA
  • dataLayer Inspector + & Tag Assistant are installed
There is also information specific to the tag which you’ll be testing which should ideally be available at time of QA:
  • GTM Container ID that the tag is installed in
  • A helpful image or screenshot if you’re QA’ing someone else’s work
  • URL of where the tag can be tested. Is it in staging, or is this feature on production?
  • Google Analytics UA (property) ID to ensure data makes it into your reporting platform
  • Expected configuration of tag: Category, Action & Label for Event tags, and any necessary custom configuration notes.
  Example Project Management System Ticket:     Example Installation Specification Slide:     Onto the fun part! QA’ing is easiest when you have two large screens in front of you, and are using the Mac app, Spectacle.  

Getting Started

  1. Make sure your event is set up in Google Tag Manager, in the workspace that you’re going to be previewing from.
  2. Click the “Preview” button in the top righthand corner of GTM.
   
  1. The GTM workspace you’re now previewing should have this banner across the top
   
  1. Navigate to the site this container is installed on. In our Example Ticket above, it was listed that I would be QA’ing analyticspros.com.
  2. I should see the GTM preview pane pop up in the bottom half of my webpage.
  **Note: This is the first potential for a QA hitch. If the GTM preview pane does not appear on your page, there are two general reasons that will each require additional steps: 1) Preview mode is experiencing an issue. To troubleshoot, hard reset your page. 2) The correct GTM container is not loaded on your website. Check container ID’s thoroughly.  

GTM Preview Mode QA

  1. Navigate to the page which the interaction you just set up tracking for in GTM is on.
  2. Trigger the tagged interaction
**Note: Pro Tip! To prevent the page from reloading, rendering you unable to review your tag set up, press and hold Command + ‘.’ while you’re clicking. This will load the new page in a separate tab, rather than changing the page which you’re on.   [video width="2560" height="1600" mp4="https://www.adswerve.com/wp-content/uploads/2018/06/Screen-Recording_Prevent-Reload.mp4"][/video]  
  1. If your tag is set up correctly, you'll see a new tile pop into your debugger window. This should be the tag which you just set up.
   
  1. Click on this tile in the debugger window to learn more about your tag. Check to ensure the required Category, Action & Label are present, and your hit is going to the correct Property ID.
   
  1. Does this match the ticket which you were asked to QA? If so, great! If not, there are a couple of paths to take. Imagine if you wanted to change the Event Label from Page Title to Page URL? Where might you go to see what GTM thinks the Page URL is?
  2. The Variables section of the GTM Debugger is the lesser known, and in my opinion, much more helpful section of the tool. At the exact point in time which your event was triggered—what other data do we have available to us?
   
  1. If it were determined that instead of Page Title you wanted to pull in Page URL, it’s a simple variable switch within your tag in GTM.
  2. The final piece of our QA is verifying that the hit successfully made it to Google Analytics. That is verified in two ways:
    • Pull up your Developer Tools (right click on your page and hit “Inspect”). Filter the “Network” tab by typing in “collect”. Trigger your interaction, and watch to see what pops up in the Developer Tools. The event which we’re looking to trigger is a hit type of “event”, so that’ll be what we look for in the list of hits being sent.

    • Click on it and ensure the status code reads “200” indicating that the hit went out successfully. Also, do a once over of your parameters to ensure everything will look good in Google Analytics.

  **Note: If you’re curious as to what all of those Query String Parameters are, check out this documentation.
    • Finally - do you see your hit in Google Analytics Real Time reports?

  Success! There are many, many more things than this one blog post could cover. Stay tuned for further GTM debugging scenarios—and comment if there are any in particular which you’re struggling with! We can help!