Dropdown: Fixing down arrow not cycling through options (microsoft#11770

) #### Pull request checklist - [X] Addresses an existing issue: Fixes microsoft#11768 - [X] Include a change request file using `$ yarn change` #### Description of changes Fix a bug where a user pressing the down key without opening the dropdown causes the window to scroll. The dropdown should cycle through the options. This fix changes the index from being the last item in the options to being the starting index, which is 0. #### Focus areas to test Dropdowns
onlyann · Jan 27, 2020 · 5552c26 · 5552c26
1 parent 7b994e5
commit 5552c26
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 2 deletions.
diff --git a/change/office-ui-fabric-react-2020-01-22-17-52-10-dropdownAccessibilityKeyDownFix.json b/change/office-ui-fabric-react-2020-01-22-17-52-10-dropdownAccessibilityKeyDownFix.json
@@ -0,0  1,9 @@
 {
   "type": "patch",
   "comment": "Fix a bug where a user pressing the down key without opening the dropdown causes the window to scroll. The dropdown should cycle through the options. This fix changes the index from being the last item in the options to being the starting index, which is 0.",
   "packageName": "office-ui-fabric-react",
   "email": "[email protected]",
   "commit": "ad83dd6338f1d995553f889f96075cba24654e29",
   "dependentChangeType": "patch",
   "date": "2020-01-23T01:52:10.608Z"
 }
diff --git a/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.base.tsx b/packages/office-ui-fabric-react/src/components/Dropdown/Dropdown.base.tsx
@@ -424,9  424,13 @@ export class DropdownBase extends React.Component<IDropdownInternalProps, IDropd
     if (index < 0) {
       index = 0;
     }
-    // Set starting index to last option index if greater than options.length
     // Set starting index to the first option index if greater than options.length.
     // The reason is that as the user is pressing the down key without opening
     // the dropdown, the dropdown will cycle through the options. If
     // the index is set as the last option, then pressing the down key will
     // cause the whole window to scroll, if the window can be scrolled.
     if (index >= options.length) {
-      index = options.length - 1;
       index = 0;
     }
     let stepCounter = 0;
     // If current index is a header or divider, or disabled, increment by step