da021d0640
- Replaced static paths with dynamic locale subpaths (`/[locale]/*`) in imports, URLs, and assertions across tests. - Updated `next-intl` mocks for improved compatibility with `locale`-aware components. - Standardized `page.goto` and navigation tests with `/en` as the base locale for consistency.
84 lines
2.3 KiB
TypeScript
84 lines
2.3 KiB
TypeScript
/**
|
|
* E2E Tests for Theme Toggle
|
|
* Tests theme switching on public pages (login/register)
|
|
*/
|
|
|
|
import { test, expect } from '@playwright/test';
|
|
|
|
test.describe('Theme Toggle on Public Pages', () => {
|
|
test.beforeEach(async ({ page }) => {
|
|
// Clear localStorage before each test
|
|
await page.goto('/en/login');
|
|
await page.evaluate(() => localStorage.clear());
|
|
});
|
|
|
|
test('theme is applied on login page', async ({ page }) => {
|
|
await page.goto('/en/login');
|
|
|
|
// Wait for page to load and theme to be applied
|
|
await page.waitForTimeout(500);
|
|
|
|
// Check that a theme class is applied
|
|
const htmlElement = page.locator('html');
|
|
const className = await htmlElement.getAttribute('class');
|
|
|
|
// Should have either 'light' or 'dark' class
|
|
expect(className).toMatch(/light|dark/);
|
|
});
|
|
|
|
test('theme persists across page navigation', async ({ page }) => {
|
|
await page.goto('/en/login');
|
|
await page.waitForTimeout(500);
|
|
|
|
// Set theme to dark via localStorage
|
|
await page.evaluate(() => {
|
|
localStorage.setItem('theme', 'dark');
|
|
});
|
|
|
|
// Reload to apply theme
|
|
await page.reload();
|
|
await page.waitForTimeout(500);
|
|
|
|
// Verify dark theme is applied
|
|
await expect(page.locator('html')).toHaveClass(/dark/);
|
|
|
|
// Navigate to register page
|
|
await page.goto('/en/register');
|
|
await page.waitForTimeout(500);
|
|
|
|
// Theme should still be dark
|
|
await expect(page.locator('html')).toHaveClass(/dark/);
|
|
|
|
// Navigate to password reset
|
|
await page.goto('/en/password-reset');
|
|
await page.waitForTimeout(500);
|
|
|
|
// Theme should still be dark
|
|
await expect(page.locator('html')).toHaveClass(/dark/);
|
|
});
|
|
|
|
test('can switch theme programmatically', async ({ page }) => {
|
|
await page.goto('/en/login');
|
|
|
|
// Set to light theme
|
|
await page.evaluate(() => {
|
|
localStorage.setItem('theme', 'light');
|
|
});
|
|
await page.reload();
|
|
await page.waitForTimeout(500);
|
|
|
|
await expect(page.locator('html')).toHaveClass(/light/);
|
|
await expect(page.locator('html')).not.toHaveClass(/dark/);
|
|
|
|
// Switch to dark theme
|
|
await page.evaluate(() => {
|
|
localStorage.setItem('theme', 'dark');
|
|
});
|
|
await page.reload();
|
|
await page.waitForTimeout(500);
|
|
|
|
await expect(page.locator('html')).toHaveClass(/dark/);
|
|
await expect(page.locator('html')).not.toHaveClass(/light/);
|
|
});
|
|
});
|