import { test, expect, Page } from '@playwright/test';
import { LoginPage } from './pages/LoginPage';
import { EventSummaryPage } from './pages/EventSummaryPage';
import * as fs from 'fs';
import * as path from 'path';

test.describe('Event Summary Page Detailed Analysis', () => {
  const screenshotsDir = path.join(__dirname, 'screenshots');
  
  test.beforeAll(async () => {
    if (!fs.existsSync(screenshotsDir)) {
      fs.mkdirSync(screenshotsDir, { recursive: true });
    }
  });

  test('Analyze event summary page content and tickets data', async ({ page }) => {
    // Set viewport size
    await page.setViewportSize({ width: 1280, height: 800 });
    
    // Login
    const loginPage = new LoginPage(page);
    await loginPage.navigate();
    await loginPage.login('test_trainer', 'Test123!');
    console.log('Successfully logged in as test_trainer');
    
    // Navigate to event summary page
    const eventSummaryPage = new EventSummaryPage(page);
    await eventSummaryPage.navigateToEventSummary('5484');
    console.log('Navigated to event summary page for event ID 5484');
    
    // Take screenshot of the full page
    const fullPagePath = path.join(screenshotsDir, 'event-summary-full.png');
    await page.screenshot({ path: fullPagePath, fullPage: true });
    console.log(`Full event summary screenshot saved to: ${fullPagePath}`);
    
    // Get event details
    const eventDetails = await eventSummaryPage.getEventDetails();
    console.log('Event Details:', eventDetails);
    
    // Check for ticket information elements manually
    const ticketInfoExists = await page.locator('.ticket-info').isVisible();
    console.log(`Ticket info section exists: ${ticketInfoExists}`);
    
    // Check for transactions table
    const transactionsTableExists = await eventSummaryPage.isTransactionsTableVisible();
    console.log(`Transactions table exists: ${transactionsTableExists}`);
    
    // Check for any elements that might contain ticket or attendee data
    const attendeeElements = await page.locator('*:has-text("Attendee")').count();
    console.log(`Number of elements containing "Attendee": ${attendeeElements}`);
    
    const ticketElements = await page.locator('*:has-text("Ticket")').count();
    console.log(`Number of elements containing "Ticket": ${ticketElements}`);

    // Look for any data tables on the page
    const tables = await page.locator('table').count();
    console.log(`Number of tables on the page: ${tables}`);
    
    // Take separate screenshots of each section
    if (await page.locator('.event-details').isVisible()) {
      await page.locator('.event-details').screenshot({ 
        path: path.join(screenshotsDir, 'event-details-section.png')
      });
      console.log('Took screenshot of event details section');
    }
    
    if (tables > 0) {
      for (let i = 0; i < tables; i++) {
        const tableElement = page.locator('table').nth(i);
        if (await tableElement.isVisible()) {
          await tableElement.screenshot({
            path: path.join(screenshotsDir, `table-${i}.png`)
          });
          console.log(`Took screenshot of table ${i}`);
        }
      }
    }
  });
});