Keep filter dropdowns clickable above active filter badges
All checks were successful
Deploy Sokko G / deploy (push) Successful in 19s
All checks were successful
Deploy Sokko G / deploy (push) Successful in 19s
This commit is contained in:
parent
a921c9ef02
commit
96af62edf0
3 changed files with 40 additions and 0 deletions
|
|
@ -1,6 +1,43 @@
|
|||
// Rôle : vérifie les variantes horizontales compactes et avancées des filtres de jeux.
|
||||
import { test, expect } from "@playwright/test";
|
||||
|
||||
for (const { game, category, width } of [
|
||||
{ game: "diablo4/affixes", category: "Catégories", width: 1920 },
|
||||
{ game: "diablo4/affixes", category: "Catégories", width: 900 },
|
||||
{ game: "diablo4/affixes", category: "Catégories", width: 768 },
|
||||
{ game: "aniimo/aniimos", category: "Rôles", width: 1920 }
|
||||
]) {
|
||||
test(`${game} dropdown receives clicks over active badges at ${width}px`, async ({ page }) => {
|
||||
await page.setViewportSize({ width, height: 900 });
|
||||
await page.goto(`/#/games/${game}`);
|
||||
const filters = page.locator('.nds-filter-panel[data-variant="horizontal-menu"]');
|
||||
await filters.getByRole("searchbox").fill("a");
|
||||
const badges = filters.locator(".nds-active-filters");
|
||||
await expect(badges).toBeVisible();
|
||||
await filters.getByRole("button", { name: category, exact: true }).click();
|
||||
const menu = page.getByRole("dialog", { name: new RegExp(`^${category}`) });
|
||||
const control = category === "Catégories"
|
||||
? menu.getByRole("radio", { name: "Ou", exact: true })
|
||||
: menu.getByRole("checkbox").first();
|
||||
const controlBox = await control.boundingBox();
|
||||
const badgesBox = await badges.boundingBox();
|
||||
const overlapTop = Math.max(controlBox.y, badgesBox.y);
|
||||
const overlapBottom = Math.min(controlBox.y + controlBox.height, badgesBox.y + badgesBox.height);
|
||||
expect(overlapBottom).toBeGreaterThan(overlapTop);
|
||||
|
||||
await control.click({
|
||||
position: { x: controlBox.width / 2, y: (overlapTop + overlapBottom) / 2 - controlBox.y },
|
||||
timeout: 3000
|
||||
});
|
||||
if (category === "Catégories") await expect(control).toHaveAttribute("aria-checked", "true");
|
||||
else await expect(control).toBeChecked();
|
||||
await expect(menu).toBeVisible();
|
||||
await page.keyboard.press("Escape");
|
||||
await badges.getByRole("button").first().click();
|
||||
await expect(filters.getByRole("searchbox")).toHaveValue("");
|
||||
});
|
||||
}
|
||||
|
||||
for (const width of [1920, 900]) {
|
||||
test(`MHW compact filters keep accessible tooltips at ${width}px`, async ({ page }) => {
|
||||
await page.setViewportSize({ width, height: 900 });
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue