diff --git a/packages/react/src/components/ComboBox/ComboBox-test.js b/packages/react/src/components/ComboBox/ComboBox-test.js index 36e0d8ee8374..bdfbf1047c93 100644 --- a/packages/react/src/components/ComboBox/ComboBox-test.js +++ b/packages/react/src/components/ComboBox/ComboBox-test.js @@ -16,6 +16,7 @@ import { generateGenericItem, } from '../ListBox/test-helpers'; import ComboBox from '../ComboBox'; +import { act } from 'react-dom/test-utils'; const findInputNode = () => screen.getByRole('combobox'); const openMenu = async () => { @@ -234,5 +235,20 @@ describe('ComboBox', () => { expect(firstListBox()).toBeEmptyDOMElement(); expect(secondListBox()).toBeEmptyDOMElement(); }); + it('should open menu without moving focus on pressing Alt+ DownArrow', async () => { + render(); + act(() => { + screen.getByRole('combobox').focus(); + }); + await userEvent.keyboard('{Alt>}{ArrowDown}'); + assertMenuOpen(mockProps); + }); + + it('should close menu and return focus to combobox on pressing Alt+ UpArrow', async () => { + render(); + await openMenu(); + await userEvent.keyboard('{Alt>}{ArrowUp}'); + assertMenuClosed(mockProps); + }); }); }); diff --git a/packages/react/src/components/ComboBox/ComboBox.tsx b/packages/react/src/components/ComboBox/ComboBox.tsx index 61914df39043..6b1f366921a0 100644 --- a/packages/react/src/components/ComboBox/ComboBox.tsx +++ b/packages/react/src/components/ComboBox/ComboBox.tsx @@ -593,6 +593,19 @@ const ComboBox = forwardRef( event.target.value.length ); } + + if (event.altKey && event.key == 'ArrowDown') { + event.preventDownshiftDefault = true; + if (!isOpen) { + toggleMenu(); + } + } + if (event.altKey && event.key == 'ArrowUp') { + event.preventDownshiftDefault = true; + if (isOpen) { + toggleMenu(); + } + } }, });