Define semantic page action layouts

2026-08-19 13:33:51 +02:00
parent 5a2e99f496
commit c042244da8
18 changed files with 306 additions and 10 deletions
@@ -24,6 +24,25 @@ test("shared components remain accessible and keyboard operable", async ({ page
  await expect(page.getByRole("heading", { level: 1, name: "Zentrale GovOPlaN-Oberflächen" })).toBeVisible();
  await expectNoAccessibilityViolations(page);

+  const editorActions = page.getByRole("toolbar", { name: "Bearbeitungsaktionen" });
+  await expect(editorActions.getByRole("button")).toHaveText([
+    "Neu laden",
+    "Vorschau öffnen",
+    "Löschen",
+    "Verwerfen",
+    "Änderungen speichern"
+  ]);
+  await editorActions.getByRole("button", { name: "Neu laden" }).focus();
+  await page.keyboard.press("Tab");
+  await expect(editorActions.getByRole("button", { name: "Vorschau öffnen" })).toBeFocused();
+  await page.keyboard.press("Tab");
+  await expect(editorActions.locator(".disabled-action-tooltip")).toBeFocused();
+  await expect(page.getByRole("tooltip")).toContainText("Nur die federführende Stelle");
+  await page.keyboard.press("Tab");
+  await expect(editorActions.getByRole("button", { name: "Verwerfen" })).toBeFocused();
+  await page.keyboard.press("Tab");
+  await expect(editorActions.getByRole("button", { name: "Änderungen speichern" })).toBeFocused();
+
  const opener = page.getByTestId("open-dialog");
  await opener.focus();
  await page.keyboard.press("Enter");
@@ -71,5 +90,7 @@ test("narrow layout preserves task order without horizontal overflow", async ({
    .filter(({ left, right }) => left < -1 || right > window.innerWidth + 1)
    .slice(0, 20));
  expect(overflowing).toEqual([]);
+  await expect(page.locator("[data-page-action-archetype='editor'] [data-page-action-group='trailing']"))
+    .toHaveCSS("justify-content", "flex-end");
  await expect(page.locator("[data-conformance-id='shared-ui-lab']")).toHaveScreenshot("shared-ui-light-narrow.png", { animations: "disabled", maxDiffPixelRatio: 0.005 });
 });