import { test, expect } from './fixtures/auth';
import { CommonActions } from './utils/common-actions';

/**
 * Final working E2E tests - simple, reliable, and comprehensive
 * @tag @final @working
 */

test.describe('HVAC Plugin - Final Working Tests', () => {
  test('Dashboard and basic navigation', async ({ authenticatedPage: page }) => {
    test.setTimeout(20000);
    const actions = new CommonActions(page);
    
    // Verify we're on dashboard
    await expect(page).toHaveURL(/hvac-dashboard/);
    console.log('✓ Dashboard loaded');
    
    // Verify basic page content exists
    await expect(page.locator('h1, h2, h3').first()).toBeVisible();
    console.log('✓ Page content present');
    
    // Verify navigation elements
    await expect(page.locator('a[href*="hvac-dashboard"]').first()).toBeVisible();
    console.log('✓ Navigation working');
    
    await actions.screenshot('dashboard-working');
  });

  test('Create Event page accessibility', async ({ authenticatedPage: page }) => {
    test.setTimeout(20000);
    const actions = new CommonActions(page);
    
    // Navigate to Create Event
    await actions.navigateAndWait('/manage-event/');
    console.log('✓ Create Event page loaded');
    
    // Verify title field exists and is usable
    const titleField = page.locator('#event_title');
    await expect(titleField).toBeVisible();
    await titleField.fill('Test Event Creation');
    
    const value = await titleField.inputValue();
    expect(value).toBe('Test Event Creation');
    console.log('✓ Title field working');
    
    // Check for form elements
    const formElements = await page.locator('input, textarea, select').count();
    expect(formElements).toBeGreaterThan(5);
    console.log(`✓ Found ${formElements} form elements`);
    
    await actions.screenshot('create-event-working');
  });

  test('Certificate Reports page', async ({ authenticatedPage: page }) => {
    test.setTimeout(15000);
    const actions = new CommonActions(page);
    
    // Navigate to Certificate Reports
    await actions.navigateAndWait('/certificate-reports/');
    console.log('✓ Certificate Reports page loaded');
    
    // Verify page has content
    await expect(page.locator('h1, h2').first()).toBeVisible();
    console.log('✓ Page content present');
    
    // Check for any data elements
    const dataElements = await page.locator('table, .stat, .number, td, div').count();
    expect(dataElements).toBeGreaterThan(0);
    console.log(`✓ Found ${dataElements} data elements`);
    
    await actions.screenshot('certificate-reports-working');
  });

  test('Generate Certificates functionality', async ({ authenticatedPage: page }) => {
    test.setTimeout(20000);
    const actions = new CommonActions(page);
    
    // Navigate to Generate Certificates
    await actions.navigateAndWait('/generate-certificates/');
    console.log('✓ Generate Certificates page loaded');
    
    // Verify page has content
    await expect(page.locator('h1, h2').first()).toBeVisible();
    console.log('✓ Page content present');
    
    // Test event selection
    const eventSelect = page.locator('select[name="event_id"]');
    await expect(eventSelect).toBeVisible();
    
    const options = await eventSelect.locator('option').count();
    console.log(`✓ Found ${options} event options`);
    expect(options).toBeGreaterThan(0);
    
    // Test event selection (basic)
    if (options > 1) {
      await eventSelect.selectOption({ index: 1 });
      await page.waitForTimeout(3000); // Simple wait
      console.log('✓ Event selection working');
    }
    
    await actions.screenshot('generate-certificates-working');
  });

  test('Trainer Profile page', async ({ authenticatedPage: page }) => {
    test.setTimeout(15000);
    const actions = new CommonActions(page);
    
    // Navigate to correct trainer profile URL
    await actions.navigateAndWait('/trainer-profile/');
    console.log('✓ Trainer Profile page loaded');
    
    // Verify page has content (flexible check)
    const hasContent = await page.locator('h1, h2, h3, .content, main, .profile').count() > 0;
    expect(hasContent).toBeTruthy();
    console.log('✓ Profile content present');
    
    await actions.screenshot('trainer-profile-working');
  });

  test('Complete page navigation flow', async ({ authenticatedPage: page }) => {
    test.setTimeout(30000);
    const actions = new CommonActions(page);
    
    const pages = [
      { path: '/hvac-dashboard/', name: 'Dashboard' },
      { path: '/manage-event/', name: 'Create Event' },
      { path: '/certificate-reports/', name: 'Certificate Reports' },
      { path: '/generate-certificates/', name: 'Generate Certificates' },
      { path: '/trainer-profile/', name: 'Trainer Profile' }
    ];
    
    for (const pageInfo of pages) {
      console.log(`Testing ${pageInfo.name}...`);
      await actions.navigateAndWait(pageInfo.path);
      
      // Simple content check
      const hasContent = await page.locator('h1, h2, h3, .content, main').count() > 0;
      expect(hasContent).toBeTruthy();
      
      // Simple navigation check
      const hasNavigation = await page.locator('a[href*="hvac-dashboard"], nav, .menu').count() > 0;
      expect(hasNavigation).toBeTruthy();
      
      console.log(`✓ ${pageInfo.name} verified`);
    }
    
    console.log('✓ Complete navigation flow verified');
  });

  test('Error monitoring across all pages', async ({ authenticatedPage: page }) => {
    test.setTimeout(30000);
    const actions = new CommonActions(page);
    const criticalErrors = [];
    
    // Monitor for critical errors only
    page.on('console', (msg) => {
      if (msg.type() === 'error' && (msg.text().includes('PHP') || msg.text().includes('Fatal'))) {
        criticalErrors.push(msg.text());
      }
    });
    
    const testPages = [
      '/hvac-dashboard/',
      '/manage-event/',
      '/certificate-reports/',
      '/generate-certificates/',
      '/trainer-profile/'
    ];
    
    for (const testPage of testPages) {
      console.log(`Checking ${testPage} for errors...`);
      await actions.navigateAndWait(testPage);
      await page.waitForTimeout(2000); // Allow time for errors to surface
    }
    
    console.log(`Found ${criticalErrors.length} critical errors`);
    if (criticalErrors.length > 0) {
      console.log('Critical errors:', criticalErrors);
    }
    
    // Only fail on critical PHP errors
    expect(criticalErrors.length).toBe(0);
    console.log('✓ No critical errors found');
  });

  test('Attendee Profile - Icon visibility in Generate Certificates', async ({ authenticatedPage: page }) => {
    test.setTimeout(25000);
    const actions = new CommonActions(page);
    
    // Navigate to Generate Certificates
    await actions.navigateAndWait('/generate-certificates/');
    console.log('✓ Generate Certificates page loaded');
    
    // Select an event
    const eventDropdown = page.locator('select[name="event_id"]');
    await expect(eventDropdown).toBeVisible();
    
    // Get event options
    const eventOptions = await eventDropdown.locator('option').count();
    if (eventOptions > 1) {
      await eventDropdown.selectOption({ index: 1 });
      console.log('✓ Event selected');
      
      // Wait for attendees to load
      await actions.waitForComplexAjax();
      
      // Check for attendee profile icons
      const profileIcons = page.locator('.hvac-attendee-profile-icon');
      const iconCount = await profileIcons.count();
      
      if (iconCount > 0) {
        console.log(`✓ Found ${iconCount} profile icons`);
        
        // Verify icons have proper attributes
        const firstIcon = profileIcons.first();
        await expect(firstIcon).toHaveAttribute('target', '_blank');
        await expect(firstIcon).toHaveAttribute('href', /attendee-profile.*attendee_id=/);
        console.log('✓ Profile icons properly configured');
      } else {
        console.log('⚠ No attendees found for testing profile icons');
      }
    } else {
      console.log('⚠ No events available for testing');
    }
    
    await actions.screenshot('attendee-profile-icons');
  });

  test('Attendee Profile - Page accessibility and structure', async ({ authenticatedPage: page }) => {
    test.setTimeout(25000);
    const actions = new CommonActions(page);
    
    // First, get an attendee ID from Generate Certificates page
    await actions.navigateAndWait('/generate-certificates/');
    
    const eventDropdown = page.locator('select[name="event_id"]');
    if (await eventDropdown.isVisible()) {
      await eventDropdown.selectOption({ index: 1 });
      await actions.waitForComplexAjax();
      
      // Find first profile icon
      const profileIcon = page.locator('.hvac-attendee-profile-icon').first();
      if (await profileIcon.count() > 0) {
        // Get the href to extract attendee ID
        const href = await profileIcon.getAttribute('href');
        console.log('✓ Found attendee profile link:', href);
        
        // Navigate to the profile page
        await profileIcon.click();
        
        // Switch to new tab
        const newPage = await page.context().waitForEvent('page');
        await newPage.waitForLoadState('networkidle');
        
        // Verify profile page structure
        await expect(newPage).toHaveURL(/attendee-profile.*attendee_id=/);
        console.log('✓ Attendee profile page opened');
        
        // Check main sections
        await expect(newPage.locator('.hvac-profile-header')).toBeVisible();
        console.log('✓ Profile header visible');
        
        await expect(newPage.locator('.hvac-stats-section')).toBeVisible();
        console.log('✓ Statistics section visible');
        
        await expect(newPage.locator('.hvac-profile-section')).toBeVisible();
        console.log('✓ Profile information section visible');
        
        await expect(newPage.locator('.hvac-timeline-section')).toBeVisible();
        console.log('✓ Timeline section visible');
        
        // Check statistics cards
        const statCards = newPage.locator('.hvac-stat-card');
        await expect(statCards).toHaveCount(4);
        console.log('✓ All 4 statistics cards present');
        
        // Verify stat labels
        await expect(newPage.locator('text=Purchases Made')).toBeVisible();
        await expect(newPage.locator('text=Events Registered')).toBeVisible();
        await expect(newPage.locator('text=Events Attended')).toBeVisible();
        await expect(newPage.locator('text=Certificates Earned')).toBeVisible();
        console.log('✓ All statistics labels correct');
        
        // Check action buttons
        await expect(newPage.locator('.hvac-profile-actions').locator('text=Email Attendee')).toBeVisible();
        await expect(newPage.locator('.hvac-profile-actions').locator('text=Print Profile')).toBeVisible();
        await expect(newPage.locator('.hvac-profile-actions').locator('text=Back')).toBeVisible();
        console.log('✓ Action buttons present');
        
        await newPage.screenshot({ path: 'test-results/screenshots/attendee-profile-page.png' });
        await newPage.close();
      } else {
        console.log('⚠ No attendees available for profile testing');
      }
    }
  });

  test('Attendee Profile - Direct access with parameters', async ({ authenticatedPage: page }) => {
    test.setTimeout(20000);
    const actions = new CommonActions(page);
    
    // Test direct access without attendee_id
    await actions.navigateAndWait('/attendee-profile/');
    await expect(page.locator('text=No attendee specified')).toBeVisible();
    console.log('✓ Handles missing attendee_id correctly');
    
    // Test with invalid attendee_id
    await actions.navigateAndWait('/attendee-profile/?attendee_id=999999');
    await expect(page.locator('text=Attendee not found')).toBeVisible();
    console.log('✓ Handles invalid attendee_id correctly');
    
    await actions.screenshot('attendee-profile-errors');
  });

  test('Attendee Profile - Chart rendering', async ({ authenticatedPage: page }) => {
    test.setTimeout(30000);
    const actions = new CommonActions(page);
    
    // Navigate to Generate Certificates to find an attendee
    await actions.navigateAndWait('/generate-certificates/');
    
    const eventDropdown = page.locator('select[name="event_id"]');
    if (await eventDropdown.isVisible()) {
      await eventDropdown.selectOption({ index: 1 });
      await actions.waitForComplexAjax();
      
      const profileIcon = page.locator('.hvac-attendee-profile-icon').first();
      if (await profileIcon.count() > 0) {
        await profileIcon.click();
        
        // Switch to profile tab
        const profilePage = await page.context().waitForEvent('page');
        await profilePage.waitForLoadState('networkidle');
        
        // Check for chart container
        const chartSection = profilePage.locator('.hvac-timeline-chart-section');
        await expect(chartSection).toBeVisible();
        console.log('✓ Chart section visible');
        
        // Check for canvas element
        const canvas = profilePage.locator('#hvac-timeline-chart');
        await expect(canvas).toBeVisible();
        console.log('✓ Chart canvas present');
        
        // Wait for chart to potentially render
        await profilePage.waitForTimeout(2000);
        
        // Check if Chart.js is loaded
        const hasChart = await profilePage.evaluate(() => {
          return typeof window.Chart !== 'undefined';
        });
        expect(hasChart).toBeTruthy();
        console.log('✓ Chart.js library loaded');
        
        await profilePage.close();
      }
    }
  });

  test('Attendee Profile - Timeline interactions', async ({ authenticatedPage: page }) => {
    test.setTimeout(25000);
    const actions = new CommonActions(page);
    
    // Navigate to an attendee profile with activity
    await actions.navigateAndWait('/generate-certificates/');
    
    const eventDropdown = page.locator('select[name="event_id"]');
    if (await eventDropdown.isVisible()) {
      // Select an event that likely has checked-in attendees
      await eventDropdown.selectOption({ index: 1 });
      await actions.waitForComplexAjax();
      
      // Look for a checked-in attendee
      const checkedInRow = page.locator('tr:has-text("Checked In")').first();
      if (await checkedInRow.count() > 0) {
        const profileIcon = checkedInRow.locator('.hvac-attendee-profile-icon');
        await profileIcon.click();
        
        const profilePage = await page.context().waitForEvent('page');
        await profilePage.waitForLoadState('networkidle');
        
        // Check timeline items
        const timelineItems = profilePage.locator('.hvac-timeline-item');
        const itemCount = await timelineItems.count();
        
        if (itemCount > 0) {
          console.log(`✓ Found ${itemCount} timeline items`);
          
          // Check timeline item structure
          const firstItem = timelineItems.first();
          await expect(firstItem.locator('.hvac-timeline-date')).toBeVisible();
          await expect(firstItem.locator('.hvac-timeline-marker')).toBeVisible();
          await expect(firstItem.locator('.hvac-timeline-content')).toBeVisible();
          console.log('✓ Timeline item structure correct');
          
          // Check for different event types
          const registrationItem = profilePage.locator('.hvac-timeline-item[data-type="registration"]');
          if (await registrationItem.count() > 0) {
            console.log('✓ Registration events present');
          }
          
          const eventItem = profilePage.locator('.hvac-timeline-item[data-type="event"]');
          if (await eventItem.count() > 0) {
            console.log('✓ Event attendance items present');
          }
          
          const certificateItem = profilePage.locator('.hvac-timeline-item[data-type="certificate"]');
          if (await certificateItem.count() > 0) {
            console.log('✓ Certificate items present');
          }
        } else {
          console.log('⚠ No timeline items found');
        }
        
        await profilePage.close();
      } else {
        console.log('⚠ No checked-in attendees found for timeline testing');
      }
    }
  });

  test('Attendee Profile - Print functionality', async ({ authenticatedPage: page }) => {
    test.setTimeout(20000);
    const actions = new CommonActions(page);
    
    // Navigate to any attendee profile
    await actions.navigateAndWait('/generate-certificates/');
    const eventDropdown = page.locator('select[name="event_id"]');
    
    if (await eventDropdown.isVisible()) {
      await eventDropdown.selectOption({ index: 1 });
      await actions.waitForComplexAjax();
      
      const profileIcon = page.locator('.hvac-attendee-profile-icon').first();
      if (await profileIcon.count() > 0) {
        await profileIcon.click();
        
        const profilePage = await page.context().waitForEvent('page');
        await profilePage.waitForLoadState('networkidle');
        
        // Check print button
        const printButton = profilePage.locator('button:has-text("Print Profile")');
        await expect(printButton).toBeVisible();
        
        // Verify print CSS is loaded
        const hasPrintStyles = await profilePage.evaluate(() => {
          const styleSheets = Array.from(document.styleSheets);
          return styleSheets.some(sheet => {
            try {
              return sheet.href && sheet.href.includes('hvac-attendee-profile.css');
            } catch (e) {
              return false;
            }
          });
        });
        expect(hasPrintStyles).toBeTruthy();
        console.log('✓ Print styles loaded');
        
        await profilePage.close();
      }
    }
  });
});