tony
43fe76158c
Mortar contribution checks / Mortar baseline and browser checks (push) Successful in 3m15s
55 lines
2.3 KiB
JavaScript
55 lines
2.3 KiB
JavaScript
import { test, expect } from "@playwright/test";
|
|
// Rendering and axe coverage for every export lives in mortar-fixtures.spec.mjs.
|
|
for (const theme of ["light", "dark"]) {
|
|
test(`Mortar menu keyboard and escape: ${theme}`, async ({ page }) => {
|
|
await page.goto(`/?component=Dropdown&theme=${theme}`);
|
|
const button = page.getByRole("button", { name: "Actions", exact: true });
|
|
await button.focus();
|
|
await page.keyboard.press("ArrowDown");
|
|
await expect(page.getByRole("menu")).toBeVisible();
|
|
await page.keyboard.press("Escape");
|
|
await expect(page.getByRole("menu")).toHaveCount(0);
|
|
await expect(button).toBeFocused();
|
|
});
|
|
test(`Mortar modal traps focus and restores it: ${theme}`, async ({
|
|
page,
|
|
}) => {
|
|
await page.goto(`/?component=Modal&theme=${theme}`);
|
|
const button = page.getByRole("button", { name: "Open dialog" });
|
|
await button.click();
|
|
const dialog = page.getByRole("dialog");
|
|
await expect(dialog).toHaveAttribute("aria-modal", "true");
|
|
for (let i = 0; i < 5; i++) {
|
|
await page.keyboard.press("Tab");
|
|
expect(
|
|
await dialog.evaluate((e) => e.contains(document.activeElement)),
|
|
).toBe(true);
|
|
}
|
|
await page.keyboard.press("Escape");
|
|
await expect(dialog).toHaveCount(0);
|
|
await expect(button).toBeFocused();
|
|
});
|
|
test(`Mortar controlled choice fields: ${theme}`, async ({ page }) => {
|
|
await page.goto(`/?component=Checkbox&theme=${theme}`);
|
|
const checkbox = page.getByRole("checkbox", {
|
|
name: "Email notifications",
|
|
});
|
|
await expect(checkbox).not.toBeChecked();
|
|
await checkbox.click();
|
|
await expect(checkbox).toBeChecked();
|
|
await page.goto(`/?component=Switch&theme=${theme}`);
|
|
const toggle = page.getByRole("switch", { name: "Automatic updates" });
|
|
await expect(toggle).not.toBeChecked();
|
|
await toggle.click();
|
|
await expect(toggle).toBeChecked();
|
|
await page.goto(`/?component=RadioGroup&theme=${theme}`);
|
|
const radio = page.getByRole("radio", { name: /Advanced/ });
|
|
await radio.click();
|
|
await expect(radio).toBeChecked();
|
|
await page.goto(`/?component=Select&theme=${theme}`);
|
|
const select = page.getByLabel("Environment", { exact: true });
|
|
await select.selectOption("second");
|
|
await expect(select).toHaveValue("second");
|
|
});
|
|
}
|