elearning/Frontend-Learner/tests/e2e/browse.spec.ts

51 lines
2.9 KiB
TypeScript

import { test, expect } from '@playwright/test';
test.describe('หมวดหน้าค้นหาคอร์สและผลลัพธ์ (Discovery & Browse)', () => {
test('2.1 หน้าแรก (Landing Page) โหลดได้ปกติ', async ({ page }) => {
await page.goto('/');
// ยืนยันว่าหน้าเว็บขึ้นจริงๆ ด้วยการจับ Element พื้นฐานอย่าง Logo หรือ Footer หรือแบนเนอร์
// ตัวอย่างเช่นหาคำว่า "เริ่มเรียนฟรี" หรือหัวข้อแคมเปญที่คุณวางไว้หน้า Landing
const heroTitle = page.locator('h1, h2, .hero-title').first();
await expect(heroTitle).toBeVisible();
// เช็คว่าเมนูด้านบน (Navbar) หน้าหลักแสดงผล โดยเช็คจากโลโก้หรือส่วนหัว
const navBar = page.getByRole('link', { name: 'EduLearn Platform' }).first();
await expect(navBar).toBeVisible({ timeout: 10000 });
});
test('2.2 ค้นหาหลักสูตร (Search Course)', async ({ page }) => {
// ไปที่หน้ารวมคอร์ส
await page.goto('/browse');
// หาช่องค้นหา ด้วย placeholder
const searchInput = page.locator('input[placeholder="ค้นหาคอร์ส..."]').first();
// พิมพ์คำค้นหา
await searchInput.fill('การเขียนโปรแกรม');
await searchInput.press('Enter');
// 1) รอให้เว็บโหลดผลการค้นหา และตรวจสอบว่ามีการ์ดคอร์สขึ้น (Course Card)
const searchResults = page.locator('a[href^="/course/"]').first();
await expect(searchResults).toBeVisible();
});
test('2.3 ตัวกรองหมวดหมู่คอร์ส (Category Filter)', async ({ page }) => {
await page.goto('/browse');
// คลิกลองเลือกระบุหมวดหมู่ เช่น การออกแบบ
const categoryButton = page.locator('button').filter({ hasText: 'การออกแบบ' }).first();
if (await categoryButton.isVisible()) {
await categoryButton.click();
// ดูผลลัพธ์ว่าหน้าเว็บยังแสดงผลการ์ดอยู่ (อาจไม่ได้เปลี่ยน URL)
// ลบเช็ค toHaveURL ออกเพราะระบบอาจจะ filter ด้วย Client-Side แทน
const courseCard = page.locator('a[href^="/course/"]').first();
await expect(courseCard).toBeVisible();
}
});
});