Terminal im Geraetehaus mit Offline-Betrieb ergaenzen

Phase 4: eine eigene Oberflaeche unter /kiosk fuer das Wandtablet in der
Fahrzeughalle — mit Handschuhen bedienbar und arbeitsfaehig, wenn das Netz
weg ist.

Datenmodell: Fahrt, Anwesenheit, Waescheabgabe, Inventurgang,
Inventurposten, KioskVorgang und SyncKonflikt. Die Kennung eines Vorgangs
erzeugt der Browser beim Einreihen und ist damit der Idempotenzschluessel;
kommt derselbe Vorgang nach abgebrochener Uebertragung erneut an, erkennt
ihn der Server wieder. Die Datenbank setzt vier Regeln selbst durch und
verweigert UPDATE und DELETE auf kiosk_vorgang.

Offline: von Hand geschriebener Service Worker, Warteschlange in der
IndexedDB (Dexie), Fotos als Blob daneben, sichtbarer Zustand als Leiste
ueber allem. Was sich beim Nachtragen nicht anwenden laesst, landet als
Konflikt unter /terminal statt verworfen zu werden.

Dazu: Anmeldung per Ausweis, PIN oder signierter QR-Marke vom Handy,
Hallenmonitor mit optionalen DWD-Warnungen, Installation als App.

Behoben: die Warteschlange zog ihren Wiederholungstakt bei jedem Rendern
neu auf und haette einen liegen gebliebenen Vorgang nie ein zweites Mal
geschickt. Gefunden vom Offline-E2E-Test.

31 neue Tests (20 Unit, 11 gegen eine echte Datenbank, 9 E2E je Browser).

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>

scripts/screenshots.ts

@@ -15,7 +15,7 @@
 import "dotenv/config";
 import { mkdir } from "node:fs/promises";
 import path from "node:path";
-import { chromium, type Page } from "@playwright/test";
+import { chromium, type Browser, type Page } from "@playwright/test";
 
 const BASIS = process.env.E2E_BASIS_URL ?? "http://localhost:3100";
 const ZIEL = path.join(process.cwd(), "docs", "screenshots");
@@ -138,6 +138,38 @@ const AUFNAHMEN: Aufnahme[] = [
     beschreibung: "Übungen mit Thema und Teilnehmerzahl",
     angemeldet: true,
   },
+
+  // Phase 4 — Terminal im Gerätehaus
+  {
+    name: "25-kiosk-kacheln",
+    pfad: "/kiosk",
+    beschreibung: "Kachelschirm des Terminals",
+    angemeldet: true,
+  },
+  {
+    name: "26-kiosk-mangel",
+    pfad: "/kiosk/mangel",
+    beschreibung: "Mangel melden in drei Schritten",
+    angemeldet: true,
+  },
+  {
+    name: "27-kiosk-monitor",
+    pfad: "/kiosk/monitor",
+    beschreibung: "Hallenmonitor im Vollbild",
+    angemeldet: true,
+  },
+  {
+    name: "28-terminal-uebersicht",
+    pfad: "/terminal",
+    beschreibung: "Was am Terminal zusammenkommt — Sicht der Verwaltung",
+    angemeldet: true,
+  },
+  {
+    name: "29-anmeldemarke",
+    pfad: "/anmeldemarke",
+    beschreibung: "Anmeldemarke fürs Handy",
+    angemeldet: true,
+  },
 ];
 
 /**
@@ -276,10 +308,61 @@ async function portalAufnehmen(seite: Page, darstellung: string): Promise<void>
   }
 }
 
+/**
+ * Der Anmeldeschirm des Terminals.
+ *
+ * Braucht das Gegenteil aller anderen Aufnahmen: **keine** Sitzung, dafür ein
+ * eingerichtetes Gerät. Beides zusammen gibt es nur in einem eigenen Kontext,
+ * in dem vor dem ersten Aufruf die Geräteangaben im localStorage stehen.
+ */
+async function kioskAnmeldungAufnehmen(
+  browser: Browser,
+  darstellung: "light" | "dark",
+): Promise<void> {
+  const kontext = await browser.newContext({
+    viewport: { width: 1440, height: 900 },
+    deviceScaleFactor: 2,
+    locale: "de-DE",
+    timezoneId: "Europe/Berlin",
+    colorScheme: darstellung,
+  });
+
+  try {
+    await kontext.addInitScript(
+      (angaben: { schluessel: string; wehr: string }) => {
+        // Dieselben Schlüssel wie in lib/kiosk/geraet.ts.
+        window.localStorage.setItem("florian.kiosk.geraeteschluessel", angaben.schluessel);
+        window.localStorage.setItem("florian.kiosk.wehr", angaben.wehr);
+      },
+      {
+        schluessel: process.env.KIOSK_DEVICE_SECRET ?? "bitte_aendern_kiosk_geheimnis",
+        wehr: "ff-musterhausen",
+      },
+    );
+
+    const seite = await kontext.newPage();
+    await seite.goto(`${BASIS}/kiosk`, { waitUntil: "networkidle" });
+    await fertigGeladen(seite);
+
+    const datei = path.join(ZIEL, `30-kiosk-anmeldung-${darstellung}.png`);
+    await seite.screenshot({ path: datei, fullPage: true });
+    console.info(`[screenshots] Anmeldung am Terminal (${darstellung}) -> ${datei}`);
+  } catch (fehler) {
+    console.warn("[screenshots] Anmeldeschirm des Terminals fehlgeschlagen:", fehler);
+  } finally {
+    await kontext.close();
+  }
+}
+
 async function main(): Promise<void> {
   await mkdir(ZIEL, { recursive: true });
 
-  const browser = await chromium.launch();
+  const browser = await chromium.launch({
+    // Der Mangel-Wizard startet die Kamera von selbst. Ohne Gerät stünde dort
+    // eine Fehlermeldung; mit dem Testbild von Chromium zeigt das Bild, was am
+    // Tablet zu sehen ist.
+    args: ["--use-fake-ui-for-media-stream", "--use-fake-device-for-media-stream"],
+  });
 
   for (const darstellung of ["light", "dark"] as const) {
     const kontext = await browser.newContext({
@@ -344,6 +427,9 @@ async function main(): Promise<void> {
     await portalAufnehmen(seite, darstellung);
 
     await kontext.close();
+
+    // Eigener Kontext, weil dieser hier angemeldet ist.
+    await kioskAnmeldungAufnehmen(browser, darstellung);
   }
 
   await browser.close();