Skip to content

[Autocomplete] regression in behavior for freeSolo Autocomplete with custom Popper/Paper and no options #44048

@snapwich

Description

@snapwich

Steps to reproduce

Old behavior: https://stackblitz.com/edit/react-ouzbqw-wbhjow?file=Demo.tsx,package.json
New behavior: https://stackblitz.com/edit/react-ouzbqw-vpfhhc?file=Demo.tsx,package.json'

Steps:

  1. Open autocomplete and wait 3 seconds for options to be set to []
  2. click SET DEFAULT OPTIONS to reset and try again

Current behavior

When options prop is set to [] the Autocomplete Popper is no longer rendered. The Autocomplete's state still considers itself open and the onClose handler is not called. Any custom Popper/Paper used in the Autocomplete will not be rendered.

Expected behavior

The Autocomplete stays open if you have a custom Popper/Paper so that you can display other information or maybe even a custom "No Items" option.

Context

In our case we have a custom Autocomplete used as a global site search that renders a custom Popper/Paper that includes chips that link to certain "Advanced search" options as well as contains a recently searched section (the Autocomplete's options) that will show recent results. In our current version of MUI v5.10.17 when there are no recent search options the Autocomplete can still be expanded and the Chips used to navigate to advanced search pages.

capture

capture2

However, updating to the latest 5.x version of MUI v5.16.7 (bug also present in latest 6.x version) when there are no recent search options and the Autocomplete's options prop is [] it will not open, or it will close the Autocomplete if the user has expanded it and options is asynchronously loaded and results in an empty data result. Also when the Autocomplete closes asynchronously because of options=[] it will not call onClose or update its internal open state unless the user does an action that makes it realize it is no longer open (such as clicking somewhere and causing a blur event).

This regression was introduced in #41300

Your environment

npx @mui/envinfo
  Don't forget to mention which browser you used.
  Output from `npx @mui/envinfo` goes here.

Search keywords: autocomplete freesolo no options custom popper paper

Metadata

Metadata

Labels

scope: autocompleteChanges related to the autocomplete. This includes ComboBox.type: regressionA bug, but worse, it used to behave as expected.

Projects

Status

Done

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions