Fix tests to wrap all calls changing the UI with act. (#12268)

packages/cli/src/ui/components/views/ChatList.test.tsx

@@ -4,7 +4,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import { render } from 'ink-testing-library';
+import { render } from '../../../test-utils/render.js';
 import { describe, it, expect } from 'vitest';
 import { ChatList } from './ChatList.js';
 import type { ChatDetail } from '../../types.js';
@@ -22,14 +22,16 @@ const mockChats: ChatDetail[] = [
 
 describe('<ChatList />', () => {
   it('renders correctly with a list of chats', () => {
-    const { lastFrame } = render(<ChatList chats={mockChats} />);
+    const { lastFrame, unmount } = render(<ChatList chats={mockChats} />);
     expect(lastFrame()).toMatchSnapshot();
+    unmount();
   });
 
   it('renders correctly with no chats', () => {
-    const { lastFrame } = render(<ChatList chats={[]} />);
+    const { lastFrame, unmount } = render(<ChatList chats={[]} />);
     expect(lastFrame()).toContain('No saved conversation checkpoints found.');
     expect(lastFrame()).toMatchSnapshot();
+    unmount();
   });
 
   it('handles invalid date formats gracefully', () => {
@@ -39,8 +41,11 @@ describe('<ChatList />', () => {
         mtime: 'an-invalid-date-string',
       },
     ];
-    const { lastFrame } = render(<ChatList chats={mockChatsWithInvalidDate} />);
+    const { lastFrame, unmount } = render(
+      <ChatList chats={mockChatsWithInvalidDate} />,
+    );
     expect(lastFrame()).toContain('(Invalid Date)');
     expect(lastFrame()).toMatchSnapshot();
+    unmount();
   });
 });

packages/cli/src/ui/components/views/ExtensionsList.test.tsx

@@ -4,7 +4,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import { render } from 'ink-testing-library';
+import { render } from '../../../test-utils/render.js';
 import { vi, describe, beforeEach, it, expect } from 'vitest';
 import { useUIState } from '../../contexts/UIStateContext.js';
 import { ExtensionUpdateState } from '../../state/extensions.js';
@@ -57,27 +57,30 @@ describe('<ExtensionsList />', () => {
 
   it('should render "No extensions installed." if there are no extensions', () => {
     mockUIState(new Map());
-    const { lastFrame } = render(<ExtensionsList extensions={[]} />);
+    const { lastFrame, unmount } = render(<ExtensionsList extensions={[]} />);
     expect(lastFrame()).toContain('No extensions installed.');
+    unmount();
   });
 
   it('should render a list of extensions with their version and status', () => {
     mockUIState(new Map());
-    const { lastFrame } = render(
+    const { lastFrame, unmount } = render(
       <ExtensionsList extensions={mockExtensions} />,
     );
     const output = lastFrame();
     expect(output).toContain('ext-one (v1.0.0) - active');
     expect(output).toContain('ext-two (v2.1.0) - active');
     expect(output).toContain('ext-disabled (v3.0.0) - disabled');
+    unmount();
   });
 
   it('should display "unknown state" if an extension has no update state', () => {
     mockUIState(new Map());
-    const { lastFrame } = render(
+    const { lastFrame, unmount } = render(
       <ExtensionsList extensions={[mockExtensions[0]]} />,
     );
     expect(lastFrame()).toContain('(unknown state)');
+    unmount();
   });
 
   const stateTestCases = [
@@ -115,10 +118,11 @@ describe('<ExtensionsList />', () => {
     it(`should correctly display the state: ${state}`, () => {
       const updateState = new Map([[mockExtensions[0].name, state]]);
       mockUIState(updateState);
-      const { lastFrame } = render(
+      const { lastFrame, unmount } = render(
         <ExtensionsList extensions={[mockExtensions[0]]} />,
       );
       expect(lastFrame()).toContain(expectedText);
+      unmount();
     });
   }
 });

packages/cli/src/ui/components/views/McpStatus.test.tsx

@@ -4,7 +4,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import { render } from 'ink-testing-library';
+import { render } from '../../../test-utils/render.js';
 import { describe, it, expect, vi } from 'vitest';
 import { McpStatus } from './McpStatus.js';
 import { MCPServerStatus } from '@google/gemini-cli-core';
@@ -46,32 +46,36 @@ describe('McpStatus', () => {
   };
 
   it('renders correctly with a connected server', () => {
-    const { lastFrame } = render(<McpStatus {...baseProps} />);
+    const { lastFrame, unmount } = render(<McpStatus {...baseProps} />);
     expect(lastFrame()).toMatchSnapshot();
+    unmount();
   });
 
   it('renders correctly with authenticated OAuth status', () => {
-    const { lastFrame } = render(
+    const { lastFrame, unmount } = render(
       <McpStatus {...baseProps} authStatus={{ 'server-1': 'authenticated' }} />,
     );
     expect(lastFrame()).toMatchSnapshot();
+    unmount();
   });
 
   it('renders correctly with expired OAuth status', () => {
-    const { lastFrame } = render(
+    const { lastFrame, unmount } = render(
       <McpStatus {...baseProps} authStatus={{ 'server-1': 'expired' }} />,
     );
     expect(lastFrame()).toMatchSnapshot();
+    unmount();
   });
 
   it('renders correctly with unauthenticated OAuth status', () => {
-    const { lastFrame } = render(
+    const { lastFrame, unmount } = render(
       <McpStatus
         {...baseProps}
         authStatus={{ 'server-1': 'unauthenticated' }}
       />,
     );
     expect(lastFrame()).toMatchSnapshot();
+    unmount();
   });
 
   it('renders correctly with a disconnected server', async () => {
@@ -79,26 +83,29 @@ describe('McpStatus', () => {
       await import('@google/gemini-cli-core'),
       'getMCPServerStatus',
     ).mockReturnValue(MCPServerStatus.DISCONNECTED);
-    const { lastFrame } = render(<McpStatus {...baseProps} />);
+    const { lastFrame, unmount } = render(<McpStatus {...baseProps} />);
     expect(lastFrame()).toMatchSnapshot();
+    unmount();
   });
 
   it('renders correctly when discovery is in progress', () => {
-    const { lastFrame } = render(
+    const { lastFrame, unmount } = render(
       <McpStatus {...baseProps} discoveryInProgress={true} />,
     );
     expect(lastFrame()).toMatchSnapshot();
+    unmount();
   });
 
   it('renders correctly with schema enabled', () => {
-    const { lastFrame } = render(
+    const { lastFrame, unmount } = render(
       <McpStatus {...baseProps} showSchema={true} />,
     );
     expect(lastFrame()).toMatchSnapshot();
+    unmount();
   });
 
   it('renders correctly with parametersJsonSchema', () => {
-    const { lastFrame } = render(
+    const { lastFrame, unmount } = render(
       <McpStatus
         {...baseProps}
         tools={[
@@ -120,10 +127,11 @@ describe('McpStatus', () => {
       />,
     );
     expect(lastFrame()).toMatchSnapshot();
+    unmount();
   });
 
   it('renders correctly with prompts', () => {
-    const { lastFrame } = render(
+    const { lastFrame, unmount } = render(
       <McpStatus
         {...baseProps}
         prompts={[
@@ -136,22 +144,25 @@ describe('McpStatus', () => {
       />,
     );
     expect(lastFrame()).toMatchSnapshot();
+    unmount();
   });
 
   it('renders correctly with a blocked server', () => {
-    const { lastFrame } = render(
+    const { lastFrame, unmount } = render(
       <McpStatus
         {...baseProps}
         blockedServers={[{ name: 'server-1', extensionName: 'test-extension' }]}
       />,
     );
     expect(lastFrame()).toMatchSnapshot();
+    unmount();
   });
 
   it('renders correctly with a connecting server', () => {
-    const { lastFrame } = render(
+    const { lastFrame, unmount } = render(
       <McpStatus {...baseProps} connectingServers={['server-1']} />,
     );
     expect(lastFrame()).toMatchSnapshot();
+    unmount();
   });
 });