diff --git a/packages/mui-material/src/Autocomplete/Autocomplete.test.js b/packages/mui-material/src/Autocomplete/Autocomplete.test.js index b650fe7dd72f96..92ea3f757eee7e 100644 --- a/packages/mui-material/src/Autocomplete/Autocomplete.test.js +++ b/packages/mui-material/src/Autocomplete/Autocomplete.test.js @@ -3752,4 +3752,40 @@ describe('', () => { expect(screen.getByTestId('label')).to.have.attribute('data-shrink', 'false'); }); + + // https://github.com/mui/material-ui/issues/47203 + it('should not scroll the listbox to the top when listbox is scrolled down and one of the end option is clicked', function test() { + if (window.navigator.userAgent.includes('jsdom')) { + this.skip(); + } + + render( + } + slotProps={{ listbox: { style: { padding: 0, maxHeight: '100px' } } }} + />, + ); + const textbox = screen.getByRole('combobox'); + + // open listbox + fireEvent.mouseDown(textbox); + + // close listbox + fireEvent.mouseDown(textbox); + + // re-open listbox + fireEvent.mouseDown(textbox); + + const listbox = screen.getByRole('listbox'); + const options = screen.getAllByRole('option'); + + listbox.scrollBy(0, 180); + + fireEvent.click(options[4]); + + expect(listbox).not.to.have.property('scrollTop', 0); + }); }); diff --git a/packages/mui-material/src/useAutocomplete/useAutocomplete.js b/packages/mui-material/src/useAutocomplete/useAutocomplete.js index 7c8116dd6baf33..2c993e9359febb 100644 --- a/packages/mui-material/src/useAutocomplete/useAutocomplete.js +++ b/packages/mui-material/src/useAutocomplete/useAutocomplete.js @@ -615,10 +615,10 @@ function useAutocomplete(props) { } React.useEffect(() => { - if (filteredOptionsChanged || popupOpen) { + if (filteredOptionsChanged || (popupOpen && !disableCloseOnSelect)) { syncHighlightedIndex(); } - }, [syncHighlightedIndex, filteredOptionsChanged, popupOpen]); + }, [syncHighlightedIndex, filteredOptionsChanged, popupOpen, disableCloseOnSelect]); const handleOpen = (event) => { if (open) {