Migrate tests to use avoid jsdom (#12118)

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

@@ -4,10 +4,8 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-/** @vitest-environment jsdom */
-
 import { renderWithProviders } from '../../test-utils/render.js';
-import { waitFor, act } from '@testing-library/react';
+import { act } from 'react';
 import { vi } from 'vitest';
 import { FolderTrustDialog } from './FolderTrustDialog.js';
 import * as processUtils from '../../utils/processUtils.js';
@@ -56,12 +54,12 @@ describe('FolderTrustDialog', () => {
       stdin.write('\u001b[27u'); // Press kitty escape key
     });
 
-    await waitFor(() => {
+    await vi.waitFor(() => {
       expect(lastFrame()).toContain(
         'A folder trust level must be selected to continue. Exiting since escape was pressed.',
       );
     });
-    await waitFor(() => {
+    await vi.waitFor(() => {
       expect(mockedExit).toHaveBeenCalledWith(1);
     });
     expect(onSelect).not.toHaveBeenCalled();
@@ -95,7 +93,7 @@ describe('FolderTrustDialog', () => {
       stdin.write('r');
     });
 
-    await waitFor(() => {
+    await vi.waitFor(() => {
       expect(mockedExit).not.toHaveBeenCalled();
     });
   });

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

@@ -4,8 +4,6 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-/** @vitest-environment jsdom */
-
 import { render } from 'ink-testing-library';
 import { describe, it, expect } from 'vitest';
 import { Help } from './Help.js';

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

@@ -4,9 +4,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-/** @vitest-environment jsdom */
-
-import { render, cleanup } from '@testing-library/react';
+import { render, cleanup } from 'ink-testing-library';
 import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest';
 import {
   DEFAULT_GEMINI_FLASH_LITE_MODEL,
@@ -82,12 +80,12 @@ describe('<ModelDialog />', () => {
   });
 
   it('renders the title and help text', () => {
-    const { getByText } = renderComponent();
-    expect(getByText('Select Model')).toBeDefined();
-    expect(getByText('(Press Esc to close)')).toBeDefined();
-    expect(
-      getByText('> To use a specific Gemini model, use the --model flag.'),
-    ).toBeDefined();
+    const { lastFrame } = renderComponent();
+    expect(lastFrame()).toContain('Select Model');
+    expect(lastFrame()).toContain('(Press Esc to close)');
+    expect(lastFrame()).toContain(
+      '> To use a specific Gemini model, use the --model flag.',
+    );
   });
 
   it('passes all model options to DescriptiveRadioButtonSelect', () => {

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

@@ -4,16 +4,12 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-/** @vitest-environment jsdom */
-
-/// <reference types="vitest/globals" />
-
 import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest';
 import type { Mock } from 'vitest';
 import { renderWithProviders } from '../../test-utils/render.js';
 import { PermissionsModifyTrustDialog } from './PermissionsModifyTrustDialog.js';
 import { TrustLevel } from '../../config/trustedFolders.js';
-import { waitFor, act } from '@testing-library/react';
+import { act } from 'react';
 import * as processUtils from '../../utils/processUtils.js';
 import { usePermissionsModifyTrust } from '../hooks/usePermissionsModifyTrust.js';
 
@@ -72,7 +68,7 @@ describe('PermissionsModifyTrustDialog', () => {
       <PermissionsModifyTrustDialog onExit={vi.fn()} addItem={vi.fn()} />,
     );
 
-    await waitFor(() => {
+    await vi.waitFor(() => {
       expect(lastFrame()).toContain('Modify Trust Level');
       expect(lastFrame()).toContain('Folder: /test/dir');
       expect(lastFrame()).toContain('Current Level: DO_NOT_TRUST');
@@ -94,7 +90,7 @@ describe('PermissionsModifyTrustDialog', () => {
       <PermissionsModifyTrustDialog onExit={vi.fn()} addItem={vi.fn()} />,
     );
 
-    await waitFor(() => {
+    await vi.waitFor(() => {
       expect(lastFrame()).toContain(
         'Note: This folder behaves as a trusted folder because one of the parent folders is trusted.',
       );
@@ -116,7 +112,7 @@ describe('PermissionsModifyTrustDialog', () => {
       <PermissionsModifyTrustDialog onExit={vi.fn()} addItem={vi.fn()} />,
     );
 
-    await waitFor(() => {
+    await vi.waitFor(() => {
       expect(lastFrame()).toContain(
         'Note: This folder behaves as a trusted folder because the connected IDE workspace is trusted.',
       );
@@ -128,7 +124,7 @@ describe('PermissionsModifyTrustDialog', () => {
       <PermissionsModifyTrustDialog onExit={vi.fn()} addItem={vi.fn()} />,
     );
 
-    await waitFor(() => {
+    await vi.waitFor(() => {
       expect(lastFrame()).toContain('Trust this folder (dir)');
       expect(lastFrame()).toContain('Trust parent folder (test)');
     });
@@ -140,13 +136,13 @@ describe('PermissionsModifyTrustDialog', () => {
       <PermissionsModifyTrustDialog onExit={onExit} addItem={vi.fn()} />,
     );
 
-    await waitFor(() => expect(lastFrame()).not.toContain('Loading...'));
+    await vi.waitFor(() => expect(lastFrame()).not.toContain('Loading...'));
 
     act(() => {
       stdin.write('\u001b[27u'); // Kitty escape key
     });
 
-    await waitFor(() => {
+    await vi.waitFor(() => {
       expect(onExit).toHaveBeenCalled();
     });
   });
@@ -171,11 +167,11 @@ describe('PermissionsModifyTrustDialog', () => {
       <PermissionsModifyTrustDialog onExit={onExit} addItem={vi.fn()} />,
     );
 
-    await waitFor(() => expect(lastFrame()).not.toContain('Loading...'));
+    await vi.waitFor(() => expect(lastFrame()).not.toContain('Loading...'));
 
     act(() => stdin.write('r')); // Press 'r' to restart
 
-    await waitFor(() => {
+    await vi.waitFor(() => {
       expect(mockCommitTrustLevelChange).toHaveBeenCalled();
       expect(mockRelaunchApp).toHaveBeenCalled();
       expect(onExit).toHaveBeenCalled();
@@ -201,11 +197,11 @@ describe('PermissionsModifyTrustDialog', () => {
       <PermissionsModifyTrustDialog onExit={onExit} addItem={vi.fn()} />,
     );
 
-    await waitFor(() => expect(lastFrame()).not.toContain('Loading...'));
+    await vi.waitFor(() => expect(lastFrame()).not.toContain('Loading...'));
 
     act(() => stdin.write('\u001b[27u')); // Press kitty escape key
 
-    await waitFor(() => {
+    await vi.waitFor(() => {
       expect(mockCommitTrustLevelChange).not.toHaveBeenCalled();
       expect(onExit).toHaveBeenCalled();
     });

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

@@ -4,8 +4,6 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-/** @vitest-environment jsdom */
-
 /**
  *
  *
@@ -30,7 +28,6 @@ import { LoadedSettings, SettingScope } from '../../config/settings.js';
 import { VimModeProvider } from '../contexts/VimModeContext.js';
 import { KeypressProvider } from '../contexts/KeypressContext.js';
 import { act } from 'react';
-import { waitFor } from '@testing-library/react';
 import { saveModifiedSettings, TEST_ONLY } from '../../utils/settingsUtils.js';
 import {
   getSettingsSchema,
@@ -408,7 +405,7 @@ describe('SettingsDialog', () => {
       const { stdin, unmount, lastFrame } = render(component);
 
       // Wait for initial render and verify we're on Vim Mode (first setting)
-      await waitFor(() => {
+      await vi.waitFor(() => {
         expect(lastFrame()).toContain('● Vim Mode');
       });
 
@@ -416,7 +413,7 @@ describe('SettingsDialog', () => {
       act(() => {
         stdin.write(TerminalKeys.DOWN_ARROW as string);
       });
-      await waitFor(() => {
+      await vi.waitFor(() => {
         expect(lastFrame()).toContain('● Disable Auto Update');
       });
 
@@ -425,14 +422,14 @@ describe('SettingsDialog', () => {
         stdin.write(TerminalKeys.ENTER as string);
       });
       // Wait for the setting change to be processed
-      await waitFor(() => {
+      await vi.waitFor(() => {
         expect(
           vi.mocked(saveModifiedSettings).mock.calls.length,
         ).toBeGreaterThan(0);
       });
 
       // Wait for the mock to be called
-      await waitFor(() => {
+      await vi.waitFor(() => {
         expect(vi.mocked(saveModifiedSettings)).toHaveBeenCalled();
       });
 
@@ -470,7 +467,7 @@ describe('SettingsDialog', () => {
         await wait();
         stdin.write(TerminalKeys.ENTER as string);
         await wait();
-        await waitFor(() => {
+        await vi.waitFor(() => {
           expect(vi.mocked(saveModifiedSettings)).toHaveBeenCalled();
         });
 
@@ -507,7 +504,7 @@ describe('SettingsDialog', () => {
         await wait();
         stdin.write(TerminalKeys.ENTER as string);
         await wait();
-        await waitFor(() => {
+        await vi.waitFor(() => {
           expect(vi.mocked(saveModifiedSettings)).toHaveBeenCalled();
         });
 
@@ -596,7 +593,7 @@ describe('SettingsDialog', () => {
       );
 
       // Wait for initial render
-      await waitFor(() => {
+      await vi.waitFor(() => {
         expect(lastFrame()).toContain('Vim Mode');
       });
 
@@ -668,7 +665,7 @@ describe('SettingsDialog', () => {
       );
 
       // Wait for initial render
-      await waitFor(() => {
+      await vi.waitFor(() => {
         expect(lastFrame()).toContain('Hide Window Title');
       });
 
@@ -964,7 +961,7 @@ describe('SettingsDialog', () => {
         await wait(50);
       }
 
-      await waitFor(() => {
+      await vi.waitFor(() => {
         expect(
           vi.mocked(saveModifiedSettings).mock.calls.length,
         ).toBeGreaterThan(0);
@@ -1024,7 +1021,7 @@ describe('SettingsDialog', () => {
         await wait(30);
       }
 
-      await waitFor(() => {
+      await vi.waitFor(() => {
         expect(
           vi.mocked(saveModifiedSettings).mock.calls.length,
         ).toBeGreaterThan(0);
@@ -1141,7 +1138,7 @@ describe('SettingsDialog', () => {
       );
 
       // Wait for initial render
-      await waitFor(() => {
+      await vi.waitFor(() => {
         expect(lastFrame()).toContain('Vim Mode');
       });
 
@@ -1203,7 +1200,7 @@ describe('SettingsDialog', () => {
       );
 
       // Wait for initial render
-      await waitFor(() => {
+      await vi.waitFor(() => {
         expect(lastFrame()).toContain('Vim Mode');
       });
 

packages/cli/src/ui/components/shared/BaseSelectionList.test.tsx

@@ -4,10 +4,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-/** @vitest-environment jsdom */
-
 import { describe, it, expect, vi, beforeEach } from 'vitest';
-import { waitFor } from '@testing-library/react';
 import { renderWithProviders } from '../../../test-utils/render.js';
 import {
   BaseSelectionList,
@@ -301,7 +298,7 @@ describe('BaseSelectionList', () => {
 
         rerender(<BaseSelectionList {...componentProps} />);
 
-        await waitFor(() => {
+        await vi.waitFor(() => {
           expect(lastFrame()).toBeTruthy();
         });
       };
@@ -325,7 +322,7 @@ describe('BaseSelectionList', () => {
       // New visible window should be Items 2, 3, 4 (scroll offset 1).
       await updateActiveIndex(3);
 
-      await waitFor(() => {
+      await vi.waitFor(() => {
         const output = lastFrame();
         expect(output).not.toContain('Item 1');
         expect(output).toContain('Item 2');
@@ -339,7 +336,7 @@ describe('BaseSelectionList', () => {
 
       await updateActiveIndex(4);
 
-      await waitFor(() => {
+      await vi.waitFor(() => {
         const output = lastFrame();
         expect(output).toContain('Item 3'); // Should see items 3, 4, 5
         expect(output).toContain('Item 5');
@@ -350,7 +347,7 @@ describe('BaseSelectionList', () => {
       // This should trigger scroll up to show items 2, 3, 4
       await updateActiveIndex(1);
 
-      await waitFor(() => {
+      await vi.waitFor(() => {
         const output = lastFrame();
         expect(output).toContain('Item 2');
         expect(output).toContain('Item 4');
@@ -364,7 +361,7 @@ describe('BaseSelectionList', () => {
       // Visible items: 8, 9, 10.
       const { lastFrame } = renderScrollableList(9);
 
-      await waitFor(() => {
+      await vi.waitFor(() => {
         const output = lastFrame();
         expect(output).toContain('Item 10');
         expect(output).toContain('Item 8');
@@ -383,14 +380,14 @@ describe('BaseSelectionList', () => {
       expect(lastFrame()).toContain('Item 1');
 
       await updateActiveIndex(3); // Should trigger scroll
-      await waitFor(() => {
+      await vi.waitFor(() => {
         const output = lastFrame();
         expect(output).toContain('Item 2');
         expect(output).toContain('Item 4');
         expect(output).not.toContain('Item 1');
       });
       await updateActiveIndex(5); // Scroll further
-      await waitFor(() => {
+      await vi.waitFor(() => {
         const output = lastFrame();
         expect(output).toContain('Item 4');
         expect(output).toContain('Item 6');
@@ -417,7 +414,7 @@ describe('BaseSelectionList', () => {
     it('should correctly identify the selected item when scrolled (high index)', async () => {
       renderScrollableList(5);
 
-      await waitFor(() => {
+      await vi.waitFor(() => {
         // Item 6 (index 5) should be selected
         expect(mockRenderItem).toHaveBeenCalledWith(
           expect.objectContaining({ value: 'Item 6' }),
@@ -475,7 +472,7 @@ describe('BaseSelectionList', () => {
         0,
       );
 
-      await waitFor(() => {
+      await vi.waitFor(() => {
         const output = lastFrame();
         // At the top, should show first 3 items
         expect(output).toContain('Item 1');
@@ -493,7 +490,7 @@ describe('BaseSelectionList', () => {
         5,
       );
 
-      await waitFor(() => {
+      await vi.waitFor(() => {
         const output = lastFrame();
         // After scrolling to middle, should see items around index 5
         expect(output).toContain('Item 4');
@@ -512,7 +509,7 @@ describe('BaseSelectionList', () => {
         9,
       );
 
-      await waitFor(() => {
+      await vi.waitFor(() => {
         const output = lastFrame();
         // At the end, should show last 3 items
         expect(output).toContain('Item 8');

packages/cli/src/ui/components/shared/text-buffer.test.ts

@@ -4,11 +4,10 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-/** @vitest-environment jsdom */
-
 import { describe, it, expect, beforeEach } from 'vitest';
 import stripAnsi from 'strip-ansi';
-import { renderHook, act } from '@testing-library/react';
+import { act } from 'react';
+import { renderHook } from '../../../test-utils/render.js';
 import type {
   Viewport,
   TextBuffer,