@akiojin/gwt 4.10.0 → 4.12.0

package/src/cli/ui/__tests__/solid/LogScreen.test.tsx

@@ -0,0 +1,351 @@
+/** @jsxImportSource @opentui/solid */
+import { describe, expect, it, mock } from "bun:test";
+import { testRender } from "@opentui/solid";
+import { parseColor } from "@opentui/core";
+import { createSignal } from "solid-js";
+import type { FormattedLogEntry } from "../../../../logging/formatter.js";
+
+const makeEntry = (
+  message: string,
+  overrides: Partial<FormattedLogEntry> = {},
+): FormattedLogEntry => ({
+  id: "1",
+  raw: { level: 30, time: "2026-01-08T00:00:00.000Z", category: "cli" },
+  timestamp: 0,
+  timeLabel: "00:00:00",
+  levelLabel: "INFO",
+  category: "cli",
+  message,
+  summary: `[00:00:00] [INFO] [cli] ${message}`,
+  json: JSON.stringify({ message }, null, 2),
+  ...overrides,
+});
+
+const findLine = (frame: string, needle: string) => {
+  const lines = frame.split("\n");
+  const index = lines.findIndex((line) => line.includes(needle));
+  if (index < 0) {
+    throw new Error(`Line not found: ${needle}`);
+  }
+  return { index, line: lines[index] ?? "" };
+};
+
+const readColorAt = (
+  buffer: Float32Array,
+  width: number,
+  row: number,
+  col: number,
+) => {
+  const offset = (row * width + col) * 4;
+  return [
+    Math.round(buffer[offset] * 255),
+    Math.round(buffer[offset + 1] * 255),
+    Math.round(buffer[offset + 2] * 255),
+    Math.round(buffer[offset + 3] * 255),
+  ] as const;
+};
+
+describe("LogScreen", () => {
+  it("updates entries when data changes", async () => {
+    const [entries, setEntries] = createSignal<FormattedLogEntry[]>([]);
+
+    const { LogScreen } = await import("../../screens/solid/LogScreen.js");
+
+    const testSetup = await testRender(
+      () => (
+        <LogScreen
+          entries={entries()}
+          branchLabel="feature/logs"
+          sourceLabel="/tmp/feature-logs"
+          onBack={() => {}}
+          onSelect={() => {}}
+          onCopy={() => {}}
+        />
+      ),
+      { width: 80, height: 24 },
+    );
+
+    try {
+      await testSetup.renderOnce();
+      let frame = testSetup.captureCharFrame();
+      expect(frame).toContain("Branch: feature/logs");
+      expect(frame).toContain("Source: /tmp/feature-logs");
+      expect(frame).toContain("No logs available.");
+
+      setEntries([makeEntry("Hello")]);
+      await testSetup.renderOnce();
+      frame = testSetup.captureCharFrame();
+      expect(frame).toContain("[00:00:00] [INFO ] [cli ] Hello");
+    } finally {
+      testSetup.renderer.destroy();
+    }
+  });
+
+  it("filters entries by query and shows counts", async () => {
+    const entries = [
+      makeEntry("alpha", {
+        id: "1",
+        category: "cli",
+        raw: { level: 30, time: "2026-01-08T00:00:00.000Z", category: "cli" },
+      }),
+      makeEntry("beta", {
+        id: "2",
+        category: "agent.stdout",
+        raw: {
+          level: 50,
+          time: "2026-01-08T00:00:01.000Z",
+          category: "agent.stdout",
+        },
+      }),
+    ];
+
+    const { LogScreen } = await import("../../screens/solid/LogScreen.js");
+
+    const testSetup = await testRender(
+      () => (
+        <LogScreen
+          entries={entries}
+          onBack={() => {}}
+          onSelect={() => {}}
+          onCopy={() => {}}
+        />
+      ),
+      { width: 80, height: 24 },
+    );
+
+    try {
+      await testSetup.renderOnce();
+      let frame = testSetup.captureCharFrame();
+      expect(frame).toContain("alpha");
+      expect(frame).toContain("beta");
+
+      await testSetup.mockInput.typeText("f");
+      await testSetup.renderOnce();
+
+      await testSetup.mockInput.typeText("agent");
+      await testSetup.renderOnce();
+      testSetup.mockInput.pressEnter();
+      await testSetup.renderOnce();
+
+      frame = testSetup.captureCharFrame();
+      expect(frame).toContain("beta");
+      expect(frame).not.toContain("alpha");
+      expect(frame).toContain("Showing 1 of 2");
+    } finally {
+      testSetup.renderer.destroy();
+    }
+  });
+
+  it("cycles level filter with v and hides lower levels", async () => {
+    const entries = [
+      makeEntry("info-log", {
+        id: "1",
+        levelLabel: "INFO",
+        raw: { level: 30, time: "2026-01-08T00:00:00.000Z", category: "cli" },
+      }),
+      makeEntry("error-log", {
+        id: "2",
+        levelLabel: "ERROR",
+        raw: { level: 50, time: "2026-01-08T00:00:01.000Z", category: "cli" },
+      }),
+    ];
+
+    const { LogScreen } = await import("../../screens/solid/LogScreen.js");
+
+    const testSetup = await testRender(
+      () => (
+        <LogScreen
+          entries={entries}
+          onBack={() => {}}
+          onSelect={() => {}}
+          onCopy={() => {}}
+        />
+      ),
+      { width: 80, height: 24 },
+    );
+
+    try {
+      await testSetup.renderOnce();
+      let frame = testSetup.captureCharFrame();
+      expect(frame).toContain("info-log");
+      expect(frame).toContain("error-log");
+
+      await testSetup.mockInput.typeText("v");
+      await testSetup.renderOnce();
+      await testSetup.mockInput.typeText("v");
+      await testSetup.renderOnce();
+
+      frame = testSetup.captureCharFrame();
+      expect(frame).toContain("error-log");
+      expect(frame).not.toContain("info-log");
+      expect(frame).toContain("Level: WARN+");
+    } finally {
+      testSetup.renderer.destroy();
+    }
+  });
+
+  it("triggers reload/tail and truncates long lines", async () => {
+    const onReload = mock();
+    const onToggleTail = mock();
+    const longMessage =
+      "this-is-a-very-long-log-line-that-should-be-truncated-with-ellipsis";
+    const entries = [
+      makeEntry(longMessage, {
+        id: "1",
+        raw: { level: 30, time: "2026-01-08T00:00:00.000Z", category: "cli" },
+      }),
+    ];
+
+    const { LogScreen } = await import("../../screens/solid/LogScreen.js");
+
+    const testSetup = await testRender(
+      () => (
+        <LogScreen
+          entries={entries}
+          onBack={() => {}}
+          onSelect={() => {}}
+          onCopy={() => {}}
+          onReload={onReload}
+          onToggleTail={onToggleTail}
+        />
+      ),
+      { width: 40, height: 16 },
+    );
+
+    try {
+      await testSetup.renderOnce();
+
+      await testSetup.mockInput.typeText("r");
+      await testSetup.renderOnce();
+      expect(onReload).toHaveBeenCalledTimes(1);
+
+      await testSetup.mockInput.typeText("t");
+      await testSetup.renderOnce();
+      expect(onToggleTail).toHaveBeenCalledTimes(1);
+
+      const frame = testSetup.captureCharFrame();
+      expect(frame).toContain("...");
+      expect(frame).not.toContain("Wrap:");
+    } finally {
+      testSetup.renderer.destroy();
+    }
+  });
+
+  it("triggers reset and shows Reset in footer", async () => {
+    const onReset = mock();
+    const { LogScreen } = await import("../../screens/solid/LogScreen.js");
+
+    const testSetup = await testRender(
+      () => (
+        <LogScreen
+          entries={[]}
+          onBack={() => {}}
+          onSelect={() => {}}
+          onCopy={() => {}}
+          onReset={onReset}
+        />
+      ),
+      { width: 80, height: 16 },
+    );
+
+    try {
+      await testSetup.renderOnce();
+      const frame = testSetup.captureCharFrame();
+      expect(frame).toContain("Reset");
+
+      await testSetup.mockInput.typeText("x");
+      await testSetup.renderOnce();
+      expect(onReset).toHaveBeenCalledTimes(1);
+    } finally {
+      testSetup.renderer.destroy();
+    }
+  });
+
+  it("highlights the selected row with full-width cyan background", async () => {
+    const entries = [
+      makeEntry("alpha", {
+        id: "1",
+        raw: { level: 30, time: "2026-01-08T00:00:00.000Z", category: "cli" },
+      }),
+      makeEntry("beta", {
+        id: "2",
+        raw: { level: 30, time: "2026-01-08T00:00:01.000Z", category: "cli" },
+      }),
+    ];
+
+    const { LogScreen } = await import("../../screens/solid/LogScreen.js");
+
+    const width = 60;
+    const testSetup = await testRender(
+      () => (
+        <LogScreen
+          entries={entries}
+          onBack={() => {}}
+          onSelect={() => {}}
+          onCopy={() => {}}
+        />
+      ),
+      { width, height: 16 },
+    );
+
+    try {
+      await testSetup.renderOnce();
+      const frame = testSetup.captureCharFrame();
+      const { index: row } = findLine(frame, "alpha");
+      const buffers = testSetup.renderer.currentRenderBuffer.buffers;
+      const bg = readColorAt(buffers.bg, width, row, width - 1);
+      const fg = readColorAt(buffers.fg, width, row, width - 1);
+
+      expect(bg).toEqual(parseColor("cyan").toInts());
+      expect(fg).toEqual(parseColor("black").toInts());
+    } finally {
+      testSetup.renderer.destroy();
+    }
+  });
+
+  it("colors the level column for non-selected rows", async () => {
+    const entries = [
+      makeEntry("first", {
+        id: "1",
+        levelLabel: "INFO",
+        raw: { level: 30, time: "2026-01-08T00:00:00.000Z", category: "cli" },
+      }),
+      makeEntry("second", {
+        id: "2",
+        levelLabel: "ERROR",
+        raw: { level: 50, time: "2026-01-08T00:00:01.000Z", category: "cli" },
+      }),
+    ];
+
+    const { LogScreen } = await import("../../screens/solid/LogScreen.js");
+
+    const width = 80;
+    const testSetup = await testRender(
+      () => (
+        <LogScreen
+          entries={entries}
+          onBack={() => {}}
+          onSelect={() => {}}
+          onCopy={() => {}}
+        />
+      ),
+      { width, height: 16 },
+    );
+
+    try {
+      await testSetup.renderOnce();
+      testSetup.mockInput.pressArrow("down");
+      await testSetup.renderOnce();
+      const frame = testSetup.captureCharFrame();
+      const { index: row, line } = findLine(frame, "first");
+      const levelIndex = line.indexOf("INFO");
+      expect(levelIndex).toBeGreaterThanOrEqual(0);
+
+      const buffers = testSetup.renderer.currentRenderBuffer.buffers;
+      const fg = readColorAt(buffers.fg, width, row, levelIndex);
+      expect(fg).toEqual(parseColor("green").toInts());
+    } finally {
+      testSetup.renderer.destroy();
+    }
+  });
+});

