ComboBox default onblur behaviour

[grahamharper]

Does anyone know the rationale for why the default behaviour of ComboBox is that if text is entered into the Combobox and it does not match an item, **it will be cleared on blur. **

My assumption was always that because by default custom values/arbitrary text, was not allowed, only options from the listbox were allowed. So the behaviour to clear entered text on blur was to enforce rule.

I know it's a common behaviour e.g. React Select, Adobe Spectrum ComboBox are just two popular examples.

But, there are scenarios where this can cause issues, such as when the user is not aware of this behaviour, enters text they want to submit (which might not be an option in the list), then blurs away from the field and does not realise or notice the entered text was cleared and reverted back to the previously selected/initial value.

This can easily happen if the ComboBox is the last field in a form and the user blur away from the field but rather moves their mouse to click on the submit button. This will trigger a blur from the ComboBox but then immediately submit the form and the user will likely not notice.

Form validation won't catch this because the ComboBox was revert back to a valid value.

I'd like to be clear on what the original intent of this behaviour was before we consider customising it. One way to address this scenario might be to allowCustomValues=true so user entered values are retained on blur, then use validation on form submit to check if what the user entered exists in the listbox, and show a validation message if it doesn't.

One minor thing you would lose with this approach, would be that clearing the entered text on blur is an indicator that custom values are not allowed. Instead the user ends up having to wait until form submission to learn that custom values aren't allowed.

Anyone else faced this issue or one like it?