diff --git a/change/@fluentui-react-87609c16-e599-49cf-91e0-2ac09923a565.json b/change/@fluentui-react-87609c16-e599-49cf-91e0-2ac09923a565.json new file mode 100644 index 0000000000000..04dce1c95fa78 --- /dev/null +++ b/change/@fluentui-react-87609c16-e599-49cf-91e0-2ac09923a565.json @@ -0,0 +1,7 @@ +{ + "type": "patch", + "comment": "Fix Dropdown to only add ARIA live region when focused", + "packageName": "@fluentui/react", + "email": "sarah.higley@microsoft.com", + "dependentChangeType": "patch" +} diff --git a/packages/react-examples/src/react/__snapshots__/ChoiceGroup.Custom.Example.tsx.shot b/packages/react-examples/src/react/__snapshots__/ChoiceGroup.Custom.Example.tsx.shot index cb2272c7c37e6..0d14f7e355ac7 100644 --- a/packages/react-examples/src/react/__snapshots__/ChoiceGroup.Custom.Example.tsx.shot +++ b/packages/react-examples/src/react/__snapshots__/ChoiceGroup.Custom.Example.tsx.shot @@ -279,9 +279,7 @@ exports[`Component Examples renders ChoiceGroup.Custom.Example.tsx correctly 1`] tabIndex={-1} > { diff --git a/packages/react/src/components/Dropdown/Dropdown.test.tsx b/packages/react/src/components/Dropdown/Dropdown.test.tsx index 8f9ce4f6a6411..dd316af8cfce9 100644 --- a/packages/react/src/components/Dropdown/Dropdown.test.tsx +++ b/packages/react/src/components/Dropdown/Dropdown.test.tsx @@ -147,6 +147,18 @@ describe('Dropdown', () => { expect(titleElement.text()).toEqual('1'); }); + it('Renders live region attributes only when focused', () => { + wrapper = mount(); + let titleElement = wrapper.find('.ms-Dropdown-title'); + + expect(titleElement.props()['aria-live']).toBeUndefined(); + + wrapper.find('.ms-Dropdown').simulate('focus'); + titleElement = wrapper.find('.ms-Dropdown-title'); + + expect(titleElement.props()['aria-live']).toEqual('polite'); + }); + it('does not change the selected item in when defaultSelectedKey changes', () => { wrapper = mount(); const titleElement = wrapper.find('.ms-Dropdown-title'); diff --git a/packages/react/src/components/Dropdown/__snapshots__/Dropdown.test.tsx.snap b/packages/react/src/components/Dropdown/__snapshots__/Dropdown.test.tsx.snap index f950491999d35..a2b32c7f96889 100644 --- a/packages/react/src/components/Dropdown/__snapshots__/Dropdown.test.tsx.snap +++ b/packages/react/src/components/Dropdown/__snapshots__/Dropdown.test.tsx.snap @@ -106,9 +106,7 @@ exports[`Dropdown multi-select Renders correctly 1`] = ` tabIndex={0} >