package/src/cli/ui/__tests__/solid/components/QuickStartStep.test.tsx

@@ -0,0 +1,308 @@
+/** @jsxImportSource @opentui/solid */
+import { describe, expect, it } from "bun:test";
+import { testRender } from "@opentui/solid";
+import { QuickStartStep } from "../../../components/solid/QuickStartStep.js";
+import type { ToolSessionEntry } from "../../../../../config/index.js";
+
+const mockHistory: ToolSessionEntry[] = [
+  {
+    toolId: "claude-code",
+    toolLabel: "Claude Code",
+    branch: "feature/test",
+    worktreePath: "/path/to/worktree",
+    model: "claude-sonnet-4-20250514",
+    mode: "normal",
+    timestamp: Date.now(),
+    sessionId: "session-123",
+  },
+  {
+    toolId: "codex-cli",
+    toolLabel: "Codex CLI",
+    branch: "feature/test",
+    worktreePath: "/path/to/worktree",
+    model: "o3-mini",
+    mode: "normal",
+    timestamp: Date.now() - 1000,
+    sessionId: "session-456",
+    reasoningLevel: "high",
+  },
+];
+
+// T501: クイック選択画面の表示テスト
+describe("QuickStartStep", () => {
+  describe("display", () => {
+    it("renders Quick Start title", async () => {
+      const testSetup = await testRender(
+        () => (
+          <QuickStartStep
+            history={mockHistory}
+            onResume={() => {}}
+            onStartNew={() => {}}
+            onChooseDifferent={() => {}}
+            onBack={() => {}}
+          />
+        ),
+        { width: 60, height: 24 },
+      );
+      await testSetup.renderOnce();
+
+      try {
+        const frame = testSetup.captureCharFrame();
+        expect(frame).toContain("Quick Start");
+      } finally {
+        testSetup.renderer.destroy();
+      }
+    });
+
+    it("renders session id for resume description when available", async () => {
+      const testSetup = await testRender(
+        () => (
+          <QuickStartStep
+            history={mockHistory}
+            onResume={() => {}}
+            onStartNew={() => {}}
+            onChooseDifferent={() => {}}
+            onBack={() => {}}
+          />
+        ),
+        { width: 80, height: 24 },
+      );
+      await testSetup.renderOnce();
+
+      try {
+        const frame = testSetup.captureCharFrame();
+        expect(frame).toContain("session-123");
+      } finally {
+        testSetup.renderer.destroy();
+      }
+    });
+  });
+
+  // T502: ヘルプテキストの表示テスト
+  describe("help display", () => {
+    it("displays help text", async () => {
+      const testSetup = await testRender(
+        () => (
+          <QuickStartStep
+            history={mockHistory}
+            onResume={() => {}}
+            onStartNew={() => {}}
+            onChooseDifferent={() => {}}
+            onBack={() => {}}
+          />
+        ),
+        { width: 80, height: 24 },
+      );
+      await testSetup.renderOnce();
+
+      try {
+        const frame = testSetup.captureCharFrame();
+        // ヘルプテキストが表示される
+        expect(frame).toContain("[Esc] Cancel");
+        expect(frame).toContain("[Enter] Select");
+      } finally {
+        testSetup.renderer.destroy();
+      }
+    });
+  });
+
+  // T503: 「Resume with previous settings」選択時の動作テスト
+  describe("Resume with previous settings", () => {
+    it("calls onResume with selected entry when Resume is selected", async () => {
+      let resumedEntry: ToolSessionEntry | null = null;
+      const testSetup = await testRender(
+        () => (
+          <QuickStartStep
+            history={mockHistory}
+            onResume={(entry) => {
+              resumedEntry = entry;
+            }}
+            onStartNew={() => {}}
+            onChooseDifferent={() => {}}
+            onBack={() => {}}
+          />
+        ),
+        { width: 60, height: 24 },
+      );
+      await testSetup.renderOnce();
+
+      try {
+        // 最初の項目（Claude Code の Resume）を選択
+        testSetup.mockInput.pressEnter();
+        await testSetup.renderOnce();
+        expect(resumedEntry).not.toBeNull();
+        const assertedEntry = resumedEntry as ToolSessionEntry | null;
+        if (!assertedEntry) {
+          throw new Error("Expected resumed entry");
+        }
+        expect(assertedEntry.toolId).toBe("claude-code");
+      } finally {
+        testSetup.renderer.destroy();
+      }
+    });
+  });
+
+  // T504: 「Start new with previous settings」選択時の動作テスト
+  describe("Start new with previous settings", () => {
+    it("calls onStartNew with selected entry when Start new is selected", async () => {
+      let startNewEntry: ToolSessionEntry | null = null;
+      const testSetup = await testRender(
+        () => (
+          <QuickStartStep
+            history={mockHistory}
+            onResume={() => {}}
+            onStartNew={(entry) => {
+              startNewEntry = entry;
+            }}
+            onChooseDifferent={() => {}}
+            onBack={() => {}}
+          />
+        ),
+        { width: 60, height: 24 },
+      );
+      await testSetup.renderOnce();
+
+      try {
+        // 矢印キーで Start new を選択
+        testSetup.mockInput.pressArrow("down");
+        await testSetup.renderOnce();
+        testSetup.mockInput.pressEnter();
+        await testSetup.renderOnce();
+        expect(startNewEntry).not.toBeNull();
+      } finally {
+        testSetup.renderer.destroy();
+      }
+    });
+  });
+
+  // T505: 「Choose different settings...」選択時の動作テスト
+  describe("Choose different settings", () => {
+    it("calls onChooseDifferent when selected", async () => {
+      let chooseDifferentCalled = false;
+      const testSetup = await testRender(
+        () => (
+          <QuickStartStep
+            history={mockHistory}
+            onResume={() => {}}
+            onStartNew={() => {}}
+            onChooseDifferent={() => {
+              chooseDifferentCalled = true;
+            }}
+            onBack={() => {}}
+          />
+        ),
+        { width: 60, height: 24 },
+      );
+      await testSetup.renderOnce();
+
+      try {
+        // 矢印キーで最後の項目（Choose different settings）を選択
+        for (let i = 0; i < 4; i++) {
+          testSetup.mockInput.pressArrow("down");
+          await testSetup.renderOnce();
+        }
+        testSetup.mockInput.pressEnter();
+        await testSetup.renderOnce();
+        expect(chooseDifferentCalled).toBe(true);
+      } finally {
+        testSetup.renderer.destroy();
+      }
+    });
+  });
+
+  // T506: 履歴がない場合のスキップテスト
+  describe("empty history", () => {
+    it("calls onChooseDifferent immediately when history is empty", async () => {
+      let chooseDifferentCalled = false;
+      const testSetup = await testRender(
+        () => (
+          <QuickStartStep
+            history={[]}
+            onResume={() => {}}
+            onStartNew={() => {}}
+            onChooseDifferent={() => {
+              chooseDifferentCalled = true;
+            }}
+            onBack={() => {}}
+          />
+        ),
+        { width: 60, height: 24 },
+      );
+      await testSetup.renderOnce();
+
+      try {
+        // 履歴がない場合は自動的に onChooseDifferent が呼ばれる
+        expect(chooseDifferentCalled).toBe(true);
+      } finally {
+        testSetup.renderer.destroy();
+      }
+    });
+  });
+
+  describe("missing sessionId", () => {
+    it("does not render Resume option when sessionId is missing", async () => {
+      const historyWithoutSession: ToolSessionEntry[] = [
+        {
+          toolId: "claude-code",
+          toolLabel: "Claude Code",
+          branch: "feature/test",
+          worktreePath: "/path/to/worktree",
+          model: "claude-sonnet-4-20250514",
+          mode: "normal",
+          timestamp: Date.now(),
+          sessionId: null,
+        },
+      ];
+      const testSetup = await testRender(
+        () => (
+          <QuickStartStep
+            history={historyWithoutSession}
+            onResume={() => {}}
+            onStartNew={() => {}}
+            onChooseDifferent={() => {}}
+            onBack={() => {}}
+          />
+        ),
+        { width: 80, height: 24 },
+      );
+      await testSetup.renderOnce();
+
+      try {
+        const frame = testSetup.captureCharFrame();
+        expect(frame).not.toContain("Resume session");
+        expect(frame).toContain("Start new (previous settings)");
+        expect(frame).toContain("Choose different settings");
+      } finally {
+        testSetup.renderer.destroy();
+      }
+    });
+  });
+
+  describe("multi-tool display", () => {
+    it("renders tool-specific descriptions and session id only for resume", async () => {
+      const testSetup = await testRender(
+        () => (
+          <QuickStartStep
+            history={mockHistory}
+            onResume={() => {}}
+            onStartNew={() => {}}
+            onChooseDifferent={() => {}}
+            onBack={() => {}}
+          />
+        ),
+        { width: 90, height: 24 },
+      );
+      await testSetup.renderOnce();
+
+      try {
+        const frame = testSetup.captureCharFrame();
+        expect(frame).toContain("Claude Code, claude-sonnet-4-20250514");
+        expect(frame).toContain("Codex CLI, o3-mini, high");
+        expect(frame).toContain("Session: session-123");
+        expect(frame).toContain("Session: session-456");
+      } finally {
+        testSetup.renderer.destroy();
+      }
+    });
+  });
+});