import { STAGING_URL, PATHS, TIMEOUTS } from './config/staging-config';
import { test, expect } from '@playwright/test';
import { LoginPage } from './pages/LoginPage';
import { DashboardPage } from './pages/DashboardPage';
import { CreateEventPage } from './pages/CreateEventPage';
import { TEST_USERS } from './data/test-users';
import { TEST_EVENTS } from './data/test-events';

// STAGING_URL is now imported from config

test.describe('Debug Event Submission Errors', () => {
    let loginPage: LoginPage;
    let dashboardPage: DashboardPage;
    let createEventPage: CreateEventPage;
    
    const trainer = TEST_USERS.trainer;

    test.beforeEach(async ({ page }) => {
        loginPage = new LoginPage(page);
        dashboardPage = new DashboardPage(page);
        createEventPage = new CreateEventPage(page);
        
        // Set base URL and login
        page.context().setDefaultNavigationTimeout(TIMEOUTS.navigation);
        await page.goto(STAGING_URL);
        await loginPage.navigateToLogin();
        await loginPage.login(trainer.username, trainer.password);
    });

    test('Debug Event Submission with Console Logs', async ({ page }) => {
        // Monitor console messages
        page.on('console', message => {
            console.log(`CONSOLE ${message.type()}: ${message.text()}`);
        });
        
        // Monitor network errors
        page.on('requestfailed', request => {
            console.log(`REQUEST FAILED: ${request.url()} - ${request.failure()?.errorText}`);
        });
        
        // Click create event button
        await dashboardPage.clickCreateEvent();
        await expect(page).toHaveURL(/.*manage-event/);
        
        // Check for any error messages on the page
        const errorMessages = await page.locator('.tribe-community-notice, .error, .warning, .notice').all();
        if (errorMessages.length > 0) {
            console.log('Found error/notice messages:');
            for (const error of errorMessages) {
                const text = await error.innerText();
                console.log('- ', text);
            }
        }
        
        // Fill event details
        const eventData = TEST_EVENTS.basicEvent;
        await createEventPage.fillEventDetails(eventData);
        
        // Look for additional required fields by checking for required attributes
        const requiredFields = await page.locator('input[required], select[required], textarea[required]').all();
        console.log(`Found ${requiredFields.length} required fields`);
        
        for (const field of requiredFields) {
            const name = await field.getAttribute('name');
            const id = await field.getAttribute('id');
            const value = await field.inputValue().catch(() => field.textContent());
            const type = await field.getAttribute('type');
            console.log(`Required field: ${name || id} (${type}) = "${value}"`);
        }
        
        // Check for any hidden form fields that might be required
        const hiddenFields = await page.locator('input[type="hidden"]').all();
        console.log(`Found ${hiddenFields.length} hidden fields`);
        
        for (const field of hiddenFields) {
            const name = await field.getAttribute('name');
            const value = await field.inputValue();
            if (name && value) {
                console.log(`Hidden field: ${name} = "${value}"`);
            }
        }
        
        // Submit event
        console.log('Submitting event...');
        await createEventPage.submitEvent();
        
        // Wait for response
        await page.waitForLoadState('networkidle');
        
        // Check if we're still on the same page
        const currentUrl = page.url();
        console.log('Current URL after submit:', currentUrl);
        
        // Look for any error messages after submission
        const postSubmitErrors = await page.locator('.tribe-community-notice, .error, .warning, .notice, .tribe-error').all();
        if (postSubmitErrors.length > 0) {
            console.log('Post-submit error/notice messages:');
            for (const error of postSubmitErrors) {
                const text = await error.innerText();
                console.log('- ', text);
            }
        }
        
        // Check specific form validation
        await page.screenshot({ path: 'test-results/screenshots/after-submit-debug.png' });
        
        // Try looking for community events specific elements
        const communityElements = await page.locator('[class*="community"], [id*="community"]').all();
        console.log(`Found ${communityElements.length} community-related elements`);
        
        // Check if form is in editing mode vs new mode
        const postIdField = await page.locator('input[name="community-event-id"], input[name="event_id"], input[name="post_ID"]').first();
        if (await postIdField.count() > 0) {
            const postId = await postIdField.inputValue();
            console.log('Post ID field value:', postId);
        }
        
        // Look for any venue or organizer requirements
        const venueField = await page.locator('input[name*="venue"], select[name*="venue"]').first();
        const organizerField = await page.locator('input[name*="organizer"], select[name*="organizer"]').first();
        
        if (await venueField.count() > 0) {
            const venueValue = await venueField.inputValue().catch(() => venueField.textContent());
            console.log('Venue field value:', venueValue);
        }
        
        if (await organizerField.count() > 0) {
            const organizerValue = await organizerField.inputValue().catch(() => organizerField.textContent());
            console.log('Organizer field value:', organizerValue);
        }
    });
});