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

(async () => {
    console.log('🚀 Starting Comprehensive Fixes Test Suite');
    console.log('=====================================\n');
    
    const browser = await chromium.launch({ 
        headless: true,
        args: ['--no-sandbox', '--disable-setuid-sandbox']
    });
    
    const context = await browser.newContext({
        viewport: { width: 1280, height: 720 }
    });
    
    const page = await context.newPage();
    const baseUrl = 'https://upskill-staging.measurequick.com';
    
    let passedTests = 0;
    let failedTests = 0;
    const results = [];
    
    async function testPage(name, url, checks) {
        console.log(`Testing: ${name}`);
        try {
            await page.goto(baseUrl + url, { waitUntil: 'networkidle', timeout: 30000 });
            
            for (const check of checks) {
                try {
                    await check();
                    console.log(`  ✅ ${check.name || 'Check passed'}`);
                } catch (e) {
                    console.log(`  ❌ ${check.name || 'Check failed'}: ${e.message}`);
                    throw e;
                }
            }
            
            passedTests++;
            results.push({ name, status: 'PASSED' });
            console.log(`  ✅ ${name} - PASSED\n`);
        } catch (error) {
            failedTests++;
            results.push({ name, status: 'FAILED', error: error.message });
            console.log(`  ❌ ${name} - FAILED: ${error.message}\n`);
        }
    }
    
    // Test 1: Trainer Login
    console.log('📋 Test 1: Authentication\n');
    await testPage('Trainer Login', '/training-login/', [
        async function checkLoginForm() {
            await page.waitForSelector('form', { timeout: 5000 });
        }
    ]);
    
    // Login as trainer
    try {
        await page.fill('input[name="log"]', 'test_trainer');
        await page.fill('input[name="pwd"]', 'TestTrainer2025!');
        await page.getByRole('button', { name: /log in|submit/i }).click();
        await page.waitForLoadState('networkidle');
    } catch (e) {
        console.log('  ⚠️  Login failed, continuing with tests...');
    }
    
    // Test 2: Trainer Pages (Previously Empty)
    console.log('📋 Test 2: Trainer Pages (Previously Empty)\n');
    
    await testPage('Venue List Page', '/trainer/venue/list/', [
        async function checkBreadcrumbs() {
            const breadcrumbs = await page.locator('.hvac-breadcrumbs').count();
            if (breadcrumbs === 0) throw new Error('Breadcrumbs missing');
        },
        async function checkPageContent() {
            const content = await page.textContent('body');
            if (content.includes('Page not found') || content.trim() === '') {
                throw new Error('Page appears empty');
            }
        },
        async function checkNavigation() {
            const nav = await page.locator('.hvac-trainer-menu').count();
            if (nav === 0) throw new Error('Navigation menu missing');
        }
    ]);
    
    await testPage('Venue Manage Page', '/trainer/venue/manage/', [
        async function checkBreadcrumbs() {
            const breadcrumbs = await page.locator('.hvac-breadcrumbs').count();
            if (breadcrumbs === 0) throw new Error('Breadcrumbs missing');
        },
        async function checkPageContent() {
            const content = await page.textContent('body');
            if (content.includes('Page not found') || content.trim() === '') {
                throw new Error('Page appears empty');
            }
        }
    ]);
    
    await testPage('Organizer Manage Page', '/trainer/organizer/manage/', [
        async function checkBreadcrumbs() {
            const breadcrumbs = await page.locator('.hvac-breadcrumbs').count();
            if (breadcrumbs === 0) throw new Error('Breadcrumbs missing');
        },
        async function checkPageContent() {
            const content = await page.textContent('body');
            if (content.includes('Page not found') || content.trim() === '') {
                throw new Error('Page appears empty');
            }
        }
    ]);
    
    await testPage('Training Leads Page', '/trainer/profile/training-leads/', [
        async function checkBreadcrumbs() {
            const breadcrumbs = await page.locator('.hvac-breadcrumbs').count();
            if (breadcrumbs === 0) throw new Error('Breadcrumbs missing');
        },
        async function checkPageContent() {
            const content = await page.textContent('body');
            if (content.includes('Page not found') || content.trim() === '') {
                throw new Error('Page appears empty');
            }
        }
    ]);
    
    // Logout and login as master trainer
    try {
        await page.goto(baseUrl + '/wp-login.php?action=logout', { waitUntil: 'networkidle' });
        await page.click('a:has-text("log out")').catch(() => {});
        
        await page.goto(baseUrl + '/training-login/', { waitUntil: 'networkidle' });
        await page.fill('input[name="log"]', 'test_master');
        await page.fill('input[name="pwd"]', 'TestMaster2025!');
        await page.getByRole('button', { name: /log in|submit/i }).click();
        await page.waitForLoadState('networkidle');
    } catch (e) {
        console.log('  ⚠️  Master trainer login failed, continuing...');
    }
    
    // Test 3: Master Trainer Pages
    console.log('📋 Test 3: Master Trainer Pages\n');
    
    await testPage('Master Google Sheets', '/master-trainer/google-sheets/', [
        async function checkNavigation() {
            const nav = await page.locator('.hvac-master-menu').count();
            if (nav === 0) throw new Error('Master navigation missing');
        },
        async function checkBreadcrumbs() {
            const breadcrumbs = await page.locator('.hvac-breadcrumbs').count();
            if (breadcrumbs === 0) throw new Error('Breadcrumbs missing');
        }
    ]);
    
    await testPage('Master Announcements', '/master-trainer/announcements/', [
        async function checkSingleColumn() {
            // Check if the single-column body class is present
            const bodyClasses = await page.getAttribute('body', 'class');
            if (!bodyClasses || !bodyClasses.includes('hvac-master-single-column')) {
                console.log('  ⚠️  Single column class not detected, checking layout...');
            }
        },
        async function checkLayout() {
            const content = await page.locator('.hvac-announcements-timeline, .announcements-content').first();
            if (content) {
                const box = await content.boundingBox();
                if (box && box.width < 300) {
                    throw new Error('Content appears to be in multi-column layout');
                }
            }
        }
    ]);
    
    await testPage('Master Pending Approvals', '/master-trainer/pending-approvals/', [
        async function checkSingleColumn() {
            const bodyClasses = await page.getAttribute('body', 'class');
            if (!bodyClasses || !bodyClasses.includes('hvac-master-single-column')) {
                console.log('  ⚠️  Single column class not detected, checking layout...');
            }
        },
        async function checkLayout() {
            const content = await page.locator('.hvac-pending-approvals-content').first();
            if (content) {
                const box = await content.boundingBox();
                if (box && box.width < 300) {
                    throw new Error('Content appears to be in multi-column layout');
                }
            }
        }
    ]);
    
    await testPage('Master Trainers Overview', '/master-trainer/trainers/', [
        async function checkSingleColumn() {
            const bodyClasses = await page.getAttribute('body', 'class');
            if (!bodyClasses || !bodyClasses.includes('hvac-master-single-column')) {
                console.log('  ⚠️  Single column class not detected, checking layout...');
            }
        },
        async function checkLayout() {
            const content = await page.locator('.hvac-master-trainers-content, .hvac-trainers-content').first();
            if (content) {
                const box = await content.boundingBox();
                if (box && box.width < 300) {
                    throw new Error('Content appears to be in multi-column layout');
                }
            }
        }
    ]);
    
    // Test 4: Styling Consistency
    console.log('📋 Test 4: Styling Consistency\n');
    
    const masterPages = [
        '/master-trainer/master-dashboard/',
        '/master-trainer/announcements/',
        '/master-trainer/trainers/',
        '/master-trainer/pending-approvals/'
    ];
    
    const styles = [];
    for (const url of masterPages) {
        await page.goto(baseUrl + url, { waitUntil: 'networkidle' });
        
        const h1Style = await page.evaluate(() => {
            const h1 = document.querySelector('h1');
            if (!h1) return null;
            const computed = window.getComputedStyle(h1);
            return {
                fontFamily: computed.fontFamily,
                fontSize: computed.fontSize,
                color: computed.color
            };
        });
        
        styles.push({ url, h1Style });
    }
    
    // Check if styles are consistent
    const firstStyle = styles[0].h1Style;
    let stylesConsistent = true;
    
    for (let i = 1; i < styles.length; i++) {
        const style = styles[i].h1Style;
        if (!style || 
            style.fontFamily !== firstStyle.fontFamily ||
            Math.abs(parseFloat(style.fontSize) - parseFloat(firstStyle.fontSize)) > 2) {
            stylesConsistent = false;
            console.log(`  ⚠️  Style inconsistency detected on ${styles[i].url}`);
        }
    }
    
    if (stylesConsistent) {
        console.log('  ✅ Master Trainer pages have consistent styling\n');
        passedTests++;
    } else {
        console.log('  ⚠️  Some style inconsistencies remain (may be theme-related)\n');
    }
    
    // Summary
    console.log('\n=====================================');
    console.log('📊 TEST SUMMARY');
    console.log('=====================================');
    console.log(`✅ Passed: ${passedTests}`);
    console.log(`❌ Failed: ${failedTests}`);
    console.log(`📊 Success Rate: ${Math.round((passedTests / (passedTests + failedTests)) * 100)}%\n`);
    
    console.log('Detailed Results:');
    results.forEach(result => {
        const icon = result.status === 'PASSED' ? '✅' : '❌';
        console.log(`${icon} ${result.name}: ${result.status}`);
        if (result.error) {
            console.log(`   Error: ${result.error}`);
        }
    });
    
    await browser.close();
    
    if (failedTests > 0) {
        console.log('\n⚠️  Some tests failed. Please review the results above.');
        process.exit(1);
    } else {
        console.log('\n🎉 All critical tests passed!');
    }
})();