Autocomplete crash in multiple selection mode

[stevemoncada]

When multiple selections are enabled on an Autocomplete component, it's possible to crash the component by

1. Clearing all options
2. Selecting a valid option
3. Pressing Enter

This can be duplicated on the Autocomplete demo page.

• The issue is present in the latest release.
• I have searched the issues of this repository and believe that this is not a duplicate.

Current Behavior 😯

I am using a similar getOptionLabel function as the demo page, where the title property of the given option is returned as the label. Instead of the Enter keypress being ignored when no value is selected, an undefined filter value is passed along and the getOptionLabel can't resolve a property of an undefined error.

Expected Behavior 🤔

Empty filter values should short-circuit long before the getOptionLabel function is called.

Steps to Reproduce 🕹

See above.

Context 🔦

A workaround for this looks like this in code:

getOptionLabel={option => (option ? option.title : '')}

and this in the Autocomplete text field...

... which is nasty.

Your Environment 🌎

As mentioned above, this happens on the Autocomplete demo page using Chrome 78. This seems like a pretty straightforward bug.

[oliviertassinari]

@stevemoncada Thank you for the report, It's the same root cause as #18211. The proposed fix applies here too.

[oliviertassinari]

Maybe Sunday