38 lines
1.5 KiB
TypeScript
38 lines
1.5 KiB
TypeScript
import { test, expect } from '@playwright/test';
|
|
|
|
test.describe('Scenario 02: Theme Engine & UI Persistence', () => {
|
|
test('switches themes via real UI clicks and persists across page reloads', async ({ page }) => {
|
|
await page.goto('/');
|
|
await page.waitForLoadState('domcontentloaded');
|
|
|
|
const darkToggle = page.locator('[data-testid="theme-toggle-dark"]');
|
|
const lightToggle = page.locator('[data-testid="theme-toggle-light"]');
|
|
const softToggle = page.locator('[data-testid="theme-toggle-soft"]');
|
|
|
|
await expect(darkToggle).toBeVisible({ timeout: 15000 });
|
|
await expect(lightToggle).toBeVisible();
|
|
await expect(softToggle).toBeVisible();
|
|
|
|
// 1. Switch to Dark Theme
|
|
await darkToggle.click();
|
|
await expect(page.locator('html')).toHaveAttribute('data-theme', 'dark');
|
|
|
|
// 2. Reload and verify Dark Theme persistence
|
|
await page.reload();
|
|
await page.waitForLoadState('domcontentloaded');
|
|
await expect(page.locator('html')).toHaveAttribute('data-theme', 'dark');
|
|
|
|
// 3. Switch to Light Theme
|
|
await lightToggle.click();
|
|
await expect(page.locator('html')).toHaveAttribute('data-theme', 'light');
|
|
|
|
// 4. Switch to Soft Light Theme
|
|
await softToggle.click();
|
|
await expect(page.locator('html')).toHaveAttribute('data-theme', 'soft-light');
|
|
|
|
// 5. Reload and verify Soft Light Theme persistence
|
|
await page.reload();
|
|
await page.waitForLoadState('domcontentloaded');
|
|
await expect(page.locator('html')).toHaveAttribute('data-theme', 'soft-light');
|
|
});
|
|
});
|