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

async function debugEditEventPage() {
    const browser = await chromium.launch({ headless: true });
    const page = await browser.newPage();
    
    try {
        console.log('🔍 Debugging Edit Event Page...');
        
        // Test 1: Check without event_id
        console.log('\n1. Testing without event_id...');
        await page.goto('https://upskill-staging.measurequick.com/trainer/edit-event/');
        await page.waitForLoadState('networkidle');
        
        const content1 = await page.textContent('body');
        const hasErrorMessage = content1.includes('No event specified');
        console.log(`   Has error message: ${hasErrorMessage ? '✅' : '❌'}`);
        
        // Test 2: Check with event_id
        console.log('\n2. Testing with event_id=6078...');
        await page.goto('https://upskill-staging.measurequick.com/trainer/edit-event/?event_id=6078');
        await page.waitForLoadState('networkidle');
        
        const content2 = await page.textContent('body');
        const hasEventIdMessage = content2.includes('Editing Event ID');
        console.log(`   Has event ID message: ${hasEventIdMessage ? '✅' : '❌'}`);
        
        // Test 3: Check page structure
        console.log('\n3. Checking page structure...');
        const pageData = await page.evaluate(() => {
            return {
                title: document.title,
                h1Text: document.querySelector('h1')?.textContent || 'No H1',
                bodyClasses: document.body.className,
                hasForms: document.querySelectorAll('form').length,
                hasHvacWrapper: document.querySelector('.hvac-edit-event-wrapper') !== null,
                hasNavigation: document.querySelector('.hvac-trainer-navigation, .hvac-nav-menu') !== null,
                pageContent: document.body.innerHTML.slice(0, 500) + '...',
                metaTemplate: document.querySelector('meta[name="template"]')?.content || 'Not set'
            };
        });
        
        console.log(`   Page Title: ${pageData.title}`);
        console.log(`   H1 Text: ${pageData.h1Text}`);
        console.log(`   Body Classes: ${pageData.bodyClasses}`);
        console.log(`   Forms Count: ${pageData.hasForms}`);
        console.log(`   Has HVAC Wrapper: ${pageData.hasHvacWrapper ? '✅' : '❌'}`);
        console.log(`   Has Navigation: ${pageData.hasNavigation ? '✅' : '❌'}`);
        console.log(`   Meta Template: ${pageData.metaTemplate}`);
        
        // Test 4: Check if it's actually loading our template
        console.log('\n4. Checking template usage...');
        const isUsingCustomTemplate = pageData.hasHvacWrapper || 
                                      content2.includes('Editing Event ID') ||
                                      content2.includes('hvac-edit-event-wrapper');
        
        console.log(`   Using custom template: ${isUsingCustomTemplate ? '✅' : '❌'}`);
        
        if (!isUsingCustomTemplate) {
            console.log('\n❌ ISSUE: Page is not using our custom template!');
            console.log('   This suggests the edit-event page is not properly created or template not assigned.');
            console.log('   Page content preview:');
            console.log('   ' + pageData.pageContent.replace(/\n/g, ' ').slice(0, 200) + '...');
        } else {
            console.log('\n✅ SUCCESS: Page is using our custom template!');
        }
        
        // Take a screenshot for visual verification
        await page.screenshot({ 
            path: '/tmp/playwright-mcp-output/2025-08-12T21-21-19.151Z/edit-event-debug.png',
            fullPage: true 
        });
        console.log('\n📸 Screenshot saved for visual verification.');
        
    } catch (error) {
        console.error('❌ Debug failed:', error.message);
    } finally {
        await browser.close();
    }
}

debugEditEventPage();