@cosmicdrift/kumiko-renderer-web 0.34.0 → 0.34.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cosmicdrift/kumiko-renderer-web",
-  "version": "0.34.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({

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

@@ -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",