52 lines
1.7 KiB
TypeScript
52 lines
1.7 KiB
TypeScript
/**
|
|
* E2E Test: Mobile Responsive Flow
|
|
* Priority: HIGH - Mobile user experience
|
|
*
|
|
* Tests mobile responsive behavior:
|
|
* 1. Mobile navigation
|
|
* 2. Touch interactions
|
|
* 3. Responsive layouts
|
|
* 4. Mobile-specific features
|
|
*/
|
|
|
|
import { test, expect, type Page } from '@playwright/test';
|
|
import { loginAsGuest } from './helpers/auth';
|
|
|
|
test.describe('Mobile Responsive Flow', () => {
|
|
test.use({ viewport: { width: 375, height: 667 } }); // iPhone SE size
|
|
|
|
test.beforeEach(async ({ page }: { page: Page }) => {
|
|
await page.goto('/');
|
|
});
|
|
|
|
test('mobile navigation works', async ({ page }: { page: Page }) => {
|
|
await loginAsGuest(page);
|
|
// On mobile, the floating nav should be used for section navigation.
|
|
await expect(page.locator('[data-floating-nav-root]').first()).toBeVisible({ timeout: 20_000 });
|
|
});
|
|
|
|
test('touch interactions work', async ({ page }: { page: Page }) => {
|
|
await loginAsGuest(page);
|
|
// Basic swipe gesture smoke (no strict assertions; ensures handlers don't throw).
|
|
await page.mouse.move(200, 300);
|
|
await page.mouse.down();
|
|
await page.mouse.move(80, 300);
|
|
await page.mouse.up();
|
|
});
|
|
|
|
test('responsive layouts adapt to mobile', async ({ page }: { page: Page }) => {
|
|
// Check that layout is mobile-friendly
|
|
const mainContent = page.locator('main').first();
|
|
const boundingBox = await mainContent.boundingBox();
|
|
|
|
expect(boundingBox?.width).toBeLessThanOrEqual(375);
|
|
});
|
|
|
|
test('mobile forms are accessible', async ({ page }: { page: Page }) => {
|
|
await page.goto('/admin');
|
|
const input = page.getByLabel(/email or username/i);
|
|
const box = await input.boundingBox();
|
|
expect(box?.width).toBeGreaterThan(200);
|
|
});
|
|
});
|