102 lines
4.6 KiB
TypeScript
102 lines
4.6 KiB
TypeScript
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 });
|
|
});
|
|
});
|