@machina.ai/cell-cli 1.11.0-rc1 → 1.13.0-rc1

package/dist/src/ui/hooks/useSlashCompletion.test.js

@@ -3,12 +3,12 @@
  * Copyright 2025 Google LLC
  * SPDX-License-Identifier: Apache-2.0
  */
-/** @vitest-environment jsdom */
 import { describe, it, expect, vi } from 'vitest';
-import { renderHook, waitFor } from '@testing-library/react';
+import { act, useState } from 'react';
+import { renderHook } from '../../test-utils/render.js';
+import { waitFor } from '../../test-utils/async.js';
 import { useSlashCompletion } from './useSlashCompletion.js';
 import { CommandKind } from '../commands/types.js';
-import { useState } from 'react';
 function createTestCommand(command) {
     return {
         kind: CommandKind.BUILT_IN, // default for tests
@@ -154,25 +154,67 @@ describe('useSlashCompletion', () => {
                 }),
                 createTestCommand({ name: 'chat', description: 'Manage chat history' }),
             ];
-            const { result } = renderHook(() => useTestHarnessForSlashCompletion(true, '/', slashCommands, mockCommandContext));
-            expect(result.current.suggestions.length).toBe(slashCommands.length);
-            expect(result.current.suggestions.map((s) => s.label)).toEqual(expect.arrayContaining(['help', 'clear', 'memory', 'chat', 'stats']));
+            let result;
+            let unmount;
+            await act(async () => {
+                const hook = renderHook(() => useTestHarnessForSlashCompletion(true, '/', slashCommands, mockCommandContext));
+                result = hook.result;
+                unmount = hook.unmount;
+            });
+            await act(async () => {
+                await waitFor(() => {
+                    expect(result.current.suggestions.length).toBe(slashCommands.length);
+                    expect(result.current.suggestions.map((s) => s.label)).toEqual(expect.arrayContaining([
+                        'help',
+                        'clear',
+                        'memory',
+                        'chat',
+                        'stats',
+                    ]));
+                });
+            });
+            unmount();
         });
         it('should filter commands based on partial input', async () => {
             const slashCommands = [
                 createTestCommand({ name: 'memory', description: 'Manage memory' }),
             ];
-            const { result } = renderHook(() => useTestHarnessForSlashCompletion(true, '/mem', slashCommands, mockCommandContext));
-            await waitFor(() => {
-                expect(result.current.suggestions).toEqual([
-                    {
-                        label: 'memory',
-                        value: 'memory',
-                        description: 'Manage memory',
-                        commandKind: CommandKind.BUILT_IN,
-                    },
-                ]);
+            const setSuggestions = vi.fn();
+            const setIsLoadingSuggestions = vi.fn();
+            const setIsPerfectMatch = vi.fn();
+            let result;
+            let unmount;
+            await act(async () => {
+                const hook = renderHook(() => useSlashCompletion({
+                    enabled: true,
+                    query: '/mem',
+                    slashCommands,
+                    commandContext: mockCommandContext,
+                    setSuggestions,
+                    setIsLoadingSuggestions,
+                    setIsPerfectMatch,
+                }));
+                result = hook.result;
+                unmount = hook.unmount;
+            });
+            await act(async () => {
+                await waitFor(() => {
+                    expect(setSuggestions).toHaveBeenCalledWith([
+                        {
+                            label: 'memory',
+                            value: 'memory',
+                            description: 'Manage memory',
+                            commandKind: CommandKind.BUILT_IN,
+                        },
+                    ]);
+                    expect(result.current.completionStart).toBe(1);
+                    expect(result.current.completionEnd).toBe(4);
+                });
+            });
+            await act(async () => {
+                await new Promise((resolve) => setTimeout(resolve, 50));
             });
+            unmount();
         });
         it('should suggest commands based on partial altNames', async () => {
             const slashCommands = [
@@ -182,7 +224,13 @@ describe('useSlashCompletion', () => {
                     description: 'check session stats. Usage: /stats [model|tools]',
                 }),
             ];
-            const { result } = renderHook(() => useTestHarnessForSlashCompletion(true, '/usag', slashCommands, mockCommandContext));
+            let result;
+            let unmount;
+            await act(async () => {
+                const hook = renderHook(() => useTestHarnessForSlashCompletion(true, '/usag', slashCommands, mockCommandContext));
+                result = hook.result;
+                unmount = hook.unmount;
+            });
             await waitFor(() => {
                 expect(result.current.suggestions).toEqual([
                     {
@@ -192,7 +240,9 @@ describe('useSlashCompletion', () => {
                         commandKind: CommandKind.BUILT_IN,
                     },
                 ]);
+                expect(result.current.completionStart).toBe(1);
             });
+            unmount();
         });
         it('should NOT provide suggestions for a perfectly typed command that is a leaf node', async () => {
             const slashCommands = [
@@ -202,8 +252,18 @@ describe('useSlashCompletion', () => {
                     action: vi.fn(),
                 }),
             ];
-            const { result } = renderHook(() => useTestHarnessForSlashCompletion(true, '/clear', slashCommands, mockCommandContext));
-            expect(result.current.suggestions).toHaveLength(0);
+            let result;
+            let unmount;
+            await act(async () => {
+                const hook = renderHook(() => useTestHarnessForSlashCompletion(true, '/clear', slashCommands, mockCommandContext));
+                result = hook.result;
+                unmount = hook.unmount;
+            });
+            await waitFor(() => {
+                expect(result.current.suggestions).toHaveLength(0);
+                expect(result.current.completionStart).toBe(1);
+            });
+            unmount();
         });
         it.each([['/?'], ['/usage']])('should not suggest commands when altNames is fully typed', async (query) => {
             const mockSlashCommands = [
@@ -220,22 +280,51 @@ describe('useSlashCompletion', () => {
                     action: vi.fn(),
                 }),
             ];
-            const { result } = renderHook(() => useTestHarnessForSlashCompletion(true, query, mockSlashCommands, mockCommandContext));
-            expect(result.current.suggestions).toHaveLength(0);
+            let result;
+            let unmount;
+            await act(async () => {
+                const hook = renderHook(() => useTestHarnessForSlashCompletion(true, query, mockSlashCommands, mockCommandContext));
+                result = hook.result;
+                unmount = hook.unmount;
+            });
+            await waitFor(() => {
+                expect(result.current.suggestions).toHaveLength(0);
+                expect(result.current.completionStart).toBe(1);
+            });
+            unmount();
         });
         it('should not provide suggestions for a fully typed command that has no sub-commands or argument completion', async () => {
             const slashCommands = [
                 createTestCommand({ name: 'clear', description: 'Clear the screen' }),
             ];
-            const { result } = renderHook(() => useTestHarnessForSlashCompletion(true, '/clear ', slashCommands, mockCommandContext));
-            expect(result.current.suggestions).toHaveLength(0);
+            let result;
+            let unmount;
+            await act(async () => {
+                const hook = renderHook(() => useTestHarnessForSlashCompletion(true, '/clear ', slashCommands, mockCommandContext));
+                result = hook.result;
+                unmount = hook.unmount;
+            });
+            await waitFor(() => {
+                expect(result.current.suggestions).toHaveLength(0);
+            });
+            unmount();
         });
         it('should not provide suggestions for an unknown command', async () => {
             const slashCommands = [
                 createTestCommand({ name: 'help', description: 'Show help' }),
             ];
-            const { result } = renderHook(() => useTestHarnessForSlashCompletion(true, '/unknown-command', slashCommands, mockCommandContext));
-            expect(result.current.suggestions).toHaveLength(0);
+            let result;
+            let unmount;
+            await act(async () => {
+                const hook = renderHook(() => useTestHarnessForSlashCompletion(true, '/unknown-command', slashCommands, mockCommandContext));
+                result = hook.result;
+                unmount = hook.unmount;
+            });
+            await waitFor(() => {
+                expect(result.current.suggestions).toHaveLength(0);
+                expect(result.current.completionStart).toBe(1);
+            });
+            unmount();
         });
         it('should not suggest hidden commands', async () => {
             const slashCommands = [
@@ -249,9 +338,18 @@ describe('useSlashCompletion', () => {
                     hidden: true,
                 }),
             ];
-            const { result } = renderHook(() => useTestHarnessForSlashCompletion(true, '/', slashCommands, mockCommandContext));
-            expect(result.current.suggestions.length).toBe(1);
-            expect(result.current.suggestions[0].label).toBe('visible');
+            let result;
+            let unmount;
+            await act(async () => {
+                const hook = renderHook(() => useTestHarnessForSlashCompletion(true, '/', slashCommands, mockCommandContext));
+                result = hook.result;
+                unmount = hook.unmount;
+            });
+            await waitFor(() => {
+                expect(result.current.suggestions.length).toBe(1);
+                expect(result.current.suggestions[0].label).toBe('visible');
+            });
+            unmount();
         });
     });
     describe('Sub-Commands', () => {
@@ -266,22 +364,25 @@ describe('useSlashCompletion', () => {
                     ],
                 }),
             ];
-            const { result } = renderHook(() => useTestHarnessForSlashCompletion(true, '/memory', slashCommands, mockCommandContext));
-            expect(result.current.suggestions).toHaveLength(2);
-            expect(result.current.suggestions).toEqual(expect.arrayContaining([
-                {
-                    label: 'show',
-                    value: 'show',
-                    description: 'Show memory',
-                    commandKind: CommandKind.BUILT_IN,
-                },
-                {
-                    label: 'add',
-                    value: 'add',
-                    description: 'Add to memory',
-                    commandKind: CommandKind.BUILT_IN,
-                },
-            ]));
+            const { result, unmount } = renderHook(() => useTestHarnessForSlashCompletion(true, '/memory ', slashCommands, mockCommandContext));
+            await waitFor(() => {
+                expect(result.current.suggestions).toHaveLength(2);
+                expect(result.current.suggestions).toEqual(expect.arrayContaining([
+                    {
+                        label: 'show',
+                        value: 'show',
+                        description: 'Show memory',
+                        commandKind: CommandKind.BUILT_IN,
+                    },
+                    {
+                        label: 'add',
+                        value: 'add',
+                        description: 'Add to memory',
+                        commandKind: CommandKind.BUILT_IN,
+                    },
+                ]));
+            });
+            unmount();
         });
         it('should suggest all sub-commands when the query ends with the parent command and a space', async () => {
             const slashCommands = [
@@ -294,22 +395,25 @@ describe('useSlashCompletion', () => {
                     ],
                 }),
             ];
-            const { result } = renderHook(() => useTestHarnessForSlashCompletion(true, '/memory ', slashCommands, mockCommandContext));
-            expect(result.current.suggestions).toHaveLength(2);
-            expect(result.current.suggestions).toEqual(expect.arrayContaining([
-                {
-                    label: 'show',
-                    value: 'show',
-                    description: 'Show memory',
-                    commandKind: CommandKind.BUILT_IN,
-                },
-                {
-                    label: 'add',
-                    value: 'add',
-                    description: 'Add to memory',
-                    commandKind: CommandKind.BUILT_IN,
-                },
-            ]));
+            const { result, unmount } = renderHook(() => useTestHarnessForSlashCompletion(true, '/memory ', slashCommands, mockCommandContext));
+            await waitFor(() => {
+                expect(result.current.suggestions).toHaveLength(2);
+                expect(result.current.suggestions).toEqual(expect.arrayContaining([
+                    {
+                        label: 'show',
+                        value: 'show',
+                        description: 'Show memory',
+                        commandKind: CommandKind.BUILT_IN,
+                    },
+                    {
+                        label: 'add',
+                        value: 'add',
+                        description: 'Add to memory',
+                        commandKind: CommandKind.BUILT_IN,
+                    },
+                ]));
+            });
+            unmount();
         });
         it('should filter sub-commands by prefix', async () => {
             const slashCommands = [
@@ -322,7 +426,7 @@ describe('useSlashCompletion', () => {
                     ],
                 }),
             ];
-            const { result } = renderHook(() => useTestHarnessForSlashCompletion(true, '/memory a', slashCommands, mockCommandContext));
+            const { result, unmount } = renderHook(() => useTestHarnessForSlashCompletion(true, '/memory a', slashCommands, mockCommandContext));
             await waitFor(() => {
                 expect(result.current.suggestions).toEqual([
                     {
@@ -332,7 +436,9 @@ describe('useSlashCompletion', () => {
                         commandKind: CommandKind.BUILT_IN,
                     },
                 ]);
+                expect(result.current.completionStart).toBe(8);
             });
+            unmount();
         });
         it('should provide no suggestions for an invalid sub-command', async () => {
             const slashCommands = [
@@ -345,8 +451,14 @@ describe('useSlashCompletion', () => {
                     ],
                 }),
             ];
-            const { result } = renderHook(() => useTestHarnessForSlashCompletion(true, '/memory dothisnow', slashCommands, mockCommandContext));
-            expect(result.current.suggestions).toHaveLength(0);
+            const { result, unmount } = renderHook(() => useTestHarnessForSlashCompletion(true, '/memory dothisnow', slashCommands, mockCommandContext));
+            await act(async () => {
+                await waitFor(() => {
+                    expect(result.current.suggestions).toHaveLength(0);
+                    expect(result.current.completionStart).toBe(8);
+                });
+            });
+            unmount();
         });
     });
     describe('Argument Completion', () => {
@@ -372,22 +484,29 @@ describe('useSlashCompletion', () => {
                     ],
                 }),
             ];
