Comprehensive guide to testing and validating GA4 implementation using DebugView, Preview mode, and real-time monitoring. Use when verifying GA4 tracking, troubleshooting events not firing, validating event parameters, testing GTM implementations, checking DebugView data, or debugging implementation issues. Covers enabling debug mode, reading DebugView interface, common validation patterns, and troubleshooting workflows.
/plugin marketplace add henkisdabro/wookstar-claude-code-plugins/plugin install ga-suite@wookstar-claude-code-pluginsThis skill inherits all available tools. When active, it can use any tool Claude has access to.
references/debugview-complete-guide.mdreferences/ecommerce-testing.mdDebugView is GA4's real-time debugging tool for validating implementation, testing events, and troubleshooting tracking issues before data appears in standard reports.
Invoke this skill when:
Method 1: Browser Extension (Recommended)
Method 2: URL Parameter
Add ?debug_mode=true to URL:
https://yourwebsite.com?debug_mode=true
Method 3: gtag.js Configuration
gtag('config', 'G-XXXXXXXXXX', {
'debug_mode': true
});
Method 4: GTM Configuration
In GA4 Configuration tag, add parameter:
debug_modetrueSteps:
Requirements:
Main Sections:
1. Device Stream (Left Panel)
2. Event Stream (Center Panel)
3. Event Details (Right Panel)
Event Card Shows:
page_view, purchase, button_click)Example Event:
Event: purchase
Timestamp: 14:23:45
Parameters:
transaction_id: "T_12345"
value: 99.99
currency: "USD"
items: [Array with 2 items]
User Properties:
user_tier: "premium"
Page View Validation:
Expected Events:
first_visit (new users only)session_start (new sessions)page_view (every page)Check:
page_location parameter (full URL)page_title parameter (page title)page_referrer (previous page)Purchase Event Validation:
Required Parameters:
transaction_id (unique ID)value (number, total revenue)currency (3-letter ISO code)items (array of products)Check:
Custom Event Validation:
Check:
E-commerce Flow:
Form Tracking:
page_viewform_start (if tracked)form_submitform_name, form_id, form_destinationVideo Tracking:
video_start → video_title, video_idvideo_progress → video_percent (25, 50, 75)video_complete → video_percent: 100Issue: Events Not Appearing
Checks:
Issue: Missing Parameters
Checks:
Issue: Wrong Parameter Values
Checks:
Issue: Duplicate Events
Checks:
Workflow 1: New Implementation Test
session_startpage_viewfirst_visit (if new user)page_view fires againWorkflow 2: Custom Event Test
Workflow 3: E-commerce Test
item_id presentitem_name presentprice is numberquantity is integerpurchase event has unique transaction_idvalue matches cart totalWorkflow 4: GTM Integration Test
Set User Properties:
gtag('set', 'user_properties', {
'user_tier': 'premium',
'account_age_days': 365
});
Verify in DebugView:
user_tier: "premium"account_age_days: "365"Before Launch:
During Development:
After Launch:
Enable Debug Mode:
?debug_mode=truedebug_mode: trueAccess DebugView: Admin → DebugView
Key Checks:
Creating algorithmic art using p5.js with seeded randomness and interactive parameter exploration. Use this when users request creating art using code, generative art, algorithmic art, flow fields, or particle systems. Create original algorithmic art rather than copying existing artists' work to avoid copyright violations.
Applies Anthropic's official brand colors and typography to any sort of artifact that may benefit from having Anthropic's look-and-feel. Use it when brand colors or style guidelines, visual formatting, or company design standards apply.
Create beautiful visual art in .png and .pdf documents using design philosophy. You should use this skill when the user asks to create a poster, piece of art, design, or other static piece. Create original visual designs, never copying existing artists' work to avoid copyright violations.