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

// STAGING_URL is now imported from config

test.describe('Simple Event Creation', () => {
  test('should allow trainer to create an event', async ({ page }) => {
    // Login
    await page.goto(PATHS.login);
    await page.fill('#user_login', 'test_trainer');
    await page.fill('#user_pass', 'Test123!');
    await page.click('#wp-submit');
    await page.waitForURL('**/hvac-dashboard/');
    
    // Navigate to create event
    console.log('Looking for Create Event button...');
    const createEventBtn = page.locator('a:has-text("CREATE EVENT"), a:has-text("Create Event")').first();
    await expect(createEventBtn).toBeVisible();
    await createEventBtn.click();
    
    // Wait for form to load
    await page.waitForLoadState('networkidle');
    await page.waitForTimeout(2000);
    
    // Screenshot the form
    await page.screenshot({ path: 'test-results/create-event-form.png', fullPage: true });
    
    // Fill in basic event details
    const eventTitle = `Test Event ${Date.now()}`;
    console.log('Creating event:', eventTitle);
    
    // Title
    await page.fill('input[name="post_title"], input#title', eventTitle);
    
    // Description - check for different possible editors
    const descriptionText = `This is a test event created at ${new Date().toISOString()}`;
    
    // Try TinyMCE first
    const tinymceFrame = page.frameLocator('#post_content_ifr, iframe#content_ifr, iframe[id*="content"]').first();
    const isIframeVisible = await tinymceFrame.locator('body').isVisible().catch(() => false);
    
    if (isIframeVisible) {
      console.log('Using TinyMCE editor');
      await tinymceFrame.locator('body').fill(descriptionText);
    } else {
      console.log('Using regular textarea');
      await page.fill('textarea[name="post_content"], textarea#content', descriptionText);
    }
    
    // Set dates - today for both start and end
    const today = new Date().toISOString().split('T')[0];
    await page.fill('input[name="EventStartDate"], input#EventStartDate', today);
    await page.fill('input[name="EventEndDate"], input#EventEndDate', today);
    
    // Set times
    await page.fill('input[name="EventStartTime"], input#EventStartTime', '10:00 AM');
    await page.fill('input[name="EventEndTime"], input#EventEndTime', '12:00 PM');
    
    // Submit
    console.log('Submitting event...');
    await page.click('input[type="submit"][value="Submit"], button[type="submit"]');
    
    // Wait for response
    await page.waitForTimeout(5000);
    
    // Take final screenshot
    await page.screenshot({ path: 'test-results/after-submit.png', fullPage: true });
    
    // Check if we're still on the same page (error) or redirected (success)
    const currentUrl = page.url();
    console.log('Current URL after submit:', currentUrl);
    
    // If successful, we should be redirected away from the create page
    expect(currentUrl).not.toContain('/manage-event/');
  });
});