Debugging GTM Data Layer Issues with GTM Preview Mode

GTM Preview Mode Overview

GTM Preview Mode lets you see exactly what happens in your GTM container on your live website — which tags fire, which triggers activated them, and what the data layer contains at each moment. It is the most powerful tool for diagnosing data layer problems.

Opening Preview Mode

1. GTM → your container → Preview button (top right)
2. Enter your website URL and click Connect
3. Tag Assistant opens in a new tab showing your website; GTM Preview Panel opens
4. Browse your website — every event, tag fire, and data layer push is captured in real-time

Reading the Data Layer Panel

In the Preview Panel, select any event from the left timeline. Click "Data Layer" tab to see the complete state of the data layer at that moment:

• Top section: the data pushed in the selected event (the delta)
• Bottom section: the cumulative data layer state (all values from all previous pushes)

If you expected a value to be present but it is not in the Data Layer state, either the push never happened or it pushed to the wrong key name.

Diagnosing Missing Events

Problem: you pushed an event to the data layer but it does not appear in the GTM Preview timeline.

Diagnosis:

1. Open browser DevTools → Console tab
2. Type: window.dataLayer and press Enter
3. Inspect the array — if your event is in the array but not in GTM Preview, the GTM container loaded after your push (GTM was not on the page when the push happened)
4. Solution: ensure GTM container snippet loads before any custom JavaScript that pushes to the data layer

Diagnosing Wrong Variable Values

Problem: a tag fires but the GA4 event parameters contain undefined or incorrect values.

Diagnosis:

1. In Preview Panel, select the event where the tag fires
2. Click "Variables" tab — shows all variable values at that moment
3. Find your Data Layer Variable — if it shows undefined, the key name in your variable configuration does not match the key name in the data layer push
4. Compare the variable's "Variable Name" setting exactly with the key in the data layer (case-sensitive)

Diagnosing Tags Not Firing

Problem: the data layer push happens but the tag does not fire.

Diagnosis:

1. In Preview Panel, select the event, click "Tags" tab
2. Look in "Tags Not Fired" — the tag should appear there with a "Why did this tag not fire?" link
3. Click it — GTM shows which trigger condition failed. Most common causes:
   • Event trigger name mismatch (case-sensitive) — 'purchase' vs 'Purchase'
   • Trigger has an additional condition that is not being met
   • Tag is paused or has exceptions

The Console Debug Method

For quick debugging outside of GTM Preview, add this to your page console:

// Override push to log every data layer event
var originalPush = window.dataLayer.push;
window.dataLayer.push = function() {
  console.log('dataLayer.push:', JSON.stringify(arguments[0], null, 2));
  return originalPush.apply(this, arguments);
};

Summary

GTM Preview Mode is the primary debugging tool for data layer issues. Check the Data Layer tab for push contents and cumulative state. Check the Variables tab for resolved variable values (undefined indicates a key name mismatch). Check Tags Not Fired for trigger condition details. For pushes happening before GTM loads, check the browser console with window.dataLayer to see the full array state.

See our GTM Data Layer Implementation service for debugging support.

Need GTM data layer issues diagnosed? Contact Adslytics.