fix: Hitting enter doesn't submit in FluentCombobox
🐛 Bug Report
Hitting enter key when focus is inside a FluentCombobox doesn't submit the form.
💻 Repro or Code Sample
🤔 Expected Behavior
I would expect that hitting enter would close the combobox if it is open (and change the value if an option is selected on enter). I would then expect that hitting enter again (while combobox is closed) would submit the form.
😯 Current Behavior
Nothing happens.
💁 Possible Solution
🔦 Context
🌍 Your Environment
- OS & Device: [e.g. MacOS, iOS, Windows, Linux] on [iPhone 7, PC]
- Browser [e.g. Microsoft Edge, Google Chrome, Apple Safari, Mozilla FireFox]
- .NET and Fluent UI Blazor library Version [e.g. 8.0.2 and 4.4.1]
There are some known issues with input (TextField, TextArea, etc) web components and enter key behavior. See also #1050 and #1085. As the Combobox uses a Fluent text field internally, I can imagine that this component is affected as well.
I'll do some more investigating.
This behavior is referred to as implicit form submission: https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#implicit-submission
The good news is this is built into the <fluent-text-input> v3 component. And the team said they will make sure to do the same for combobox.
The bad news is it won't get fixed here...