spb/phi-conseil

1import { test, expect } from "./fixtures";23test.describe("menu mobile", () => {4  test("ouverture, navigation clavier, fermeture Échap", async ({ page, isMobile }) => {5    test.skip(!isMobile, "mobile uniquement");6    await page.goto("/");7    const opener = page.getByRole("button", { name: "Ouvrir le menu" });8    await expect(opener).toBeVisible();9    await opener.click();10    const dialog = page.getByRole("dialog");11    await expect(dialog).toBeVisible();12    // Le panneau doit couvrir tout l’écran (régression : confiné à l’en-tête par backdrop-filter)13    const box = await dialog.boundingBox();14    const vp = page.viewportSize()!;15    expect(box?.width).toBeGreaterThanOrEqual(vp.width - 1);16    expect(box?.height).toBeGreaterThanOrEqual(vp.height - 1);17    await expect(dialog.getByRole("link", { name: "Nos services" })).toBeVisible();18    await expect(page.getByRole("button", { name: "Fermer le menu" })).toBeFocused();19    await page.keyboard.press("Escape");20    await expect(dialog).toBeHidden();21    await expect(opener).toBeFocused();22    await opener.click();23    await dialog.getByRole("link", { name: "À propos" }).click();24    await expect(page).toHaveURL(/\/a-propos$/);25    await expect(page.getByRole("dialog")).toBeHidden();26  });27});2829test.describe("responsive", () => {30  for (const width of [360, 390, 768, 1024, 1440, 1920]) {31    test(`aucun débordement horizontal à ${width} px`, async ({ page, isMobile }) => {32      test.skip(isMobile, "largeurs forcées sur le projet desktop");33      await page.setViewportSize({ width, height: 900 });34      for (const r of ["/", "/nous-joindre", "/services"]) {35        await page.goto(r);36        const overflow = await page.evaluate(37          () => document.documentElement.scrollWidth - document.documentElement.clientWidth,38        );39        expect(overflow, `${r} @ ${width}`).toBeLessThanOrEqual(0);40      }41    });42  }43});44