wehub-resource-sync
91 lines
2.3 KiB
TypeScript
91 lines
2.3 KiB
TypeScript
/**
|
||
* Responsive Test Specs — T-39
|
||
*
|
||
* Test specifications for Playwright responsive testing.
|
||
* These define the viewports and pages to test.
|
||
*
|
||
* Usage with Playwright:
|
||
* import { VIEWPORTS, PAGES, generateTestMatrix } from "./responsiveSpecs";
|
||
*
|
||
* @module tests/e2e/responsiveSpecs
|
||
*/
|
||
|
||
/**
|
||
* Viewport definitions for responsive testing.
|
||
*/
|
||
export const VIEWPORTS = {
|
||
mobile: { width: 375, height: 812, label: "Mobile (375px)" },
|
||
tablet: { width: 768, height: 1024, label: "Tablet (768px)" },
|
||
desktop: { width: 1280, height: 800, label: "Desktop (1280px)" },
|
||
};
|
||
|
||
/**
|
||
* Pages to test with responsive viewports.
|
||
*/
|
||
export const PAGES = [
|
||
{ path: "/login", name: "Login", requiresAuth: false },
|
||
{ path: "/dashboard", name: "Dashboard", requiresAuth: true },
|
||
{ path: "/dashboard/providers", name: "Providers", requiresAuth: true },
|
||
{ path: "/dashboard/settings", name: "Settings", requiresAuth: true },
|
||
];
|
||
|
||
/**
|
||
* Accessibility checks to perform on each page.
|
||
*/
|
||
export const A11Y_CHECKS = [
|
||
{
|
||
id: "overflow-x",
|
||
kind: "evaluate",
|
||
evaluate: () => document.body.scrollWidth <= document.documentElement.clientWidth,
|
||
criteria: "No horizontal overflow (scrollWidth <= clientWidth)",
|
||
description: "No horizontal overflow",
|
||
},
|
||
{
|
||
id: "touch-targets",
|
||
kind: "manual",
|
||
criteria: "Minimum 44px touch targets on mobile",
|
||
description: "Touch targets ≥ 44px",
|
||
},
|
||
{
|
||
id: "font-size",
|
||
kind: "manual",
|
||
criteria: "Minimum 16px base font on mobile",
|
||
description: "Base font ≥ 16px",
|
||
},
|
||
{
|
||
id: "viewport-meta",
|
||
kind: "manual",
|
||
criteria: "Viewport meta tag is present",
|
||
description: "Viewport meta present",
|
||
},
|
||
];
|
||
|
||
/**
|
||
* Generate test matrix (viewport × page combinations).
|
||
*
|
||
* @returns {Array<{ viewport: typeof VIEWPORTS.mobile, page: typeof PAGES[0], testName: string }>}
|
||
*/
|
||
export function generateTestMatrix() {
|
||
const matrix = [];
|
||
|
||
for (const [vpKey, viewport] of Object.entries(VIEWPORTS)) {
|
||
for (const page of PAGES) {
|
||
matrix.push({
|
||
viewport,
|
||
page,
|
||
testName: `${page.name} @ ${viewport.label}`,
|
||
});
|
||
}
|
||
}
|
||
|
||
return matrix;
|
||
}
|
||
|
||
/**
|
||
* Get viewport names.
|
||
* @returns {string[]}
|
||
*/
|
||
export function getViewportNames() {
|
||
return Object.keys(VIEWPORTS);
|
||
}
|