import { test, expect } from '@playwright/test';

test.describe('Smoke Tests', () => {
  test('application loads successfully', async ({ page }) => {
    await page.goto('/');
    
    // Should either show login page or dashboard
    const hasLogin = await page.locator('text=Sign in to your account').isVisible();
    const hasDashboard = await page.locator('text=Dashboard').isVisible();
    
    expect(hasLogin || hasDashboard).toBeTruthy();
    
    await page.screenshot({ 
      path: 'screenshots/smoke_application_loads.png',
      fullPage: true
    });
  });

  test('login page elements are present', async ({ page }) => {
    await page.goto('/login');
    
    // Check for key elements
    await expect(page.locator('h1')).toContainText('Black Canyon Tickets');
    await expect(page.locator('input[name="email"]')).toBeVisible();
    await expect(page.locator('input[name="password"]')).toBeVisible();
    await expect(page.locator('button[type="submit"]')).toBeVisible();
    
    // Check for demo accounts
    await expect(page.locator('text=Demo Accounts')).toBeVisible();
    await expect(page.locator('text=Sarah Admin')).toBeVisible();
    
    await page.screenshot({ 
      path: 'screenshots/smoke_login_elements.png',
      fullPage: true
    });
  });

  test('theme toggle works', async ({ page }) => {
    await page.goto('/login');
    
    // Look for theme toggle button (sun or moon icon)
    const themeButton = page.locator('button[aria-label*="theme"], button[aria-label*="Theme"]').first();
    
    if (await themeButton.isVisible()) {
      await themeButton.click();
      await page.waitForTimeout(500);
      
      await page.screenshot({ 
        path: 'screenshots/smoke_theme_toggle.png',
        fullPage: true
      });
    } else {
      console.log('Theme toggle not found - may need to be implemented');
    }
  });

  test('basic authentication flow works', async ({ page }) => {
    await page.goto('/login');
    
    // Use demo account
    await page.click('text=Sarah Admin');
    
    // Verify form is filled
    await expect(page.locator('input[name="email"]')).toHaveValue('admin@example.com');
    await expect(page.locator('input[name="password"]')).toHaveValue('demo123');
    
    // Submit form
    await page.click('button[type="submit"]');
    
    // Wait for navigation
    await page.waitForURL(/\/(dashboard|$)/, { timeout: 10000 });
    
    // Should show user info
    await expect(page.locator('text=Sarah Admin')).toBeVisible();
    
    await page.screenshot({ 
      path: 'screenshots/smoke_auth_success.png',
      fullPage: true
    });
  });

  test('responsive layout works', async ({ page }) => {
    // Test mobile layout
    await page.setViewportSize({ width: 375, height: 667 });
    await page.goto('/login');
    
    await page.screenshot({ 
      path: 'screenshots/smoke_mobile_layout.png',
      fullPage: true
    });
    
    // Test desktop layout
    await page.setViewportSize({ width: 1280, height: 720 });
    await page.reload();
    
    await page.screenshot({ 
      path: 'screenshots/smoke_desktop_layout.png',
      fullPage: true
    });
  });
});