fluentui-blazor icon indicating copy to clipboard operation
fluentui-blazor copied to clipboard

fix: Hitting enter doesn't submit in FluentCombobox

Open JamesNK opened this issue 1 year ago • 2 comments

🐛 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]

JamesNK avatar Sep 27 '24 03:09 JamesNK

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.

vnbaaij avatar Sep 28 '24 11:09 vnbaaij

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...

vnbaaij avatar Oct 07 '24 20:10 vnbaaij