Files
oh-my-pi/packages/collab-web/test/composer.test.tsx
T
can1357 e7be361148 fix(collab): isolated editor state to preserve draft input
- Extracted `AskEditor` into a standalone, key-bound component keyed by `reqId`.
- Preserved user-typed draft state across duplicate incoming host requests of the same ID.
- Reset the editor draft state only when a genuinely new request ID arrives.
- Simplified `Composer` autosizing logic and state orchestration by isolating editor-specific hooks.
- Adjusted integration tests to match HTML structure changes of the submit action.
2026-07-02 02:40:08 +02:00

80 lines
2.2 KiB
TypeScript

import { describe, expect, it } from "bun:test";
import { renderToStaticMarkup } from "react-dom/server";
import type { GuestSnapshot } from "../src/lib/client";
import { GuestClient } from "../src/lib/client";
import { Composer } from "../src/components/shell/Composer";
import { encodeBase64Url } from "../src/lib/link";
const LINK = `roomroomroom1234#${encodeBase64Url(new Uint8Array(32))}`;
const client = new GuestClient(LINK, "tester");
function snapshot(uiRequest: GuestSnapshot["uiRequest"]): GuestSnapshot {
return {
phase: "live",
endedReason: null,
header: null,
entries: [],
state: { isStreaming: true, queuedMessageCount: 0, cwd: "/work", participants: [] },
agents: [],
progress: new Map(),
lifecycle: new Map(),
stream: null,
streamDone: false,
activeTools: new Map(),
working: true,
readOnly: false,
uiRequest,
notices: [],
};
}
describe("Composer host UI requests", () => {
it("renders selectable ask responses for mobile guests", () => {
const html = renderToStaticMarkup(
<Composer
client={client}
snapshot={snapshot({
reqId: 1,
kind: "select",
title: "Continue?",
options: ["Yes", { label: "No", description: "Stop here" }],
selectionMarker: "radio",
})}
/>,
);
expect(html).toContain("Continue?");
expect(html).toContain("Yes");
expect(html).toContain("Stop here");
});
it("renders a submit field for custom ask responses", () => {
const html = renderToStaticMarkup(
<Composer client={client} snapshot={snapshot({ reqId: 2, kind: "editor", title: "Other", prefill: "draft" })} />,
);
expect(html).toContain("Other");
expect(html).toContain("draft");
expect(html).toContain("Submit");
});
it("keeps the editor submit enabled for whitespace-only drafts", () => {
const html = renderToStaticMarkup(
<Composer client={client} snapshot={snapshot({ reqId: 3, kind: "editor", title: "Other", prefill: " " })} />,
);
const submit = { found: false, disabled: false };
new HTMLRewriter()
.on('button[title="submit response"]', {
element(el) {
submit.found = true;
submit.disabled = el.hasAttribute("disabled");
},
})
.transform(html);
expect(submit.found).toBe(true);
expect(submit.disabled).toBe(false);
});
});