fix: v8 ComboBox button is no longer aria-hidden by default (#26050)

microsoft · Dec 22, 2022 · 36af377 · 36af377
1 parent 68c1cd9
commit 36af377
Show file tree

Hide file tree

Showing 5 changed files with 11 additions and 10 deletions.
diff --git a/change/@fluentui-react-b2a0ebef-487f-495f-b9b6-e90e361cb18b.json b/change/@fluentui-react-b2a0ebef-487f-495f-b9b6-e90e361cb18b.json
@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "fix: ComboBox button is not aria-hidden by default",
+  "packageName": "@fluentui/react",
+  "email": "[email protected]",
+  "dependentChangeType": "patch"
+}
diff --git a/packages/react-experiments/src/components/Pagination/__snapshots__/Pagination.test.tsx.snap b/packages/react-experiments/src/components/Pagination/__snapshots__/Pagination.test.tsx.snap
@@ -1585,7 +1585,6 @@ exports[`Pagination render comboBox Pagination correctly 1`] = `
         value="1"
       />
       <button
-        aria-hidden={true}
         className=
             ms-Button
             ms-Button--icon

diff --git a/packages/react/src/components/ComboBox/ComboBox.tsx b/packages/react/src/components/ComboBox/ComboBox.tsx
@@ -570,7 +570,7 @@ class ComboBoxInternal extends React.Component<IComboBoxInternalProps, IComboBox
       required,
       errorMessage,
       buttonIconProps,
-      isButtonAriaHidden = true,
+      isButtonAriaHidden,
       title,
       placeholder: placeholderProp,
       tabIndex,

diff --git a/packages/react/src/components/ComboBox/ComboBox.types.ts b/packages/react/src/components/ComboBox/ComboBox.types.ts
@@ -246,10 +246,9 @@ export interface IComboBoxProps
   dropdownMaxWidth?: number;
 
   /**
-   * Whether to hide the ComboBox's caret (expand) button element from screen readers. This is true
-   * (hidden) by default because all functionality is handled by the input element, and the arrow
-   * button is only meant to be decorative.
-   * @defaultvalue true
+   * Whether to hide the ComboBox's caret (expand) button element from screen readers. This is false
+   * (exposed to AT) by default because Android Talkback cannot otherwise expand the combobox.
+   * @defaultvalue false
    */
   isButtonAriaHidden?: boolean;
 

diff --git a/packages/react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap b/packages/react/src/components/ComboBox/__snapshots__/ComboBox.test.tsx.snap
@@ -202,7 +202,6 @@ exports[`ComboBox Renders correctly 1`] = `
         value="testValue"
       />
       <button
-        aria-hidden="true"
         class=
             ms-Button
             ms-Button--icon
@@ -533,7 +532,6 @@ exports[`ComboBox Renders correctly when open 1`] = `
         value="Option 2"
       />
       <button
-        aria-hidden="true"
         class=
             ms-Button
             ms-Button--icon
@@ -1302,7 +1300,6 @@ exports[`ComboBox Renders correctly when opened in multi-select mode 1`] = `
         value=""
       />
       <button
-        aria-hidden="true"
         class=
             ms-Button
             ms-Button--icon
@@ -2193,7 +2190,6 @@ exports[`ComboBox renders with a Keytip correctly 1`] = `
         value=""
       />
       <button
-        aria-hidden="true"
         class=
             ms-Button
             ms-Button--icon