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

const BASE_URL = process.env.E2E_BASE_URL ?? 'http://localhost:3000';

// ✅ หน้าจริงคือ /auth/forgot-password (อ้างอิงจากรูป)
const FORGOT_URL = `${BASE_URL}/auth/forgot-password`;

async function waitAppSettled(page: Page) {
  await page.waitForLoadState('domcontentloaded');
  await page.waitForLoadState('networkidle').catch(() => {});
  await page.waitForTimeout(200);
}

function emailInput(page: Page) {
  // เผื่อบางที input ไม่ได้ type=email แต่เป็น textbox ธรรมดา
  return page.locator('input[type="email"]').or(page.getByRole('textbox')).first();
}

function submitBtn(page: Page) {
  // ปุ่มในรูปเป็น “ส่งลิงก์รีเซ็ต”
  return page.getByRole('button', { name: /ส่งลิงก์รีเซ็ต/i }).first();
}

function backToLoginLink(page: Page) {
  // ในรูปเป็นลิงก์ “กลับไปหน้าเข้าสู่ระบบ”
  return page.getByRole('link', { name: /กลับไปหน้าเข้าสู่ระบบ/i }).first();
}

test.describe('หน้าลืมรหัสผ่าน (Forgot Password)', () => {
  test.beforeEach(async ({ page }) => {
    await page.goto(FORGOT_URL, { waitUntil: 'domcontentloaded' });
    await waitAppSettled(page);
  });

  test('3.1 โหลดหน้าลืมรหัสผ่านได้ครบถ้วน (Smoke Test)', async ({ page }) => {
    await expect(page.getByRole('heading', { name: /ลืมรหัสผ่าน/i })).toBeVisible();
    await expect(emailInput(page)).toBeVisible();
    await expect(submitBtn(page)).toBeVisible();
    await expect(backToLoginLink(page)).toBeVisible();

    await page.screenshot({ path: 'tests/e2e/screenshots/forgot-01-smoke.png', fullPage: true });
  });

  test('3.2 Validation: ใส่อีเมลภาษาไทยแล้วขึ้น Error', async ({ page }) => {
    await emailInput(page).fill('ฟฟฟฟ');

    // trigger blur
    await page.getByRole('heading', { name: /ลืมรหัสผ่าน/i }).click();

    // ข้อความจริงในระบบ “ห้ามใส่ภาษาไทย”
    const err = page.getByText(/ห้ามใส่ภาษาไทย/i).first();
    await expect(err).toBeVisible({ timeout: 10_000 });

    await page.screenshot({ path: 'tests/e2e/screenshots/forgot-02-thai-email.png', fullPage: true });
  });

  test('3.3 กดลิงก์กลับไปหน้า Login ได้', async ({ page }) => {
    await backToLoginLink(page).click();
    await page.waitForURL('**/auth/login', { timeout: 10_000 });
    await expect(page).toHaveURL(/\/auth\/login/i);

    await page.screenshot({ path: 'tests/e2e/screenshots/forgot-03-back-login.png', fullPage: true });
  });

  test('3.4 ทดลองส่งลิงก์รีเซ็ตรหัสผ่าน (API Mock)', async ({ page }) => {
    // ✅ ดัก request แบบกว้างขึ้น: POST ที่ URL มี forgot/reset
    await page.route('**/*', async (route) => {
      const req = route.request();
      const url = req.url();
      const method = req.method();

      const looksLikeForgotApi =
        method === 'POST' &&
        /forgot|reset/i.test(url) &&
        // กันไม่ให้ไป intercept asset
        !/\.(png|jpg|jpeg|webp|svg|css|js|map)$/i.test(url);

      if (looksLikeForgotApi) {
        await route.fulfill({
          status: 200,
          contentType: 'application/json',
          body: JSON.stringify({ success: true, data: { message: 'Reset link sent' } }),
        });
        return;
      }

      await route.continue();
    });

    await emailInput(page).fill('test@gmail.com');
    await submitBtn(page).click();

    // ✅ ตรวจหน้าสำเร็จตามที่คุณคาดหวัง
    await expect(page.getByText(/ส่งลิงก์เรียบร้อยแล้ว/i, { exact: false })).toBeVisible({ timeout: 10_000 });
    await expect(page.getByText(/กรุณาตรวจสอบกล่องจดหมาย/i, { exact: false })).toBeVisible();

    // ปุ่ม “ส่งอีกครั้ง” (ถ้ามี)
    await expect(page.getByRole('button', { name: /ส่งอีกครั้ง/i })).toBeVisible({ timeout: 10_000 }).catch(() => {});

    await page.screenshot({ path: 'tests/e2e/screenshots/forgot-04-mock-success.png', fullPage: true });
  });
});