Evandro Fonseca Junior
7b633f0f4a
Saem gsap, motion, clsx e tailwind-merge; entram server-only, @playwright/test e @axe-core/playwright. Suíte e2e (rotas, axe, teclado, navegação, sem JS, rolagem) rodável com pnpm test:e2e contra BASE_URL.
63 lines
2.0 KiB
TypeScript
63 lines
2.0 KiB
TypeScript
import { expect, test } from "@playwright/test";
|
|
import { DESKTOP } from "./helpers";
|
|
|
|
/**
|
|
* (c) Do topo da home, o Tab chega ao campo de nome do contato em no máximo 30 toques.
|
|
* O teste continua apertando Tab (até 120) depois do limite só para dizer, na falha, quantos toques faltavam.
|
|
*/
|
|
|
|
const MAX_TABS = 30;
|
|
const GIVE_UP_AFTER = 120;
|
|
|
|
test.use({ viewport: DESKTOP });
|
|
|
|
test(`Tab do topo da home chega ao campo de nome do contato em até ${MAX_TABS} toques`, async ({
|
|
page,
|
|
}) => {
|
|
await page.goto("/", { waitUntil: "load" });
|
|
await page.waitForTimeout(800);
|
|
// o foco começa no documento, como numa visita nova
|
|
await page.evaluate(() => (document.activeElement as HTMLElement)?.blur());
|
|
await page.evaluate(() => window.scrollTo({ top: 0, behavior: "instant" }));
|
|
|
|
const visited: string[] = [];
|
|
let reached = 0;
|
|
for (let tab = 1; tab <= GIVE_UP_AFTER; tab++) {
|
|
await page.keyboard.press("Tab");
|
|
const where = await page.evaluate(() => {
|
|
const element = document.activeElement as HTMLElement | null;
|
|
if (!element) return { isName: false, label: "(nada)" };
|
|
const label = (
|
|
element.getAttribute("aria-label") ||
|
|
element.textContent ||
|
|
element.getAttribute("name") ||
|
|
element.tagName
|
|
)
|
|
.trim()
|
|
.replace(/\s+/g, " ")
|
|
.slice(0, 40);
|
|
return {
|
|
isName:
|
|
element.getAttribute("name") === "name" &&
|
|
Boolean(element.closest("#contact")),
|
|
label: `${element.tagName.toLowerCase()} "${label}"`,
|
|
};
|
|
});
|
|
visited.push(`${tab}. ${where.label}`);
|
|
if (where.isName) {
|
|
reached = tab;
|
|
break;
|
|
}
|
|
}
|
|
|
|
expect(
|
|
reached,
|
|
`o campo de nome não apareceu nem em ${GIVE_UP_AFTER} Tabs`,
|
|
).toBeGreaterThan(0);
|
|
expect(
|
|
reached,
|
|
`o campo de nome só foi alcançado no Tab ${reached} (limite ${MAX_TABS}); passou por:\n${visited.join("\n")}`,
|
|
).toBeLessThanOrEqual(MAX_TABS);
|
|
await expect(page.locator("#contact input[name='name']")).toBeFocused();
|
|
});
|