feat: Implement Playwright E2E tests for authentication, quiz, student account, and discovery, and add a new quiz page.

Frontend-Learner/tests/e2e/student-account.spec.ts

@@ -0,0 +1,118 @@
+import { test, expect } from '@playwright/test';
+
+const BASE_URL = process.env.E2E_BASE_URL ?? 'http://localhost:3000';
+
+async function waitAppSettled(page: any) {
+  await page.waitForLoadState('domcontentloaded');
+  await page.waitForLoadState('networkidle').catch(() => {});
+  await page.waitForTimeout(200);
+}
+
+// ฟังก์ชันจำลองล็อกอิน (เพื่อที่จะเข้า Dashboard ได้)
+async function setupLogin(page: any) {
+  await page.goto(`${BASE_URL}/auth/login`, { waitUntil: 'domcontentloaded' });
+  await waitAppSettled(page);
+  
+  await page.locator('input[type="email"]').or(page.getByRole('textbox', { name: /อีเมล|email/i })).first().fill('studentedtest@example.com');
+  await page.locator('input[type="password"]').or(page.getByRole('textbox', { name: /รหัสผ่าน|password/i })).first().fill('admin123');
+  await page.getByRole('button', { name: /เข้าสู่ระบบ|login/i }).or(page.locator('button[type="submit"]')).first().click();
+  
+  await page.waitForURL('**/dashboard', { timeout: 15_000 }).catch(() => {});
+  await waitAppSettled(page);
+}
+
+test.describe('ระบบพื้นที่ส่วนตัวผู้เรียน (Student Account / Portal)', () => {
+
+  test.describe('การตั้งค่าและส่วนติดต่อผู้ใช้ (Settings & UI Theme)', () => {
+    test('เปลี่ยนภาษาการแสดงผล (Localisation/i18n)', async ({ page }) => {
+      await page.goto(BASE_URL); 
+      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();
+
+        const loginLink = page.locator('a[href*="login"], button').filter({ hasText: /Log in|Sign In/i });
+        await expect(loginLink).toBeVisible({ timeout: 5000 });
+      }
+    });
+
+    test('เปลี่ยนโหมดมืดสว่าง (Theme Switcher)', async ({ page }) => {
+      await page.goto(BASE_URL);
+      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); 
+        const htmlAfter = await page.evaluate(() => document.documentElement.className);
+        expect(htmlBefore).not.toEqual(htmlAfter);
+      }
+    });
+  });
+
+  test.describe('ระบบหน้าแดชบอร์ดนักเรียน (Dashboard & My Courses)', () => {
+    test.beforeEach(async ({ page }) => {
+      await setupLogin(page);
+    });
+
+    test('หน้าแรกของ Dashboard โหลดได้ปกติ', async ({ page }) => {
+      await page.goto(`${BASE_URL}/dashboard`);
+      await page.waitForTimeout(1000);
+
+      const welcomeText = page.getByText(/ยินดีต้อนรับกลับ/i, { exact: false });
+      const profileSummary = page.locator('.q-avatar, img[alt*="Profile"], img[src*="avatar"]').first();
+
+      await expect(welcomeText.first().or(profileSummary)).toBeVisible({ timeout: 10_000 });
+    });
+
+    test('โหลดหน้า คอร์สของฉัน (My Courses)', async ({ page }) => {
+      await page.goto(`${BASE_URL}/dashboard/my-courses`);
+
+      const heading = page.locator('h2').filter({ hasText: /คอร์สของฉัน|My Courses/i }).first();
+      await expect(heading).toBeVisible();
+
+      const searchInput = page.getByPlaceholder(/ค้นหา|Search/i).first();
+      await expect(searchInput).toBeVisible({ timeout: 10_000 });
+      
+      await expect(page.locator('i.q-icon').filter({ hasText: 'grid_view' }).first()).toBeVisible();
+      await expect(page.locator('i.q-icon').filter({ hasText: 'view_list' }).first()).toBeVisible();
+    });
+
+    test('ลองค้นหาคอร์ส (Search Input) ไม่พบข้อมูล', async ({ page }) => {
+      await page.goto(`${BASE_URL}/dashboard/my-courses`);
+      
+      const searchInput = page.getByPlaceholder(/ค้นหา|Search/i).first();
+      await expect(searchInput).toBeVisible({ timeout: 10_000 });
+
+      await searchInput.fill('คอร์สที่ไม่มีอยู่จริงแน่นอน1234');
+
+      const emptyState = page.locator('h3').filter({ hasText: /ไม่พบ|ไม่เจอ|No result/i }).first()
+                           .or(page.locator('i.q-icon').filter({ hasText: 'search_off' }));
+      
+      await expect(emptyState.first()).toBeVisible({ timeout: 10_000 });
+    });
+
+    test('แก้ไขและบันทึกข้อมูลส่วนตัว (Edit Profile)', async ({ page }) => {
+      await page.goto(`${BASE_URL}/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: /บันทึก/i }).first();
+        if(await saveBtn.isVisible()) {
+          await saveBtn.click();
+          const successNotify = page.locator('.q-notification__message, text=อัปเดตข้อมูลสำเร็จ').first();
+          await expect(successNotify).toBeVisible({ timeout: 5000 }).catch(() => {});
+        }
+      }
+    });
+
+  });
+});