const { chromium } = require('playwright');

(async () => {
  console.log('🔍 Examining page source for debug information...');
  
  const browser = await chromium.launch({
    headless: false,
    slowMo: 1000
  });
  
  const page = await browser.newPage();
  
  try {
    // Login first
    console.log('📋 Logging in...');
    await page.goto('https://upskill-staging.measurequick.com/training-login/');
    await page.waitForTimeout(2000);
    
    await page.fill('#user_login', 'test_master');
    await page.fill('#user_pass', 'TestMaster123!');
    await page.click('#wp-submit');
    await page.waitForTimeout(3000);
    
    // Go to dashboard
    console.log('📋 Loading dashboard...');
    await page.goto('https://upskill-staging.measurequick.com/master-trainer/master-dashboard/');
    await page.waitForTimeout(3000);
    
    // Get the full HTML source
    const htmlSource = await page.content();
    
    // Look for debug comments and content
    console.log('\n📊 Source Code Analysis:');
    console.log('- Total HTML length:', htmlSource.length);
    console.log('- Contains "DEBUG: Dashboard content captured":', htmlSource.includes('DEBUG: Dashboard content captured'));
    console.log('- Contains "hvac-page-wrapper":', htmlSource.includes('hvac-page-wrapper'));
    console.log('- Contains "Master Dashboard" in body:', htmlSource.includes('<h1>Master Dashboard</h1>'));
    console.log('- Contains "System Overview":', htmlSource.includes('System Overview'));
    
    // Look for WordPress main content area
    console.log('\n📊 WordPress Structure Analysis:');
    console.log('- Contains #primary:', htmlSource.includes('id="primary"'));
    console.log('- Contains #main:', htmlSource.includes('id="main"'));
    console.log('- Contains .site-main:', htmlSource.includes('site-main'));
    console.log('- Contains .entry-content:', htmlSource.includes('entry-content'));
    
    // Look for error messages or blank content
    const bodyMatch = htmlSource.match(/<body[^>]*>([\s\S]*?)<\/body>/);
    if (bodyMatch) {
      const bodyContent = bodyMatch[1];
      console.log('\n📊 Body Content Analysis:');
      console.log('- Body content length:', bodyContent.length);
      console.log('- Contains navigation menu:', bodyContent.includes('hvac-trainer-menu'));
      console.log('- Contains WordPress footer:', bodyContent.includes('wp-footer'));
    }
    
    // Extract and show a snippet of the body content around where our content should be
    const mainContentMatch = htmlSource.match(/<main[^>]*id="main"[^>]*>([\s\S]*?)<\/main>/);
    if (mainContentMatch) {
      console.log('\n📊 Main Content Area:');
      console.log(mainContentMatch[1].substring(0, 500) + '...');
    } else {
      console.log('\n❌ No main content area found');
    }
    
    // Keep browser open briefly
    console.log('\n🔍 Keeping browser open for 10 seconds...');
    await page.waitForTimeout(10000);
    
  } catch (error) {
    console.error('Error during analysis:', error);
  } finally {
    await browser.close();
    console.log('✅ Analysis completed');
  }
})();