Debug Mode Issues

Problems with Google Analytics 4 DebugView or GTM Preview mode not showing expected data.

What This Means

Debug mode issues occur when:

• DebugView shows no events
• GTM Preview doesn't connect
• Events appear in debug but not production
• Debug data is incomplete or incorrect

How to Diagnose

GA4 DebugView Not Working

Check these common causes:

1. Debug mode not enabled
2. Wrong property selected
3. Ad blocker interference
4. Browser extension conflicts

GTM Preview Issues

// Check GTM debug mode
if (typeof google_tag_manager !== 'undefined') {
  const gtm = google_tag_manager['GTM-XXXXXXX'];
  console.log('Preview mode:', gtm && gtm.dataLayer.get('gtm.debug'));
}

General Fixes

1. Enable GA4 Debug Mode

Multiple methods to enable:

// Method 1: In gtag config
gtag('config', 'G-XXXXXXXX', {
  'debug_mode': true
});

// Method 2: Via URL parameter
// Add ?debug_mode=true to your URL

// Method 3: Via dataLayer
dataLayer.push({
  'debug_mode': true
});

2. Use Chrome Extension

Install Google Analytics Debugger:

1. Install from Chrome Web Store
2. Enable the extension
3. Refresh your page
4. Check DebugView in GA4

3. Fix GTM Preview Connection

If Preview won't connect:

// Verify GTM is loaded
console.log('GTM loaded:', typeof google_tag_manager !== 'undefined');

// Check for blocked resources
// Open Network tab and look for blocked requests to:
// - www.googletagmanager.com
// - tagassistant.google.com

Clear browser data if needed:

1. Clear cookies for tagassistant.google.com
2. Disable browser extensions
3. Try incognito mode
4. Try different browser

4. Check Filter Settings

GA4 filters can hide debug data:

1. Go to GA4 > Admin > Data Filters
2. Check for internal traffic filters
3. Verify your IP isn't excluded
4. Check data stream filters

5. Verify Consent Status

Consent mode blocks data in debug:

// Check if analytics is blocked
gtag('consent', 'update', {
  'analytics_storage': 'granted'
});

// Verify consent state
console.log('Consent:', window.dataLayer.filter(e => e[0] === 'consent'));

6. Fix Time Zone Issues

DebugView shows data in property timezone:

• Events may appear in different time
• Check property time zone settings
• Compare with local browser time

Debug Mode Best Practices

Development Environment

// Enable debug based on environment
const isDebug = window.location.hostname === 'localhost' ||
                window.location.search.includes('debug');

gtag('config', 'G-XXXXXXXX', {
  'debug_mode': isDebug
});

Production Debugging

// Enable for specific users only
const enableDebug = document.cookie.includes('ga_debug=true');

if (enableDebug) {
  gtag('config', 'G-XXXXXXXX', { 'debug_mode': true });
}

GTM Debug Container

Use GTM environments for debugging:

1. Create "Debug" environment in GTM
2. Use debug snippet for testing
3. Keep production container clean

Common Issues

Further Reading

• Events Not Firing
• GTM Container Issues
• Data Layer Issues