diff --git a/UNRELEASED.md b/UNRELEASED.md
index 1f1dc720af4..afe6136381d 100644
--- a/UNRELEASED.md
+++ b/UNRELEASED.md
@@ -12,6 +12,7 @@
### Bug fixes
- Added an outline on `Banner` for Windows high contrast mode ([#2878](https://github.com/Shopify/polaris-react/pull/2878))
+- Fixed Autocomplete / ComboBox focus ([#1089](https://github.com/Shopify/polaris-react/issues/1089))
### Documentation
diff --git a/src/components/Autocomplete/components/ComboBox/ComboBox.tsx b/src/components/Autocomplete/components/ComboBox/ComboBox.tsx
index f901efeda9a..f98ec2a0696 100644
--- a/src/components/Autocomplete/components/ComboBox/ComboBox.tsx
+++ b/src/components/Autocomplete/components/ComboBox/ComboBox.tsx
@@ -317,7 +317,7 @@ export function ComboBox({
aria-haspopup
onFocus={forcePopoverActiveTrue}
onBlur={handleBlur}
- tabIndex={0}
+ tabIndex={options.length === 0 ? -1 : 0}
>
', () => {
expect(optionListOptions[1].value).toBe('macaroni_pizza');
expect(optionListOptions[1].label).toBe('Macaroni Pizza');
});
+
+ it.each([
+ [options, 0],
+ [[], -1],
+ ])('sets tabIndex depending of number of options', (options, tabIndex) => {
+ const comboBox = mountWithApp(
+ ,
+ );
+
+ expect(comboBox.find('div', {role: 'combobox'})).toHaveReactProps({
+ tabIndex,
+ });
+ });
});
describe('contentBefore and contentAfter', () => {