Sync upstream Gemini-CLI v0.8.2 (#838)

packages/cli/src/ui/components/HistoryItemDisplay.test.tsx

@@ -4,17 +4,21 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import { render } from 'ink-testing-library';
 import { describe, it, expect, vi } from 'vitest';
 import { HistoryItemDisplay } from './HistoryItemDisplay.js';
-import type { HistoryItem } from '../types.js';
+import { type HistoryItem, ToolCallStatus } from '../types.js';
 import { MessageType } from '../types.js';
 import { SessionStatsProvider } from '../contexts/SessionContext.js';
-import type { Config } from '@qwen-code/qwen-code-core';
+import type {
+  Config,
+  ToolExecuteConfirmationDetails,
+} from '@qwen-code/qwen-code-core';
+import { ToolGroupMessage } from './messages/ToolGroupMessage.js';
+import { renderWithProviders } from '../../test-utils/render.js';
 
 // Mock child components
 vi.mock('./messages/ToolGroupMessage.js', () => ({
-  ToolGroupMessage: () => <div />,
+  ToolGroupMessage: vi.fn(() => <div />),
 }));
 
 describe('<HistoryItemDisplay />', () => {
@@ -33,7 +37,7 @@ describe('<HistoryItemDisplay />', () => {
       type: MessageType.USER,
       text: 'Hello',
     };
-    const { lastFrame } = render(
+    const { lastFrame } = renderWithProviders(
       <HistoryItemDisplay {...baseItem} item={item} />,
     );
     expect(lastFrame()).toContain('Hello');
@@ -45,7 +49,7 @@ describe('<HistoryItemDisplay />', () => {
       type: MessageType.USER,
       text: '/theme',
     };
-    const { lastFrame } = render(
+    const { lastFrame } = renderWithProviders(
       <HistoryItemDisplay {...baseItem} item={item} />,
     );
     expect(lastFrame()).toContain('/theme');
@@ -57,7 +61,7 @@ describe('<HistoryItemDisplay />', () => {
       type: MessageType.STATS,
       duration: '1s',
     };
-    const { lastFrame } = render(
+    const { lastFrame } = renderWithProviders(
       <SessionStatsProvider>
         <HistoryItemDisplay {...baseItem} item={item} />
       </SessionStatsProvider>,
@@ -77,7 +81,7 @@ describe('<HistoryItemDisplay />', () => {
       gcpProject: 'test-project',
       ideClient: 'test-ide',
     };
-    const { lastFrame } = render(
+    const { lastFrame } = renderWithProviders(
       <HistoryItemDisplay {...baseItem} item={item} />,
     );
     expect(lastFrame()).toContain('About Qwen Code');
@@ -88,7 +92,7 @@ describe('<HistoryItemDisplay />', () => {
       ...baseItem,
       type: 'model_stats',
     };
-    const { lastFrame } = render(
+    const { lastFrame } = renderWithProviders(
       <SessionStatsProvider>
         <HistoryItemDisplay {...baseItem} item={item} />
       </SessionStatsProvider>,
@@ -103,7 +107,7 @@ describe('<HistoryItemDisplay />', () => {
       ...baseItem,
       type: 'tool_stats',
     };
-    const { lastFrame } = render(
+    const { lastFrame } = renderWithProviders(
       <SessionStatsProvider>
         <HistoryItemDisplay {...baseItem} item={item} />
       </SessionStatsProvider>,
@@ -119,11 +123,151 @@ describe('<HistoryItemDisplay />', () => {
       type: 'quit',
       duration: '1s',
     };
-    const { lastFrame } = render(
+    const { lastFrame } = renderWithProviders(
       <SessionStatsProvider>
         <HistoryItemDisplay {...baseItem} item={item} />
       </SessionStatsProvider>,
     );
     expect(lastFrame()).toContain('Agent powering down. Goodbye!');
   });
+
+  it('should escape ANSI codes in text content', () => {
+    const historyItem: HistoryItem = {
+      id: 1,
+      type: 'user',
+      text: 'Hello, \u001b[31mred\u001b[0m world!',
+    };
+
+    const { lastFrame } = renderWithProviders(
+      <HistoryItemDisplay
+        item={historyItem}
+        terminalWidth={80}
+        isPending={false}
+      />,
+    );
+
+    // The ANSI codes should be escaped for display.
+    expect(lastFrame()).toContain('Hello, \\u001b[31mred\\u001b[0m world!');
+    // The raw ANSI codes should not be present.
+    expect(lastFrame()).not.toContain('Hello, \u001b[31mred\u001b[0m world!');
+  });
+
+  it('should escape ANSI codes in tool confirmation details', () => {
+    const historyItem: HistoryItem = {
+      id: 1,
+      type: 'tool_group',
+      tools: [
+        {
+          callId: '123',
+          name: 'run_shell_command',
+          description: 'Run a shell command',
+          resultDisplay: 'blank',
+          status: ToolCallStatus.Confirming,
+          confirmationDetails: {
+            type: 'exec',
+            title: 'Run Shell Command',
+            command: 'echo "\u001b[31mhello\u001b[0m"',
+            rootCommand: 'echo',
+            onConfirm: async () => {},
+          },
+        },
+      ],
+    };
+
+    renderWithProviders(
+      <HistoryItemDisplay
+        item={historyItem}
+        terminalWidth={80}
+        isPending={false}
+      />,
+    );
+
+    const passedProps = vi.mocked(ToolGroupMessage).mock.calls[0][0];
+    const confirmationDetails = passedProps.toolCalls[0]
+      .confirmationDetails as ToolExecuteConfirmationDetails;
+
+    expect(confirmationDetails.command).toBe(
+      'echo "\\u001b[31mhello\\u001b[0m"',
+    );
+  });
+
+  const longCode =
+    '# Example code block:\n' +
+    '```python\n' +
+    Array.from({ length: 50 }, (_, i) => `Line ${i + 1}`).join('\n') +
+    '\n```';
+
+  it('should render a truncated gemini item', () => {
+    const item: HistoryItem = {
+      id: 1,
+      type: 'gemini',
+      text: longCode,
+    };
+    const { lastFrame } = renderWithProviders(
+      <HistoryItemDisplay
+        item={item}
+        isPending={false}
+        terminalWidth={80}
+        availableTerminalHeight={10}
+      />,
+    );
+
+    expect(lastFrame()).toMatchSnapshot();
+  });
+
+  it('should render a full gemini item when using availableTerminalHeightGemini', () => {
+    const item: HistoryItem = {
+      id: 1,
+      type: 'gemini',
+      text: longCode,
+    };
+    const { lastFrame } = renderWithProviders(
+      <HistoryItemDisplay
+        item={item}
+        isPending={false}
+        terminalWidth={80}
+        availableTerminalHeight={10}
+        availableTerminalHeightGemini={Number.MAX_SAFE_INTEGER}
+      />,
+    );
+
+    expect(lastFrame()).toMatchSnapshot();
+  });
+
+  it('should render a truncated gemini_content item', () => {
+    const item: HistoryItem = {
+      id: 1,
+      type: 'gemini_content',
+      text: longCode,
+    };
+    const { lastFrame } = renderWithProviders(
+      <HistoryItemDisplay
+        item={item}
+        isPending={false}
+        terminalWidth={80}
+        availableTerminalHeight={10}
+      />,
+    );
+
+    expect(lastFrame()).toMatchSnapshot();
+  });
+
+  it('should render a full gemini_content item when using availableTerminalHeightGemini', () => {
+    const item: HistoryItem = {
+      id: 1,
+      type: 'gemini_content',
+      text: longCode,
+    };
+    const { lastFrame } = renderWithProviders(
+      <HistoryItemDisplay
+        item={item}
+        isPending={false}
+        terminalWidth={80}
+        availableTerminalHeight={10}
+        availableTerminalHeightGemini={Number.MAX_SAFE_INTEGER}
+      />,
+    );
+
+    expect(lastFrame()).toMatchSnapshot();
+  });
 });