@cosmicdrift/kumiko-renderer-web 0.33.0 → 0.34.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cosmicdrift/kumiko-renderer-web",
-  "version": "0.33.0",
+  "version": "0.34.1",
   "description": "Web-platform bindings for @cosmicdrift/kumiko-renderer. HTML default-primitives, browser history-based navigation, EventSource-backed live events, and a one-call createKumikoApp that mounts the whole stack via react-dom.",
   "license": "BUSL-1.1",
   "author": "Marc Frost <marc@cosmicdriftgamestudio.com>",

package/src/__tests__/kumiko-screen.test.tsx

@@ -7,7 +7,11 @@ import type {
 } from "@cosmicdrift/kumiko-framework/ui-types";
 import type { Dispatcher } from "@cosmicdrift/kumiko-headless";
 import type { FeatureSchema } from "@cosmicdrift/kumiko-renderer";
-import { DispatcherProvider, KumikoScreen } from "@cosmicdrift/kumiko-renderer";
+import {
+  DispatcherProvider,
+  ExtensionSectionsProvider,
+  KumikoScreen,
+} from "@cosmicdrift/kumiko-renderer";
 import userEvent from "@testing-library/user-event";
 import { createMockDispatcher, fireEvent, render, screen, waitFor } from "./test-utils";
 
@@ -160,6 +164,70 @@ describe("KumikoScreen", () => {
     });
   });
 
