root
64 lines
2.2 KiB
TypeScript
64 lines
2.2 KiB
TypeScript
import { expect, test } from '@playwright/test';
|
|
|
|
const scenarios = [
|
|
{
|
|
name: 'desktop-en-light',
|
|
locale: 'en',
|
|
theme: 'light',
|
|
viewport: { width: 1440, height: 1000 },
|
|
},
|
|
{ name: 'desktop-en-dark', locale: 'en', theme: 'dark', viewport: { width: 1440, height: 1000 } },
|
|
{ name: 'tablet-fr-light', locale: 'fr', theme: 'light', viewport: { width: 1024, height: 900 } },
|
|
{ name: 'tablet-fr-dark', locale: 'fr', theme: 'dark', viewport: { width: 1024, height: 900 } },
|
|
{ name: 'mobile-ar-light', locale: 'ar', theme: 'light', viewport: { width: 390, height: 844 } },
|
|
{ name: 'mobile-ar-dark', locale: 'ar', theme: 'dark', viewport: { width: 390, height: 844 } },
|
|
] as const;
|
|
|
|
for (const scenario of scenarios) {
|
|
test(`${scenario.name} visual baseline`, async ({ page, context }) => {
|
|
test.skip(
|
|
test.info().project.name !== 'chromium',
|
|
'Canonical visual baselines use Chromium; other projects run functional coverage.',
|
|
);
|
|
await page.setViewportSize(scenario.viewport);
|
|
await context.addCookies([
|
|
{
|
|
name: 'hpc-theme',
|
|
value: scenario.theme,
|
|
domain: '127.0.0.1',
|
|
path: '/',
|
|
secure: false,
|
|
sameSite: 'Lax',
|
|
},
|
|
]);
|
|
await page.goto(`/${scenario.locale}`);
|
|
await expect(page).toHaveScreenshot(`${scenario.name}.png`, { fullPage: true });
|
|
});
|
|
}
|
|
|
|
test('mobile navigation open baseline', async ({ page }) => {
|
|
test.skip(test.info().project.name !== 'chromium');
|
|
await page.setViewportSize({ width: 390, height: 844 });
|
|
await page.context().addCookies([
|
|
{
|
|
name: 'hpc-theme',
|
|
value: 'dark',
|
|
domain: '127.0.0.1',
|
|
path: '/',
|
|
secure: false,
|
|
sameSite: 'Lax',
|
|
},
|
|
]);
|
|
await page.goto('/ar');
|
|
await page.getByRole('button', { name: 'فتح قائمة التنقل' }).click();
|
|
await expect(page).toHaveScreenshot('mobile-ar-dark-navigation-open.png', { fullPage: true });
|
|
});
|
|
|
|
test('keyboard focus baseline', async ({ page }) => {
|
|
test.skip(test.info().project.name !== 'chromium');
|
|
await page.setViewportSize({ width: 1440, height: 900 });
|
|
await page.goto('/en');
|
|
await page.keyboard.press('Tab');
|
|
await expect(page).toHaveScreenshot('desktop-en-light-focus.png', { fullPage: true });
|
|
});
|