diff --git a/src/components/Select/Select.tsx b/src/components/Select/Select.tsx index c098f9fd4..2c3340a3a 100644 --- a/src/components/Select/Select.tsx +++ b/src/components/Select/Select.tsx @@ -156,6 +156,10 @@ export const Select = React.forwardRef(function handleOptionClick(getActiveItem(listRef)); } } + if ([KeyCode.ARROW_DOWN, KeyCode.ARROW_UP].includes(e.key) && !open) { + e.preventDefault(); + toggleOpen(); + } listRef?.current?.onKeyDown(e); }, diff --git a/src/components/Select/__tests__/Select.base-actions.test.tsx b/src/components/Select/__tests__/Select.base-actions.test.tsx index a039a3c55..5103d0cad 100644 --- a/src/components/Select/__tests__/Select.base-actions.test.tsx +++ b/src/components/Select/__tests__/Select.base-actions.test.tsx @@ -52,6 +52,22 @@ describe('Select base actions', () => { await user.keyboard('[Space]'); getByTestId(SelectQa.POPUP); }); + + test('ArrowUp', async () => { + const {getByTestId} = setup(); + const user = userEvent.setup(); + await user.keyboard('[Tab]'); + await user.keyboard('[ArrowUp]'); + getByTestId(SelectQa.POPUP); + }); + + test('ArrowDown', async () => { + const {getByTestId} = setup(); + const user = userEvent.setup(); + await user.keyboard('[Tab]'); + await user.keyboard('[ArrowDown]'); + getByTestId(SelectQa.POPUP); + }); }); describe('initial state', () => { diff --git a/src/components/controls/TextArea/__tests__/TextArea.test.tsx b/src/components/controls/TextArea/__tests__/TextArea.test.tsx index 90e1441b6..b5b918b6a 100644 --- a/src/components/controls/TextArea/__tests__/TextArea.test.tsx +++ b/src/components/controls/TextArea/__tests__/TextArea.test.tsx @@ -39,19 +39,17 @@ describe('TextArea', () => { render(