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

test.describe('Debug Create Event', () => {
    test('Create event with debug', async ({ page }) => {
        page.setDefaultTimeout(60000);
        
        // Navigate directly to community-login
        const loginUrl = 'https://upskill-staging.measurequick.com/community-login/';
        await page.goto(loginUrl);
        await page.waitForLoadState('networkidle');
        
        // Login
        await page.fill('#user_login', 'test_trainer');
        await page.fill('#user_pass', 'Test123!');
        await page.click('#wp-submit');
        await page.waitForURL((url) => !url.toString().includes('community-login'));
        
        // Navigate to create event page
        await page.goto('https://upskill-staging.measurequick.com/manage-event/');
        await page.waitForLoadState('networkidle');
        
        console.log('Current URL after navigation:', page.url());
        
        // Fill event title
        await page.fill('input[name="post_title"]', 'Test Event Creation');
        
        // Fill dates - use existing values from the fields
        const startDate = await page.inputValue('input[name="EventStartDate"]');
        const endDate = await page.inputValue('input[name="EventEndDate"]');
        console.log('Start date:', startDate);
        console.log('End date:', endDate);
        
        // Try to fill description - check if in iframe
        try {
            // Check if textarea is visible
            const textareaVisible = await page.isVisible('#tcepostcontent');
            console.log('Textarea visible:', textareaVisible);
            
            if (textareaVisible) {
                await page.fill('#tcepostcontent', 'Test event description');
            } else {
                // Try TinyMCE
                const frame = page.frameLocator('iframe[id$="_ifr"]');
                await frame.locator('body').fill('Test event description');
            }
        } catch (e) {
            console.log('Error filling description:', e.message);
            // Try JavaScript injection
            await page.evaluate(() => {
                const editor = (window as any).tinyMCE?.activeEditor;
                if (editor) {
                    editor.setContent('Test event description');
                }
            });
        }
        
        // Wait before submitting
        await page.waitForTimeout(2000);
        
        // Submit event
        console.log('Submitting event...');
        await page.click('input[name="community-event"][value="Submit Event"]');
        
        // Wait for navigation or response
        await page.waitForTimeout(3000);
        
        // Check current URL
        console.log('URL after submit:', page.url());
        
        // Take screenshot
        await page.screenshot({ path: 'test-results/screenshots/after-submit.png', fullPage: true });
        
        // Check for errors
        const errors = await page.$$('.notice-error, .error-message, .validation-error');
        if (errors.length > 0) {
            console.log('Errors found:', errors.length);
            for (const error of errors) {
                const text = await error.textContent();
                console.log('Error:', text);
            }
        }
    });
});