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,64 @@
+import "@testing-library/jest-dom/vitest";
+import { lazy } from "react";
+import { act, cleanup, render, screen } from "@testing-library/react";
+import { afterEach, describe, expect, it, vi } from "vitest";
+import { LazyContent } from "../src/components/LazyContent";
+
+afterEach(() => {
+  cleanup();
+  vi.restoreAllMocks();
+});
+
+describe("LazyContent", () => {
+  it("keeps the surrounding app shell visible while a feature chunk loads", async () => {
+    let resolveModule: ((module: { default: () => React.JSX.Element }) => void) | undefined;
+    const Feature = lazy(
+      () =>
+        new Promise<{ default: () => React.JSX.Element }>((resolve) => {
+          resolveModule = resolve;
+        })
+    );
+
+    render(
+      <main>
+        <h1>Watermaps</h1>
+        <LazyContent
+          pending={<p role="status">Modul wird geladen …</p>}
+          failed={<p role="alert">Modul fehlt.</p>}
+        >
+          <Feature />
+        </LazyContent>
+      </main>
+    );
+
+    expect(screen.getByRole("heading", { name: "Watermaps" })).toBeVisible();
+    expect(screen.getByRole("status")).toHaveTextContent("Modul wird geladen");
+
+    await act(async () => {
+      resolveModule?.({ default: () => <section>Funktion bereit</section> });
+    });
+
+    expect(await screen.findByText("Funktion bereit")).toBeVisible();
+    expect(screen.queryByRole("status")).not.toBeInTheDocument();
+  });
+
+  it("contains a failed lazy import inside its local fallback", async () => {
+    vi.spyOn(console, "error").mockImplementation(() => undefined);
+    const BrokenFeature = lazy(() => Promise.reject(new Error("Chunk fehlt")));
+
+    render(
+      <main>
+        <h1>Watermaps</h1>
+        <LazyContent
+          pending={<p role="status">Modul wird geladen …</p>}
+          failed={<p role="alert">Modul konnte nicht geladen werden.</p>}
+        >
+          <BrokenFeature />
+        </LazyContent>
+      </main>
+    );
+
+    expect(await screen.findByRole("alert")).toHaveTextContent("nicht geladen");
+    expect(screen.getByRole("heading", { name: "Watermaps" })).toBeVisible();
+  });
+});