feat(chat): 优化聊天面板交互体验 — 推理折叠/智能滚动/工具中文名/代码块按钮

tests/web/components/chat/ReasoningPart.test.tsx

@@ -0,0 +1,49 @@
+import { fireEvent, screen } from "@testing-library/react";
+import { describe, expect, test } from "bun:test";
+import { createElement } from "react";
+
+import { ReasoningPart } from "../../../../src/web/consoles/workbench/components/chat/parts/ReasoningPart";
+import { renderWithProviders } from "../../test-utils";
+
+describe("ReasoningPart", () => {
+  test("流式状态时自动展开显示文本", () => {
+    const part = { state: "streaming", text: "正在思考...", type: "reasoning" };
+
+    renderWithProviders(createElement(ReasoningPart, { part }));
+
+    expect(screen.getByText("正在思考...")).toBeTruthy();
+    expect(screen.getByText("思考中")).toBeTruthy();
+  });
+
+  test("完成状态时显示思考完成标签", () => {
+    const part = { state: "complete", text: "思考内容", type: "reasoning" };
+
+    renderWithProviders(createElement(ReasoningPart, { part }));
+
+    expect(screen.getByText("思考完成")).toBeTruthy();
+  });
+
+  test("无状态时默认收起", () => {
+    const part = { text: "默认内容", type: "reasoning" };
+
+    const { container } = renderWithProviders(createElement(ReasoningPart, { part }));
+
+    const expanded = container.querySelector('[aria-expanded="true"]');
+    expect(expanded).toBeNull();
+  });
+
+  test("用户点击折叠后尊重用户意图", () => {
+    const part = { state: "streaming", text: "思考中内容", type: "reasoning" };
+
+    const { container } = renderWithProviders(createElement(ReasoningPart, { part }));
+
+    const collapseHeader = container.querySelector(".ant-collapse-header");
+    expect(collapseHeader).toBeTruthy();
+
+    if (collapseHeader) {
+      fireEvent.click(collapseHeader);
+    }
+
+    expect(screen.getByText("思考中内容")).toBeTruthy();
+  });
+});

tests/web/components/chat/ToolPart.test.tsx

@@ -0,0 +1,65 @@
+import { screen } from "@testing-library/react";
+import { describe, expect, test } from "bun:test";
+import { createElement } from "react";
+
+import { ToolPart } from "../../../../src/web/consoles/workbench/components/chat/parts/ToolPart";
+import { renderWithProviders } from "../../test-utils";
+
+describe("ToolPart 工具显示名", () => {
+  test("无 toolMetadata 时使用 toolName", () => {
+    const part = {
+      input: { timezone: "Asia/Shanghai" },
+      output: { iso: "2024-01-01T00:00:00.000Z", local: "2024年1月1日", timestamp: 1704067200000 },
+      toolCallId: "call-1",
+      toolName: "getCurrentTime",
+      type: "tool-getCurrentTime",
+    };
+
+    renderWithProviders(createElement(ToolPart, { part }));
+
+    expect(screen.getByText(/getCurrentTime/)).toBeTruthy();
+  });
+
+  test("有 toolMetadata.displayName 时优先使用显示名", () => {
+    const part = {
+      input: { timezone: "Asia/Shanghai" },
+      output: { iso: "2024-01-01T00:00:00.000Z", local: "2024年1月1日", timestamp: 1704067200000 },
+      toolCallId: "call-1",
+      toolMetadata: { displayName: "获取当前时间" },
+      toolName: "getCurrentTime",
+      type: "tool-getCurrentTime",
+    };
+
+    renderWithProviders(createElement(ToolPart, { part }));
+
+    expect(screen.getByText("获取当前时间")).toBeTruthy();
+    expect(screen.queryByText(/getCurrentTime/)).toBeNull();
+  });
+
+  test("toolMetadata.displayName 非字符串时回退到 toolName", () => {
+    const part = {
+      input: {},
+      output: {},
+      toolCallId: "call-2",
+      toolMetadata: { displayName: 123 },
+      type: "tool-someTool",
+    };
+
+    renderWithProviders(createElement(ToolPart, { part }));
+
+    expect(screen.getByText("someTool")).toBeTruthy();
+  });
+
+  test("错误状态时使用显示名", () => {
+    const part = {
+      errorText: "超时",
+      toolCallId: "call-3",
+      toolMetadata: { displayName: "获取当前时间" },
+      type: "tool-getCurrentTime",
+    };
+
+    renderWithProviders(createElement(ToolPart, { part }));
+
+    expect(screen.getByText(/获取当前时间.*失败/)).toBeTruthy();
+  });
+});