+  // Regression-Anker für den Set-Value-UI-Bug: die extension-section muss im
+  // Update-Mode die ECHTE entity-id bekommen — durch den vollen Flow
+  // (KumikoScreen → detail-load → EntityEditUpdateForm → RenderEdit → Mount).
+  // EntityEditUpdateForm lässt `id` bewusst aus den Form-values (id ist keine
+  // deklarierte Field), also reicht NUR der route-entityId-Durchgriff. Ohne
+  // ihn fiele die Section auf vm.id (=values["id"]=undefined) zurück und zeigte
+  // create-mode trotz Edit. Der alte render-edit-Test mockte `initial.id`
+  // manuell und war für genau diesen Flow blind — dieser Test rendert den
+  // realen detail-Pfad, der das in CI gefangen hätte.
+  test("entityEdit mit entityId → extension-section bekommt die echte entity-id (nicht create-mode)", async () => {
+    const editScreenWithExtension: EntityEditScreenDefinition = {
+      id: "task-edit-ext",
+      type: "entityEdit",
+      entity: "task",
+      layout: {
+        sections: [
+          { title: "Basics", fields: ["title"] },
+          {
+            kind: "extension",
+            title: "Custom Fields",
+            component: { react: { __component: "TaskCustomFields" } },
+          },
+        ],
+      },
+    };
+    const extSchema: FeatureSchema = {
+      featureName: "tasks",
+      entities: { task: taskEntity },
+      screens: [editScreenWithExtension],
+    };
+    const TaskCustomFields = ({
+      entityName,
+      entityId,
+    }: {
+      entityName: string;
+      entityId: string | null;
+    }) => (
+      <div data-testid="task-custom-fields">
+        {entityName}:{entityId ?? "(create)"}
+      </div>
+    );
+    const dispatcher = makeDispatcher({
+      // detail liefert die row MIT id — aber der Update-Form filtert id aus
+      // den Form-values; die Section darf trotzdem nicht in create-mode fallen.
+      query: (async () => ({
+        isSuccess: true,
+        data: { id: "task-1", version: 7, title: "loaded", count: 0, done: false },
+      })) as unknown as Dispatcher["query"],
+    });
+
+    render(
+      <DispatcherProvider dispatcher={dispatcher}>
+        <ExtensionSectionsProvider value={{ TaskCustomFields }}>
+          <KumikoScreen schema={extSchema} qn="tasks:screen:task-edit-ext" entityId="task-1" />
+        </ExtensionSectionsProvider>
+      </DispatcherProvider>,
+    );
+
+    await waitFor(() => expect(screen.queryByTestId("kumiko-screen-loading")).toBeNull());
+    const section = screen.getByTestId("task-custom-fields");
+    // Der Anker: echte route-id, NICHT "(create)". Vor dem Fix: "task:(create)".
+    expect(section.textContent).toBe("task:task-1");
+  });
+
   test("entityList onRowClick → Callback feuert mit Row-Viewmodel", async () => {
     const clicks: { id: string }[] = [];
     const dispatcher = makeDispatcher({
@@ -316,7 +384,7 @@ describe("KumikoScreen", () => {
           id: "archive",
           label: "actions.archive",
           handler: "tasks:write:task:archive",
-          payload: (row) => ({ id: row["id"], reason: "manual" }),
+          payload: { pick: ["id"] },
         },
       ],
     };
@@ -344,7 +412,7 @@ describe("KumikoScreen", () => {
     await waitFor(() => expect(writeCalls.length).toBe(1));
     expect(writeCalls[0]).toEqual({
       type: "tasks:write:task:archive",
-      payload: { id: "r1", reason: "manual" },
+      payload: { id: "r1" },
     });
   });
 
@@ -459,7 +527,7 @@ describe("KumikoScreen", () => {
           id: "edit",
           label: "actions.edit",
           screen: "task-edit",
-          params: (row) => ({ taskId: row["id"], priority: 5 }),
+          params: { map: { taskId: "id" } },
         },
       ],
     };
@@ -482,7 +550,7 @@ describe("KumikoScreen", () => {
     await waitFor(() => expect(navigateCalls.length).toBe(1));
     expect(navigateCalls[0]).toEqual({ screenId: "task-edit" });
     // params werden zu Strings serialisiert (URL-Layer kennt nur Strings).
-    expect(searchParamUpdates).toEqual([{ taskId: "r1", priority: "5" }]);
+    expect(searchParamUpdates).toEqual([{ taskId: "r1" }]);
     // Reihenfolge-Pin: erst navigate, dann setSearchParams.
     expect(calls.map((c) => c.kind)).toEqual(["navigate", "setSearchParams"]);
   });
@@ -522,7 +590,7 @@ describe("KumikoScreen", () => {
           id: "edit",
           label: "actions.edit",
           screen: "task-edit",
-          entityId: (row) => String(row["id"] ?? ""),
+          entityId: "id",
         },
       ],
     };
@@ -547,12 +615,10 @@ describe("KumikoScreen", () => {
     expect(searchParamUpdates).toEqual([]);
   });
 
-  // JSON-Schema-Fall (window.__KUMIKO_SCHEMA__): Function-Props wie
-  // action.entityId werden beim JSON-Roundtrip silent gedroppt. Zielt
-  // die navigate-Action auf einen entityEdit-Screen, MUSS row.id als
-  // deklarativer Default greifen — sonst öffnet der Edit im Create-Mode
-  // (Prod-e2e-Befund 2026-06-07 nach F1).
-  test("entityList rowActions kind=navigate auf entityEdit-Ziel: row.id ist der entityId-Default (JSON-Schema-sicher)", async () => {
+  // JSON-Schema-Fall (window.__KUMIKO_SCHEMA__): Declarative entityId: "id"
+  // überlebt JSON.stringify (String, kein Function-Drop). Das Schema
+  // funktioniert identisch ob direkt oder nach JSON-Roundtrip geladen.
+  test("entityList rowActions kind=navigate auf entityEdit-Ziel: entityId-String überlebt JSON-Roundtrip (JSON-Schema-sicher)", async () => {
     const navigateCalls: { screenId: string; entityId?: string }[] = [];
     const memoryNav = {
       route: { screenId: "task-list" },
@@ -583,10 +649,7 @@ describe("KumikoScreen", () => {
           id: "edit",
           label: "actions.edit",
           screen: "task-edit",
-          // entityId-Function ABSICHTLICH gesetzt und dann per
-          // JSON-Roundtrip gedroppt — exakt was buildAppSchema +
-          // JSON.stringify mit dem Schema im Browser machen.
-          entityId: (row) => String(row["id"] ?? ""),
+          entityId: "id",
         },
       ],
     };
@@ -786,7 +849,7 @@ describe("KumikoScreen", () => {
           id: "sync",
           label: "actions.sync",
           handler: "tasks:write:task:sync",
-          payload: () => ({ all: true }),
+          payload: { all: true },
         },
       ],
     };
@@ -898,8 +961,7 @@ describe("KumikoScreen", () => {
           id: "start",
           label: "actions.start",
           handler: "tasks:write:task:start",
-          // Nur sichtbar bei status===scheduled
-          visible: (row: unknown) => (row as { status?: string }).status === "scheduled",
+          visible: { field: "status", eq: "scheduled" },
         },
       ],
     };

package/src/__tests__/render-edit.test.tsx

@@ -36,8 +36,8 @@ function makeScreen(): EntityEditScreenDefinition {
             "isUrgent",
             {
               field: "notes",
-              visible: (d) => (d as { isUrgent?: boolean }).isUrgent === true,
-              required: (d) => (d as { isUrgent?: boolean }).isUrgent === true,
+              visible: { field: "isUrgent", eq: true },
+              required: { field: "isUrgent", eq: true },
             },
           ],
         },
@@ -229,6 +229,59 @@ describe("RenderEdit", () => {
     expect(mounted.textContent).toBe("order:row-42");
   });
 
+  // Realer Update-Flow: EntityEditUpdateForm lässt `id` BEWUSST aus den
+  // Form-values (id ist keine deklarierte Field) und reicht die route-id
+  // stattdessen über die entityId-prop durch. Ohne den entityId-prop-Pfad
+  // fiele die Section auf vm.id (=values["id"]=undefined) zurück → create-
+  // mode trotz Edit (der Set-Value-UI-Bug, #187..fix).
+  test("extension section uses the entityId prop when id is absent from form values", () => {
+    const screenDef: EntityEditScreenDefinition = {
+      id: "orders:screen:order-edit",
+      type: "entityEdit",
+      entity: "order",
+      layout: {
+        sections: [
+          { title: "Basics", columns: 2, fields: [{ field: "title", span: 2 }] },
+          {
+            kind: "extension",
+            title: "Custom Fields",
+            component: { react: { __component: "MyCustomFieldsForm" } },
+          },
+        ],
+      },
+    };
+    const MyCustomFieldsForm = ({
+      entityName,
+      entityId,
+    }: {
+      entityName: string;
+      entityId: string | null;
+    }) => (
+      <div data-testid="my-custom-fields-form">
+        {entityName}:{entityId ?? "(create)"}
+      </div>
+    );
+    render(
+      <DispatcherProvider dispatcher={makeDispatcher()}>
+        <ExtensionSectionsProvider value={{ MyCustomFieldsForm }}>
+          <RenderEdit<TestValues>
+            screen={screenDef}
+            entity={orderEntity}
+            featureName="orders"
+            // KEIN id in den values (wie der echte Update-Form), aber
+            // entityId-prop trägt die route-id.
+            initial={{ title: "Existing", count: 0, isUrgent: false } as TestValues}
+            entityId="order-99"
+            writeCommand="order:update"
+          />
+        </ExtensionSectionsProvider>
+      </DispatcherProvider>,
+    );
+
+    const mounted = screen.getByTestId("my-custom-fields-form");
+    expect(mounted.textContent).toBe("order:order-99");
+  });
+
   test("extension section without registered component shows the placeholder banner", () => {
     const screenDef: EntityEditScreenDefinition = {
       id: "orders:screen:order-edit",