root
46 lines
1.7 KiB
TypeScript
46 lines
1.7 KiB
TypeScript
import { expect, test } from '@playwright/test';
|
|
|
|
for (const locale of ['en', 'fr', 'ar'] as const) {
|
|
test(`${locale} component fixture renders without horizontal overflow`, async ({ page }) => {
|
|
await page.goto(`/${locale}/component-lab`);
|
|
await expect(page.locator('h1')).toBeVisible();
|
|
const overflow = await page.evaluate(
|
|
() => document.documentElement.scrollWidth > document.documentElement.clientWidth,
|
|
);
|
|
expect(overflow).toBe(false);
|
|
await expect(page.locator('html')).toHaveAttribute('dir', locale === 'ar' ? 'rtl' : 'ltr');
|
|
});
|
|
}
|
|
|
|
test('component controls support keyboard interaction and dialog focus return', async ({
|
|
page,
|
|
}) => {
|
|
await page.goto('/en/component-lab');
|
|
const firstTab = page.getByRole('tab', { name: 'Reservations' });
|
|
await firstTab.focus();
|
|
await page.keyboard.press('ArrowRight');
|
|
await expect(page.getByRole('tab', { name: 'Fleet availability' })).toHaveAttribute(
|
|
'aria-selected',
|
|
'true',
|
|
);
|
|
|
|
const trigger = page.getByRole('button', { name: 'Open dialog' });
|
|
await trigger.click();
|
|
await expect(page.getByRole('dialog')).toBeVisible();
|
|
await page.keyboard.press('Escape');
|
|
await expect(page.getByRole('dialog')).toBeHidden();
|
|
await expect(trigger).toBeFocused();
|
|
});
|
|
|
|
test('component fixture reflows at narrow mobile and 200 percent zoom equivalent', async ({
|
|
page,
|
|
}) => {
|
|
await page.setViewportSize({ width: 320, height: 800 });
|
|
await page.goto('/fr/component-lab');
|
|
await page.evaluate(() => (document.body.style.zoom = '2'));
|
|
const overflow = await page.evaluate(
|
|
() => document.documentElement.scrollWidth > document.documentElement.clientWidth + 1,
|
|
);
|
|
expect(overflow).toBe(false);
|
|
});
|