chore: dependências e teste de ponta a ponta
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.
This commit is contained in:
1 parent
318a764190
commit
7b633f0f4a
12 files changed
+459
-94
No files matched your search
@@ -0,0 +1,62 @@
|
||||
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();
|
||||
});
|
||||
Reference in new issue
Block a user