From 36af377c3f0501b6de07bcab1c4efae743bf9f19 Mon Sep 17 00:00:00 2001
From: Sarah Higley <smhigley@users.noreply.github.com>
Date: Thu, 22 Dec 2022 08:18:59 -0800
Subject: [PATCH] fix: v8 ComboBox button is no longer aria-hidden by default
 (#26050)

---
 ...luentui-react-b2a0ebef-487f-495f-b9b6-e90e361cb18b.json | 7 +++++++
 .../Pagination/__snapshots__/Pagination.test.tsx.snap      | 1 -
 packages/react/src/components/ComboBox/ComboBox.tsx        | 2 +-
 packages/react/src/components/ComboBox/ComboBox.types.ts   | 7 +++----
 .../ComboBox/__snapshots__/ComboBox.test.tsx.snap          | 4 ----
 5 files changed, 11 insertions(+), 10 deletions(-)
 create mode 100644 change/@fluentui-react-b2a0ebef-487f-495f-b9b6-e90e361cb18b.json

diff --git a/change/@fluentui-react-b2a0ebef-487f-495f-b9b6-e90e361cb18b.json b/change/@fluentui-react-b2a0ebef-487f-495f-b9b6-e90e361cb18b.json
new file mode 100644
index 00000000000000..513cd772655a02
--- /dev/null
+++ 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": "sarah.higley@microsoft.com",
+  "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
index ad6c87d4e61d84..3722468adb3872 100644
--- 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
index af722d4c0b655d..03eb5041dd6f8e 100644
--- 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
index defcd42e141451..1514fd40943f76 100644
--- 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
index 9c7e6a7da0e94c..802b78a6b8d3fb 100644
--- 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