diff --git a/packages/mui-material/src/Autocomplete/Autocomplete.test.js b/packages/mui-material/src/Autocomplete/Autocomplete.test.js index 5cd4baf0fa8acc..21c26420b14f15 100644 --- a/packages/mui-material/src/Autocomplete/Autocomplete.test.js +++ b/packages/mui-material/src/Autocomplete/Autocomplete.test.js @@ -1322,6 +1322,18 @@ describe('', () => { expect(handleOpen.callCount).to.equal(1); }); + it('should not focus the input when clicking helper text', async () => { + const { user } = render( + } + />, + ); + + await user.click(screen.getByText('Some help')); + expect(screen.getByRole('combobox')).not.toHaveFocus(); + }); + it('does not clear the textbox on Escape', () => { const handleChange = spy(); render( diff --git a/packages/mui-material/src/useAutocomplete/useAutocomplete.js b/packages/mui-material/src/useAutocomplete/useAutocomplete.js index 7636dac70aa74d..d7fcf90dd72845 100644 --- a/packages/mui-material/src/useAutocomplete/useAutocomplete.js +++ b/packages/mui-material/src/useAutocomplete/useAutocomplete.js @@ -1155,6 +1155,10 @@ function useAutocomplete(props) { if (!event.currentTarget.contains(event.target)) { return; } + // Don't interfere with interactions outside the input area (e.g. helper text) + if (anchorEl && !anchorEl.contains(event.target)) { + return; + } if (event.target.getAttribute('id') !== id) { event.preventDefault(); } @@ -1166,6 +1170,10 @@ function useAutocomplete(props) { if (!event.currentTarget.contains(event.target)) { return; } + // Don't interfere with interactions outside the input area (e.g. helper text) + if (anchorEl && !anchorEl.contains(event.target)) { + return; + } inputRef.current.focus(); if (