fix: Focus first item in menu dropdowns (#1089)

Address #992
w3c · May 8, 2024 · 8429aa6 · 8429aa6
1 parent 51ddd71
commit 8429aa6
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 3 deletions.
diff --git a/client/components/TestQueue/AssignTesterDropdown/index.jsx b/client/components/TestQueue/AssignTesterDropdown/index.jsx
@@ -115,7 +115,7 @@ const AssignTesterDropdown = ({
     };
     return (
         <LoadingStatus message={loadingMessage}>
-            <Dropdown aria-label="Assign testers menu">
+            <Dropdown focusFirstItemOnShow aria-label="Assign testers menu">
                 <Dropdown.Toggle
                     ref={dropdownAssignTesterButtonRef}
                     aria-label="Assign testers"

diff --git a/client/components/TestQueueRow/index.jsx b/client/components/TestQueueRow/index.jsx
@@ -228,7 +228,7 @@ const TestQueueRow = ({
 
     const renderOpenAsDropdown = () => {
         return (
-            <Dropdown className="open-run-as">
+            <Dropdown className="open-run-as" focusFirstItemOnShow>
                 <Dropdown.Toggle
                     id={nextId()}
                     variant="secondary"
@@ -265,7 +265,10 @@ const TestQueueRow = ({
         if (testPlanRunsWithResults.length) {
             return (
                 <>
-                    <Dropdown aria-label="Delete results menu">
+                    <Dropdown
+                        aria-label="Delete results menu"
+                        focusFirstItemOnShow
+                    >
                         <Dropdown.Toggle
                             ref={dropdownDeleteTesterResultsButtonRef}
                             variant="danger"