import { test, expect } from '@playwright/test'; test.describe('หมวดการตั้งค่าและส่วนติดต่อผู้ใช้ (Settings & UI Theme)', () => { test('5.1 เปลี่ยนภาษาการแสดงผล (Localisation/i18n)', async ({ page }) => { await page.goto('/'); // ไปที่หน้าแรกปกติ // หาสวิตช์เปลี่ยนภาษา const langBtn = page.getByRole('button', { name: 'Language' }).or(page.locator('button').filter({ hasText: /TH|EN/ })).first(); // ลองกดสลับถ้ามีปุ่ม if (await langBtn.isVisible()) { await langBtn.click(); // เลือกเปลี่ยนเป็นภาษาอังกฤษ (สมมติตั้งต้นเป็นไทย) const englishOpt = page.locator('text=English, text=EN').first(); await englishOpt.click(); // ตรวจสอบว่าคำว่า "เข้าสู่ระบบ" (ไทย) ถูกแปลเป็น "Log in" หรือเมนูอื่นเป็นอังกฤษไปแล้ว const loginLink = page.locator('a[href*="login"], button').filter({ hasText: /Log in|Sign In/i }); await expect(loginLink).toBeVisible({ timeout: 5000 }); } }); test('5.2 เปลี่ยนโหมดมืดสว่าง (Theme Switcher)', async ({ page }) => { await page.goto('/'); // หาปุ่มสลับ Dark Mode / Light Mode (มักจะเป็นรูปพระอาทิตย์/พระจันทร์) const themeBtn = page.locator('.dark-mode-toggle, button[aria-label*="theme"]').first(); // ถ้ารองรับการเปลี่ยนตีม if (await themeBtn.isVisible()) { // ดึงคลาสของ ก่อนกด (เช่น '') const htmlBefore = await page.evaluate(() => document.documentElement.className); await themeBtn.click(); await page.waitForTimeout(500); // รอ animation เฟดนิดนึง // ดึงคลาส หลังกดอีกที const htmlAfter = await page.evaluate(() => document.documentElement.className); // คลาสของ HTML ต้องเปลี่ยนไป (เช่น เคยมี 'dark' แล้วโดนลบออก) expect(htmlBefore).not.toEqual(htmlAfter); } }); test.describe('การตั้งค่าบัญชี (Profile Settings)', () => { // แยกหมวดเล็กต้องล็อกอินเอาไว้ทดสอบหน้า My Profile test.beforeEach(async ({ page }) => { await page.goto('/auth/login'); await page.waitForTimeout(1500); await page.locator('input[type="email"]').fill('studentedtest@example.com'); await page.locator('input[type="password"]').fill('admin123'); await page.getByRole('button', { name: 'เข้าสู่ระบบ', exact: true }).click(); await page.waitForURL('**/dashboard', { timeout: 15000 }); }); test('5.3 แก้ไขและบันทึกข้อมูลส่วนตัว (Edit Profile)', async ({ page }) => { // เข้าไปที่หน้าการตั้งค่า หรือ Profile await page.goto('/dashboard/profile'); // ตรวจสอบว่ามีช่องกรอกชื่อ const nameInput = page.locator('input[type="text"]').first(); if (await nameInput.isVisible()) { const oldName = await nameInput.inputValue(); // ทดลองพิมพ์ตัวเลขต่อท้ายเข้าไปเพื่อจำลองการแก้ไข await nameInput.clear(); await nameInput.fill(`${oldName}แก้ไข`); // กดปุ่มบันทึกข้อมูล const saveBtn = page.getByRole('button', { name: 'บันทึกการเปลี่ยนแปลง', exact: false }) .or(page.locator('button').filter({ hasText: 'บันทึก' })).first(); await saveBtn.click(); // ตรวจสอบว่ามีแถบ Notification เด้งว่า "อัปเดตเรียบร้อย" const successNotify = page.locator('.q-notification__message, text=อัปเดตข้อมูลสำเร็จ').first(); await expect(successNotify).toBeVisible({ timeout: 5000 }); // (Clean up) อาจจะพิมพ์ชื่อเดิมกลับลงไปเพื่อไม่ให้ข้อมูลพัง } }); }); });