diff --git a/packages/cli/src/ui/components/messages/ToolGroupMessage.test.tsx b/packages/cli/src/ui/components/messages/ToolGroupMessage.test.tsx index d08d0bd692..126ed6c7b9 100644 --- a/packages/cli/src/ui/components/messages/ToolGroupMessage.test.tsx +++ b/packages/cli/src/ui/components/messages/ToolGroupMessage.test.tsx @@ -12,6 +12,7 @@ import type { IndividualToolCallDisplay } from '../../types.js'; import { ToolCallStatus } from '../../types.js'; import type { ToolCallConfirmationDetails } from '@google/gemini-cli-core'; import { TOOL_STATUS } from '../../constants.js'; +import { Scrollable } from '../shared/Scrollable.js'; // Mock child components to isolate ToolGroupMessage behavior vi.mock('./ToolMessage.js', () => ({ @@ -250,6 +251,48 @@ describe('', () => { expect(lastFrame()).toMatchSnapshot(); unmount(); }); + + it('renders header when scrolled', () => { + const toolCalls = [ + createToolCall({ + callId: '1', + name: 'tool-1', + description: + 'Description 1. This is a long description that will need to be truncated if the terminal width is small.', + resultDisplay: 'line1\nline2\nline3\nline4\nline5', + }), + createToolCall({ + callId: '2', + name: 'tool-2', + description: 'Description 2', + resultDisplay: 'line1\nline2', + }), + ]; + const { lastFrame, unmount } = renderWithProviders( + + + , + ); + expect(lastFrame()).toMatchSnapshot(); + unmount(); + }); + + it('renders tool call with outputFile', () => { + const toolCalls = [ + createToolCall({ + callId: 'tool-output-file', + name: 'tool-with-file', + description: 'Tool that saved output to file', + status: ToolCallStatus.Success, + outputFile: '/path/to/output.txt', + }), + ]; + const { lastFrame, unmount } = renderWithProviders( + , + ); + expect(lastFrame()).toMatchSnapshot(); + unmount(); + }); }); describe('Border Color Logic', () => { diff --git a/packages/cli/src/ui/components/messages/ToolMessage.tsx b/packages/cli/src/ui/components/messages/ToolMessage.tsx index 60b91fabc7..6d91489222 100644 --- a/packages/cli/src/ui/components/messages/ToolMessage.tsx +++ b/packages/cli/src/ui/components/messages/ToolMessage.tsx @@ -301,8 +301,8 @@ const ToolInfo: React.FC = ({ } }, [emphasis]); return ( - - + + {name} {' '} diff --git a/packages/cli/src/ui/components/messages/__snapshots__/ToolGroupMessage.test.tsx.snap b/packages/cli/src/ui/components/messages/__snapshots__/ToolGroupMessage.test.tsx.snap index 2215c6674d..4890bad76f 100644 --- a/packages/cli/src/ui/components/messages/__snapshots__/ToolGroupMessage.test.tsx.snap +++ b/packages/cli/src/ui/components/messages/__snapshots__/ToolGroupMessage.test.tsx.snap @@ -34,6 +34,19 @@ exports[` > Golden Snapshots > renders empty tool calls arra ╰──────────────────────────────────────────────────────────────────────────────╯" `; +exports[` > Golden Snapshots > renders header when scrolled 1`] = ` +"╭──────────────────────────────────────────────────────────────────────────────╮ +│MockTool[1]: ✓ tool-1 - Description 1. This is a long description that will │ +│need to be truncated if the terminal width is small. (medium) │ +│ │ +│MockTool[2]: ✓ tool-2 - Description 2 (medium) │ +╰──────────────────────────────────────────────────────────────────────────────╯ + + + +" +`; + exports[` > Golden Snapshots > renders mixed tool calls including shell command 1`] = ` "╭──────────────────────────────────────────────────────────────────────────────╮ │MockTool[tool-1]: ✓ read_file - Read a file (medium) │ @@ -74,6 +87,14 @@ exports[` > Golden Snapshots > renders tool call awaiting co ╰──────────────────────────────────────────────────────────────────────────────╯" `; +exports[` > Golden Snapshots > renders tool call with outputFile 1`] = ` +"╭──────────────────────────────────────────────────────────────────────────────╮ +│MockTool[tool-output-file]: ✓ tool-with-file - Tool that saved output to │ +│file (medium) │ +│ Output too long and was saved to: /path/to/output.txt │ +╰──────────────────────────────────────────────────────────────────────────────╯" +`; + exports[` > Golden Snapshots > renders when not focused 1`] = ` "╭──────────────────────────────────────────────────────────────────────────────╮ │MockTool[tool-123]: ✓ test-tool - A tool for testing (medium) │