From 5ec40d6624ff49e14871f2a82b5432fde833a173 Mon Sep 17 00:00:00 2001
From: Chris Knabe <cknabe@us.ibm.com>
Date: Fri, 24 Jan 2025 14:28:27 -0600
Subject: [PATCH] Control ArrowUp for Dropdown (#18324)

* fix(Dropdown): 18277 - Disable arrow up on dropdown

* fix: refactor to make it easier to read and include last item

* fix: almost never allow ArrowUp for DropDown, always allow ArrowDown

* fix: add a simple test to verify arrow up and arrow down actions
---
 .../src/components/Dropdown/Dropdown.tsx      |  7 +++++-
 .../Dropdown/__tests__/Dropdown-test.js       | 23 +++++++++++++++++++
 2 files changed, 29 insertions(+), 1 deletion(-)

diff --git a/packages/react/src/components/Dropdown/Dropdown.tsx b/packages/react/src/components/Dropdown/Dropdown.tsx
index 2918866c60cb..794ccd418f0b 100644
--- a/packages/react/src/components/Dropdown/Dropdown.tsx
+++ b/packages/react/src/components/Dropdown/Dropdown.tsx
@@ -553,7 +553,12 @@ const Dropdown = React.forwardRef(
         if (['Enter'].includes(evt.key) && !selectedItem && !isOpen) {
           setIsFocused(true);
         }
-        if (toggleButtonProps.onKeyDown) {
+
+        // For Dropdowns the arrow up key is only allowed if the Dropdown is open
+        if (
+          toggleButtonProps.onKeyDown &&
+          (evt.key !== 'ArrowUp' || (isOpen && evt.key === 'ArrowUp'))
+        ) {
           toggleButtonProps.onKeyDown(evt);
         }
       },
diff --git a/packages/react/src/components/Dropdown/__tests__/Dropdown-test.js b/packages/react/src/components/Dropdown/__tests__/Dropdown-test.js
index c58e341e4347..7c374d4dfc85 100644
--- a/packages/react/src/components/Dropdown/__tests__/Dropdown-test.js
+++ b/packages/react/src/components/Dropdown/__tests__/Dropdown-test.js
@@ -180,6 +180,29 @@ describe('Dropdown', () => {
     });
   });
 
+  it('should not open on arrowUp', async () => {
+    let mockProps1 = { ...mockProps };
+    const ref = React.createRef();
+    render(<Dropdown {...mockProps1} readOnly={false} ref={ref} />);
+
+    const button = screen.getByRole('combobox');
+
+    if (button) {
+      assertMenuClosed();
+      // ArrowUp should not open the menu
+      fireEvent.keyDown(button, { key: 'ArrowUp' });
+      assertMenuClosed();
+      // ArrowDown should open the menu
+      fireEvent.keyDown(button, { key: 'ArrowDown' });
+      assertMenuOpen(mockProps1);
+      // ArrowUp is allowed now that the menu is open
+      fireEvent.keyDown(button, { key: 'ArrowUp' });
+      assertMenuOpen(mockProps1);
+    }
+
+    mockProps.onChange.mockClear();
+  });
+
   it('should respect readOnly prop', async () => {
     let onChange = jest.fn();
     let onKeyDown = jest.fn();