diff --git a/apps/app/src/components/commands/CommandPalette.test.tsx b/apps/app/src/components/commands/CommandPalette.test.tsx index 5cedfc05d72..3e184d150b9 100644 --- a/apps/app/src/components/commands/CommandPalette.test.tsx +++ b/apps/app/src/components/commands/CommandPalette.test.tsx @@ -319,6 +319,33 @@ describe("CommandPalette", () => { expect(document.activeElement).toBe(screen.getByTestId("origin")); }); + it("keeps composition confirmation separate from command activation", async () => { + renderPalette(); + openPalette(); + await waitFor(() => expect(searchField()).toBeTruthy()); + + fireEvent.change(searchField(), { target: { value: ">toggle panel" } }); + await waitFor(() => + expect(selectedOption()?.textContent).toContain("Toggle panel"), + ); + const input = searchField(); + const confirmation = new KeyboardEvent("keydown", { + key: "Enter", + isComposing: true, + bubbles: true, + cancelable: true, + }); + fireEvent(input, confirmation); + + expect(confirmation.defaultPrevented).toBe(false); + expect(screen.queryByRole("combobox")).toBe(input); + expect(testState.calls).toEqual([]); + + fireEvent.keyDown(input, { key: "Enter" }); + await waitFor(() => expect(testState.calls).toEqual(["panel.toggle"])); + expect(screen.queryByRole("combobox")).toBeNull(); + }); + it("runs a compact selection once after restoring focus", async () => { renderPalette(true); openPalette(); diff --git a/apps/app/src/components/commands/CommandPalette.tsx b/apps/app/src/components/commands/CommandPalette.tsx index cbac0ad6082..5013503a967 100644 --- a/apps/app/src/components/commands/CommandPalette.tsx +++ b/apps/app/src/components/commands/CommandPalette.tsx @@ -262,6 +262,7 @@ export function CommandPalette({ threadId, projectId }: CommandPaletteProps) { const handleKeyDown = useCallback( (event: ReactKeyboardEvent) => { + if (event.nativeEvent.isComposing) return; if (resultCount === 0) return; if (event.key === "ArrowDown") { event.preventDefault();