fix(ui): show workspace readiness dot and bounded session accordions

2026-09-13 17:39:33 +02:00
parent 9051463654
commit 571a4bcaa2
9 changed files with 191 additions and 34 deletions
@@ -103,6 +103,55 @@ async function inspect(page: Page) {
  });
 }

+for (const width of [390, 1280]) {
+  test(`session navigation has readiness dot and bounded accordion lists at ${width}px`, async ({ page }, testInfo) => {
+    await page.setViewportSize({ width, height: 1000 });
+    const writes = await fixtures(page);
+    const sessions = Array.from({ length: 80 }, (_, index) => ({
+      id: `nav-${index}`, name: `Session ${index}`, question: `Question ${index}`,
+      archived: index >= 40, active: false, status: index >= 40 ? "finalized" : "open",
+      workspace, group: null, author: null, summary: null,
+      created_at: "2026-09-01T12:00:00Z", updated_at: null,
+    }));
+    await page.route("**/api/sessions?*", route => route.fulfill({ json: sessions }));
+    await page.route("**/api/sessions", route => route.fulfill({ json: sessions }));
+    await page.goto("/");
+    await navigation(page);
+    await page.getByRole("button", { name: "Administration", exact: true }).click();
+    const workspaceButton = page.getByRole("button", { name: "Workspace", exact: true });
+    await expect(workspaceButton.getByRole("img")).toHaveAttribute("data-ready", "true");
+    await expect(workspaceButton).toHaveAccessibleDescription("Workspace readiness: ready");
+    await expect(page.getByText("Workspace readiness: ready", { exact: true })).toHaveCount(0);
+    const green = await workspaceButton.getByRole("img").evaluate(el => getComputedStyle(el).backgroundColor);
+    const active = page.getByRole("button", { name: "Active sessions", exact: true });
+    const archive = page.getByRole("button", { name: "Archive (40)", exact: true });
+    await expect(active).toHaveAttribute("aria-expanded", "true");
+    await expect(archive).toHaveAttribute("aria-expanded", "false");
+    await archive.click();
+    for (const name of ["Active sessions", "Archive (40)"]) {
+      const panel = page.getByRole("region", { name, exact: true });
+      await expect(panel).toHaveCSS("overflow-y", "auto");
+      const dimensions = await panel.evaluate(el => ({ height: el.getBoundingClientRect().height, scroll: el.scrollHeight, client: el.clientHeight }));
+      expect(dimensions.height).toBeLessThanOrEqual(288);
+      expect(dimensions.client).toBeGreaterThan(30);
+      expect(dimensions.scroll).toBeGreaterThan(dimensions.client);
+      const box = await panel.boundingBox();
+      expect(box!.y + box!.height).toBeLessThanOrEqual(1000);
+      await panel.evaluate(el => { el.scrollTop = el.scrollHeight; });
+      expect(await panel.evaluate(el => el.scrollTop)).toBeGreaterThan(0);
+    }
+    await page.screenshot({ path: testInfo.outputPath("session-accordions.png"), animations: "disabled" });
+    await expect(archive).toBeInViewport();
+    expect((await inspect(page)).overflow).toBe(0);
+    // A refetch failure must not keep a stale green signal.
+    await page.route("**/api/workspaces/*/preprocessing", route => route.fulfill({ status: 503, json: { error: "Fixture unavailable" } }));
+    await expect(workspaceButton.getByRole("img")).toHaveAttribute("data-ready", "false", { timeout: 15000 });
+    await expect(workspaceButton).toHaveAccessibleDescription("Workspace readiness: unavailable");
+    expect(await workspaceButton.getByRole("img").evaluate(el => getComputedStyle(el).backgroundColor)).not.toBe(green);
+    expect(writes).toEqual([]);
+  });
+}
+
 for (const width of [390, 1280, 2400]) {
  test(`knowledge readers use available width and readable paragraphs at ${width}px`, async ({ page }, testInfo) => {
    await page.setViewportSize({ width, height: 1100 });