import { STAGING_URL, PATHS, TIMEOUTS } from './config/staging-config';
import { test } from '@playwright/test';

test.describe('Debug Dashboard Final', () => {
  test('check what is actually rendering on dashboard', async ({ page }) => {
    const staging_url = 'https://upskill-staging.measurequick.com';
    
    // Enable console logging
    page.on('console', msg => console.log('Browser console:', msg.text()));
    page.on('pageerror', error => console.log('Page error:', error.message));
    
    // Login as test trainer
    await page.goto(`${staging_url}/community-login`);
    await page.fill('#user_login', 'test_trainer');
    await page.fill('#user_pass', 'password123!');
    await page.click('input[type="submit"]');
    await page.waitForTimeout(3000);

    // Go to dashboard
    await page.goto(`${staging_url}/hvac-dashboard`);
    await page.waitForLoadState('networkidle');
    
    // Get page content
    const content = await page.content();
    
    // Check for key elements that should be present
    console.log('\n=== Dashboard Debug Info ===');
    
    // Check page title
    const title = await page.title();
    console.log('Page title:', title);
    
    // Check for main content area
    const hasMainContent = content.includes('site-main');
    console.log('Has main content area:', hasMainContent);
    
    // Check for trainer dashboard header
    const hasDashboardHeader = content.includes('Trainer Dashboard');
    console.log('Has dashboard header:', hasDashboardHeader);
    
    // Check for stats section
    const hasStatsSection = content.includes('hvac-dashboard-stats');
    console.log('Has stats section:', hasStatsSection);
    
    // Check for stat cards
    const hasStatCards = content.includes('hvac-stat-card');
    console.log('Has stat cards:', hasStatCards);
    
    // Check for specific stat titles
    const hasTotalEvents = content.includes('Total Events');
    console.log('Has Total Events:', hasTotalEvents);
    
    // Check for PHP errors
    const hasPhpError = content.includes('Fatal error') || content.includes('Warning:') || content.includes('Notice:');
    console.log('Has PHP errors:', hasPhpError);
    
    // Check if the custom template is being loaded
    const hasCustomTemplate = content.includes('HVAC Trainer Dashboard');
    console.log('Has custom template comment:', hasCustomTemplate);
    
    // Save full page content for inspection
    const fs = require('fs');
    fs.writeFileSync('dashboard-content.html', content);
    console.log('Full page content saved to dashboard-content.html');
    
    // Take a screenshot
    await page.screenshot({ path: 'dashboard-final-debug.png', fullPage: true });
    console.log('Screenshot saved to dashboard-final-debug.png');
    
    // Check for any visible error messages
    const visibleErrors = await page.locator('.error, .notice-error, .wp-die-message').allTextContents();
    if (visibleErrors.length > 0) {
      console.log('Visible errors:', visibleErrors);
    }
    
    console.log('=== End Debug Info ===\n');
  });
});