-            const { result } = renderHook(() => useTestHarnessForSlashCompletion(true, '/chat resume my-ch', slashCommands, mockCommandContext));
-            await waitFor(() => {
-                expect(mockCompletionFn).toHaveBeenCalledWith(expect.objectContaining({
-                    invocation: {
-                        raw: '/chat resume my-ch',
-                        name: 'resume',
-                        args: 'my-ch',
-                    },
-                }), 'my-ch');
+            const { result, unmount } = renderHook(() => useTestHarnessForSlashCompletion(true, '/chat resume my-ch', slashCommands, mockCommandContext));
+            await act(async () => {
+                await waitFor(() => {
+                    expect(mockCompletionFn).toHaveBeenCalledWith(expect.objectContaining({
+                        invocation: {
+                            raw: '/chat resume my-ch',
+                            name: 'resume',
+                            args: 'my-ch',
+                        },
+                    }), 'my-ch');
+                });
             });
-            await waitFor(() => {
-                expect(result.current.suggestions).toEqual([
-                    { label: 'my-chat-tag-1', value: 'my-chat-tag-1' },
-                    { label: 'my-chat-tag-2', value: 'my-chat-tag-2' },
-                ]);
+            await act(async () => {
+                await waitFor(() => {
+                    expect(result.current.suggestions).toEqual([
+                        { label: 'my-chat-tag-1', value: 'my-chat-tag-1' },
+                        { label: 'my-chat-tag-2', value: 'my-chat-tag-2' },
+                    ]);
+                    expect(result.current.completionStart).toBe(13);
+                    expect(result.current.isLoadingSuggestions).toBe(false);
+                });
             });
+            unmount();
         });
         it('should call command.completion with an empty string when args start with a space', async () => {
             const mockCompletionFn = vi
@@ -406,39 +525,41 @@ describe('useSlashCompletion', () => {
                     ],
                 }),
             ];
-            const { result } = renderHook(() => useTestHarnessForSlashCompletion(true, '/chat resume ', slashCommands, mockCommandContext));
-            await waitFor(() => {
-                expect(mockCompletionFn).toHaveBeenCalledWith(expect.objectContaining({
-                    invocation: {
-                        raw: '/chat resume',
-                        name: 'resume',
-                        args: '',
-                    },
-                }), '');
+            const { result, unmount } = renderHook(() => useTestHarnessForSlashCompletion(true, '/chat resume ', slashCommands, mockCommandContext));
+            await act(async () => {
+                await waitFor(() => {
+                    expect(mockCompletionFn).toHaveBeenCalledWith(expect.objectContaining({
+                        invocation: {
+                            raw: '/chat resume ',
+                            name: 'resume',
+                            args: '',
+                        },
+                    }), '');
+                });
             });
-            await waitFor(() => {
-                expect(result.current.suggestions).toHaveLength(3);
+            await act(async () => {
+                await waitFor(() => {
+                    expect(result.current.suggestions).toHaveLength(3);
+                    expect(result.current.completionStart).toBe(13);
+                });
             });
+            unmount();
         });
         it('should handle completion function that returns null', async () => {
-            const completionFn = vi.fn().mockResolvedValue(null);
+            const mockCompletionFn = vi.fn().mockResolvedValue(null);
             const slashCommands = [
                 createTestCommand({
-                    name: 'chat',
-                    description: 'Manage chat history',
-                    subCommands: [
-                        createTestCommand({
-                            name: 'resume',
-                            description: 'Resume a saved chat',
-                            completion: completionFn,
-                        }),
-                    ],
+                    name: 'test',
+                    description: 'Test command',
+                    completion: mockCompletionFn,
                 }),
             ];
-            const { result } = renderHook(() => useTestHarnessForSlashCompletion(true, '/chat resume ', slashCommands, mockCommandContext));
+            const { result, unmount } = renderHook(() => useTestHarnessForSlashCompletion(true, '/test arg', slashCommands, mockCommandContext));
             await waitFor(() => {
-                expect(result.current.suggestions).toHaveLength(0);
+                expect(result.current.suggestions).toEqual([]);
+                expect(result.current.isLoadingSuggestions).toBe(false);
             });
+            unmount();
         });
     });
     describe('Command Kind Information', () => {
@@ -457,21 +578,24 @@ describe('useSlashCompletion', () => {
                     action: vi.fn(),
                 },
             ];
-            const { result } = renderHook(() => useTestHarnessForSlashCompletion(true, '/', slashCommands, mockCommandContext));
-            expect(result.current.suggestions).toEqual(expect.arrayContaining([
-                {
-                    label: 'summarize',
-                    value: 'summarize',
-                    description: 'Summarize content',
-                    commandKind: CommandKind.MCP_PROMPT,
-                },
-                {
-                    label: 'help',
-                    value: 'help',
-                    description: 'Show help',
-                    commandKind: CommandKind.BUILT_IN,
-                },
-            ]));
+            const { result, unmount } = renderHook(() => useTestHarnessForSlashCompletion(true, '/', slashCommands, mockCommandContext));
+            await waitFor(() => {
+                expect(result.current.suggestions).toEqual(expect.arrayContaining([
+                    {
+                        label: 'summarize',
+                        value: 'summarize',
+                        description: 'Summarize content',
+                        commandKind: CommandKind.MCP_PROMPT,
+                    },
+                    {
+                        label: 'help',
+                        value: 'help',
+                        description: 'Show help',
+                        commandKind: CommandKind.BUILT_IN,
+                    },
+                ]));
+            });
+            unmount();
         });
         it('should include commandKind when filtering MCP commands by prefix', async () => {
             const slashCommands = [
@@ -488,7 +612,7 @@ describe('useSlashCompletion', () => {
                     action: vi.fn(),
                 },
             ];
-            const { result } = renderHook(() => useTestHarnessForSlashCompletion(true, '/summ', slashCommands, mockCommandContext));
+            const { result, unmount } = renderHook(() => useTestHarnessForSlashCompletion(true, '/summ', slashCommands, mockCommandContext));
             await waitFor(() => {
                 expect(result.current.suggestions).toEqual([
                     {
@@ -498,7 +622,9 @@ describe('useSlashCompletion', () => {
                         commandKind: CommandKind.MCP_PROMPT,
                     },
                 ]);
+                expect(result.current.completionStart).toBe(1);
             });
+            unmount();
         });
         it('should include commandKind for sub-commands', async () => {
             const slashCommands = [
@@ -522,21 +648,24 @@ describe('useSlashCompletion', () => {
                     ],
                 },
             ];
-            const { result } = renderHook(() => useTestHarnessForSlashCompletion(true, '/memory', slashCommands, mockCommandContext));
-            expect(result.current.suggestions).toEqual(expect.arrayContaining([
-                {
-                    label: 'show',
-                    value: 'show',
-                    description: 'Show memory',
-                    commandKind: CommandKind.BUILT_IN,
-                },
-                {
-                    label: 'add',
-                    value: 'add',
-                    description: 'Add to memory',
-                    commandKind: CommandKind.MCP_PROMPT,
-                },
-            ]));
+            const { result, unmount } = renderHook(() => useTestHarnessForSlashCompletion(true, '/memory', slashCommands, mockCommandContext));
+            await waitFor(() => {
+                expect(result.current.suggestions).toEqual(expect.arrayContaining([
+                    {
+                        label: 'show',
+                        value: 'show',
+                        description: 'Show memory',
+                        commandKind: CommandKind.BUILT_IN,
+                    },
+                    {
+                        label: 'add',
+                        value: 'add',
+                        description: 'Add to memory',
+                        commandKind: CommandKind.MCP_PROMPT,
+                    },
+                ]));
+            });
+            unmount();
         });
         it('should include commandKind for file commands', async () => {
             const slashCommands = [
@@ -547,7 +676,7 @@ describe('useSlashCompletion', () => {
                     action: vi.fn(),
                 },
             ];
-            const { result } = renderHook(() => useTestHarnessForSlashCompletion(true, '/custom', slashCommands, mockCommandContext));
+            const { result, unmount } = renderHook(() => useTestHarnessForSlashCompletion(true, '/custom', slashCommands, mockCommandContext));
             await waitFor(() => {
                 expect(result.current.suggestions).toEqual([
                     {
@@ -557,10 +686,12 @@ describe('useSlashCompletion', () => {
                         commandKind: CommandKind.FILE,
                     },
                 ]);
+                expect(result.current.completionStart).toBe(1);
             });
+            unmount();
         });
     });
-    it('should not call shared callbacks when disabled', () => {
+    it('should not call shared callbacks when disabled', async () => {
         const mockSetSuggestions = vi.fn();
         const mockSetIsLoadingSuggestions = vi.fn();
         const mockSetIsPerfectMatch = vi.fn();
@@ -570,7 +701,7 @@ describe('useSlashCompletion', () => {
                 description: 'Show help',
             }),
         ];
-        const { rerender } = renderHook(({ enabled, query }) => useSlashCompletion({
+        const { rerender, unmount } = renderHook(({ enabled, query }) => useSlashCompletion({
             enabled,
             query,
             slashCommands,
@@ -588,10 +719,17 @@ describe('useSlashCompletion', () => {
         // Change query while disabled (simulating @ completion typing)
         rerender({ enabled: false, query: '@src/file.ts' });
         rerender({ enabled: false, query: '@src/file.tsx' });
+        // Wait for any internal async operations to settle to avoid act warnings
+        await act(async () => {
+            await new Promise((resolve) => setTimeout(resolve, 0));
+        });
         // Should not have called shared callbacks during @ completion typing
-        expect(mockSetSuggestions).not.toHaveBeenCalled();
-        expect(mockSetIsLoadingSuggestions).not.toHaveBeenCalled();
-        expect(mockSetIsPerfectMatch).not.toHaveBeenCalled();
+        await waitFor(() => {
+            expect(mockSetSuggestions).not.toHaveBeenCalled();
+            expect(mockSetIsLoadingSuggestions).not.toHaveBeenCalled();
+            expect(mockSetIsPerfectMatch).not.toHaveBeenCalled();
+        });
+        unmount();
     });
 });
 //# sourceMappingURL=useSlashCompletion.test.js.map