70 lines · 2.4 KB · TypeScript
RawDownload
import { ApprovalRequestId } from "@t3tools/contracts";import { renderToStaticMarkup } from "react-dom/server";import { describe, expect, it } from "vite-plus/test"; import { ComposerPendingUserInputPanel } from "./ComposerPendingUserInputPanel";import type { PendingUserInput } from "../../session-logic"; const prompt: PendingUserInput = {  requestId: ApprovalRequestId.make("request-1"),  createdAt: "2026-08-15T00:00:00.000Z",  questions: [    {      id: "question-1",      header: "Approach",      question: "Which approach should the migration take?",      options: [        { label: "Incremental", description: "Move one module at a time" },        { label: "Big bang", description: "Move everything in one release" },      ],      multiSelect: false,    },  ],  dismissible: true,}; function renderPanel(pendingUserInput: PendingUserInput = prompt) {  return renderToStaticMarkup(    <ComposerPendingUserInputPanel      pendingUserInputs={[pendingUserInput]}      respondingRequestIds={[]}      answers={{}}      questionIndex={0}      onToggleOption={() => {}}      onAdvance={() => {}}      onDismiss={() => {}}    />,  );} describe("ComposerPendingUserInputPanel", () => {  it("renders the header as a disclosure control for the question body", () => {    const markup = renderPanel();     const toggle = markup.match(/<button[^>]*data-pending-user-input-toggle="[^"]*"[^>]*>/)?.[0];    expect(toggle).toBeDefined();    expect(toggle).toContain('data-pending-user-input-toggle="expanded"');    expect(toggle).toContain('aria-expanded="true"');    expect(toggle).toContain('type="button"');     const controlledId = toggle?.match(/aria-controls="([^"]+)"/)?.[1];    expect(controlledId).toBeDefined();    expect(markup).toMatch(new RegExp(`<div[^>]*\\sid="${controlledId}"`));  });   it("offers dismiss only for async questions", () => {    expect(renderPanel()).toContain("data-pending-user-input-dismiss");    expect(renderPanel({ ...prompt, dismissible: false })).not.toContain(      "data-pending-user-input-dismiss",    );  });   it("starts expanded so the question and its options are visible", () => {    const markup = renderPanel();     expect(markup).toContain("Approach");    expect(markup).toContain("Which approach should the migration take?");    expect(markup).toContain("Incremental");    expect(markup).toContain("Big bang");  });});