import { test, expect } from '@playwright/test';
import { login, logout, TEST_USER } from '../helpers/auth';

test.describe('Login Flow', () => {
  test.beforeEach(async ({ page }) => {
    // Start at login page
    await page.goto('/login');
  });

  test('should display login form', async ({ page }) => {
    // Verify login page elements are visible
    await expect(page.getByLabel(/email/i)).toBeVisible();
    await expect(page.getByLabel(/password/i)).toBeVisible();
    await expect(page.getByRole('button', { name: /log in|sign in|login/i })).toBeVisible();
  });

  test('should successfully login with valid credentials', async ({ page }) => {
    // Fill in credentials
    await page.getByLabel(/email/i).fill(TEST_USER.email);
    await page.getByLabel(/password/i).fill(TEST_USER.password);

    // Click login button
    await page.getByRole('button', { name: /log in|sign in|login/i }).click();

    // Should redirect to dashboard or app
    await expect(page).toHaveURL(/\/(app|dashboard)/, { timeout: 10000 });

    // Verify we see dashboard content
    await expect(page.locator('body')).toContainText(/dashboard|panel de control/i);
  });

  test('should show error with invalid email', async ({ page }) => {
    // Fill in invalid credentials
    await page.getByLabel(/email/i).fill('invalid@email.com');
    await page.getByLabel(/password/i).fill('wrongpassword');

    // Click login button
    await page.getByRole('button', { name: /log in|sign in|login/i }).click();

    // Should show error message
    await expect(page.locator('body')).toContainText(/invalid|incorrect|error|credenciales/i, {
      timeout: 5000,
    });

    // Should stay on login page
    await expect(page).toHaveURL(/\/login/);
  });

  test('should show validation error for empty email', async ({ page }) => {
    // Try to submit without email
    await page.getByLabel(/password/i).fill('somepassword');
    await page.getByRole('button', { name: /log in|sign in|login/i }).click();

    // Should show validation error (either inline or toast)
    const bodyText = await page.locator('body').textContent();
    expect(bodyText).toMatch(/required|obligatorio|necesario/i);
  });

  test('should show validation error for empty password', async ({ page }) => {
    // Try to submit without password
    await page.getByLabel(/email/i).fill('test@example.com');
    await page.getByRole('button', { name: /log in|sign in|login/i }).click();

    // Should show validation error
    const bodyText = await page.locator('body').textContent();
    expect(bodyText).toMatch(/required|obligatorio|necesario/i);
  });

  test('should toggle password visibility', async ({ page }) => {
    const passwordInput = page.getByLabel(/password/i);

    // Initially should be password type
    await expect(passwordInput).toHaveAttribute('type', 'password');

    // Look for toggle button (eye icon, "show password", etc.)
    const toggleButton = page.locator('button:has-text("Show"), button:has-text("Mostrar"), button[aria-label*="password"]').first();

    if (await toggleButton.isVisible()) {
      await toggleButton.click();

      // Should change to text type
      await expect(passwordInput).toHaveAttribute('type', 'text');

      // Toggle back
      await toggleButton.click();
      await expect(passwordInput).toHaveAttribute('type', 'password');
    }
  });

  test('should have link to registration page', async ({ page }) => {
    // Look for register/signup link
    const registerLink = page.getByRole('link', { name: /register|sign up|crear cuenta/i });

    if (await registerLink.isVisible()) {
      await expect(registerLink).toHaveAttribute('href', /\/register/);
    }
  });

  test('should redirect to app if already logged in', async ({ page, context }) => {
    // First login
    await login(page, TEST_USER);

    // Try to go to login page again
    await page.goto('/login');

    // Should redirect to app/dashboard
    await expect(page).toHaveURL(/\/(app|dashboard)/, { timeout: 5000 });
  });
});