Initial Watermaps import

2026-07-24 11:29:24 +02:00
commit 57f7b4dedb
129 changed files with 43136 additions and 0 deletions
@@ -0,0 +1,120 @@
+import "@testing-library/jest-dom/vitest";
+import { cleanup, fireEvent, render, screen, within } from "@testing-library/react";
+import { afterEach, describe, expect, it, vi } from "vitest";
+import {
+  NavigationToolRail,
+  type NavigationToolId
+} from "../src/components/NavigationToolRail";
+import { NavigationWorkspace } from "../src/components/NavigationWorkspace";
+
+afterEach(cleanup);
+
+describe("NavigationToolRail", () => {
+  it("renders the fixed tool order with accessible state and badge information", () => {
+    const onSelect = vi.fn<(tool: NavigationToolId) => void>();
+
+    render(
+      <NavigationToolRail
+        activeTool="conditions"
+        onSelect={onSelect}
+        workspaceId="test-workspace"
+        statuses={{
+          anchor: "alarm",
+          conditions: "active",
+          upcoming: "caution",
+          route: "stale"
+        }}
+        badges={{ upcoming: 123 }}
+      />
+    );
+
+    const rail = screen.getByRole("navigation", { name: "Kartenwerkzeuge" });
+    const buttons = within(rail).getAllByRole("button");
+    expect(buttons.map((button) => button.dataset.tool)).toEqual([
+      "anchor",
+      "conditions",
+      "upcoming",
+      "route"
+    ]);
+
+    const anchor = screen.getByRole("button", { name: /Ankerwache, Alarm, öffnen/ });
+    expect(anchor).toHaveAttribute("data-status", "alarm");
+    expect(anchor).toHaveAttribute("aria-controls", "test-workspace");
+    expect(anchor).toHaveAttribute("aria-expanded", "false");
+    expect(anchor).toHaveAttribute("aria-pressed", "false");
+
+    const conditions = screen.getByRole("button", {
+      name: /Wetter und Tide, aktiv, geöffnet/
+    });
+    expect(conditions).toHaveAttribute("aria-expanded", "true");
+    expect(conditions).toHaveAttribute("aria-pressed", "true");
+
+    const upcoming = screen.getByRole("button", {
+      name: /Als Nächstes, Warnung, 99\+ Hinweise, öffnen/
+    });
+    expect(upcoming).toHaveAttribute("data-status", "caution");
+    expect(within(upcoming).getByText("99+")).toBeVisible();
+
+    const route = screen.getByRole("button", { name: /Route, Daten veraltet, öffnen/ });
+    fireEvent.click(route);
+    expect(onSelect).toHaveBeenCalledWith("route");
+  });
+});
+
+describe("NavigationWorkspace", () => {
+  it("keeps compact content inaccessible and exposes controlled size and close actions", () => {
+    const onSheetStateChange = vi.fn();
+    const onClose = vi.fn();
+    const onBack = vi.fn();
+
+    const { container, rerender } = render(
+      <NavigationWorkspace
+        id="test-workspace"
+        activeTool="route"
+        title="Routenübersicht"
+        summary="12 sm bis zum Ziel"
+        status="active"
+        sheetState="compact"
+        presentation="bottom-sheet"
+        onSheetStateChange={onSheetStateChange}
+        onBack={onBack}
+        onClose={onClose}
+        footer={<button type="button">Navigation starten</button>}
+      >
+        <button type="button">Route bearbeiten</button>
+      </NavigationWorkspace>
+    );
+
+    const workspace = screen.getByRole("complementary", { name: "Routenübersicht" });
+    expect(workspace).toHaveAttribute("data-tool", "route");
+    expect(workspace).toHaveAttribute("data-status", "active");
+    expect(workspace).toHaveAttribute("data-presentation", "bottom-sheet");
+    expect(workspace).toHaveAttribute("data-sheet-state", "compact");
+    expect(container.querySelector(".navigation-workspace-body")).toHaveAttribute("hidden");
+    expect(container.querySelector(".navigation-workspace-footer")).toHaveAttribute("hidden");
+    expect(screen.queryByRole("button", { name: "Route bearbeiten" })).not.toBeInTheDocument();
+
+    fireEvent.click(
+      screen.getByRole("button", { name: "Arbeitsbereich auf halbe Höhe vergrößern" })
+    );
+    expect(onSheetStateChange).toHaveBeenCalledWith("half");
+    fireEvent.click(screen.getByRole("button", { name: "Zurück" }));
+    expect(onBack).toHaveBeenCalledTimes(1);
+    fireEvent.click(screen.getByRole("button", { name: "Route schließen" }));
+    expect(onClose).toHaveBeenCalledTimes(1);
+
+    rerender(
+      <NavigationWorkspace
+        id="test-workspace"
+        activeTool="route"
+        title="Routenübersicht"
+        sheetState="half"
+        onClose={onClose}
+      >
+        <button type="button">Route bearbeiten</button>
+      </NavigationWorkspace>
+    );
+    expect(screen.getByRole("button", { name: "Route bearbeiten" })).toBeVisible();
+    expect(container.querySelector(".navigation-workspace-body")).not.toHaveAttribute("hidden");
+  });
+});