Files
gemini-cli/packages/cli/src/ui/layouts/DefaultAppLayout.test.tsx
T
Abhijit Balaji f790f7f40b feat(ui): implement true sticky topic header in app layouts
- Relocated TopicStickyHeader from chat history to global AppLayouts (Default and ScreenReader) for permanent viewport stickiness.
- Fixed duplication issues by removing complex history injection logic in MainContent.tsx.
- Restored natural rendering of topic updates in chat history to ensure consistent scrollback context.
- Added persistent styling (background and separator) to TopicStickyHeader for better visual hierarchy.
- Simplified MainContent.tsx logic by removing redundant overlay and virtualization hacks.
- Updated unit tests and snapshots to align with the new stable layout architecture.
2026-04-02 14:32:43 -04:00

140 lines
4.3 KiB
TypeScript

/**
* @license
* Copyright 2025 Google LLC
* SPDX-License-Identifier: Apache-2.0
*/
import { render } from '../../test-utils/render.js';
import { describe, it, expect, vi, beforeEach } from 'vitest';
import { DefaultAppLayout } from './DefaultAppLayout.js';
import { StreamingState } from '../types.js';
import { Text } from 'ink';
import type { UIState } from '../contexts/UIStateContext.js';
import type { BackgroundTask } from '../hooks/useExecutionLifecycle.js';
// Mock dependencies
const mockUIState = {
rootUiRef: { current: null },
terminalHeight: 24,
terminalWidth: 80,
mainAreaWidth: 80,
backgroundTasks: new Map<number, BackgroundTask>(),
activeBackgroundTaskPid: null as number | null,
backgroundTaskHeight: 10,
embeddedShellFocused: false,
dialogsVisible: false,
streamingState: StreamingState.Idle,
isBackgroundTaskListOpen: false,
mainControlsRef: vi.fn(),
customDialog: null,
historyManager: { addItem: vi.fn() },
history: [],
pendingHistoryItems: [],
slashCommands: [],
constrainHeight: false,
availableTerminalHeight: 20,
activePtyId: null,
isBackgroundTaskVisible: true,
} as unknown as UIState;
vi.mock('../contexts/UIStateContext.js', () => ({
useUIState: () => mockUIState,
}));
vi.mock('../contexts/AppContext.js', () => ({
useAppContext: () => ({ version: '1.2.3', startupWarnings: [] }),
}));
vi.mock('../hooks/useFlickerDetector.js', () => ({
useFlickerDetector: vi.fn(),
}));
vi.mock('../hooks/useAlternateBuffer.js', () => ({
useAlternateBuffer: vi.fn(() => false),
}));
vi.mock('../contexts/ConfigContext.js', () => ({
useConfig: () => ({
getAccessibility: vi.fn(() => ({
enableLoadingPhrases: true,
})),
}),
}));
// Mock child components to simplify output
vi.mock('../components/LoadingIndicator.js', () => ({
LoadingIndicator: () => <Text>LoadingIndicator</Text>,
}));
vi.mock('../components/MainContent.js', () => ({
MainContent: () => <Text>MainContent</Text>,
}));
vi.mock('../components/Notifications.js', () => ({
Notifications: () => <Text>Notifications</Text>,
}));
vi.mock('../components/DialogManager.js', () => ({
DialogManager: () => <Text>DialogManager</Text>,
}));
vi.mock('../components/Composer.js', () => ({
Composer: () => <Text>Composer</Text>,
}));
vi.mock('../components/ExitWarning.js', () => ({
ExitWarning: () => <Text>ExitWarning</Text>,
}));
vi.mock('../components/CopyModeWarning.js', () => ({
CopyModeWarning: () => <Text>CopyModeWarning</Text>,
}));
vi.mock('../components/BackgroundTaskDisplay.js', () => ({
BackgroundTaskDisplay: () => <Text>BackgroundTaskDisplay</Text>,
}));
const createMockShell = (pid: number): BackgroundTask => ({
pid,
command: 'test command',
output: 'test output',
isBinary: false,
binaryBytesReceived: 0,
status: 'running',
});
describe('<DefaultAppLayout />', () => {
beforeEach(() => {
vi.clearAllMocks();
// Reset mock state defaults
mockUIState.backgroundTasks = new Map();
mockUIState.activeBackgroundTaskPid = null;
mockUIState.streamingState = StreamingState.Idle;
});
it('renders BackgroundTaskDisplay when shells exist and active', async () => {
mockUIState.backgroundTasks.set(123, createMockShell(123));
mockUIState.activeBackgroundTaskPid = 123;
mockUIState.backgroundTaskHeight = 5;
const { lastFrame, unmount } = await render(<DefaultAppLayout />);
expect(lastFrame()).toMatchSnapshot();
unmount();
});
it('hides BackgroundTaskDisplay when StreamingState is WaitingForConfirmation', async () => {
mockUIState.backgroundTasks.set(123, createMockShell(123));
mockUIState.activeBackgroundTaskPid = 123;
mockUIState.backgroundTaskHeight = 5;
mockUIState.streamingState = StreamingState.WaitingForConfirmation;
const { lastFrame, unmount } = await render(<DefaultAppLayout />);
expect(lastFrame()).toMatchSnapshot();
unmount();
});
it('shows BackgroundTaskDisplay when StreamingState is NOT WaitingForConfirmation', async () => {
mockUIState.backgroundTasks.set(123, createMockShell(123));
mockUIState.activeBackgroundTaskPid = 123;
mockUIState.backgroundTaskHeight = 5;
mockUIState.streamingState = StreamingState.Responding;
const { lastFrame, unmount } = await render(<DefaultAppLayout />);
expect(lastFrame()).toMatchSnapshot();
unmount();
});
});