ComboBox: Multi-select and other input issues

[JasonGore]

Bug Report

• Package version(s): 6.49.0
• Browser and OS versions: Chrome

Priorities and help requested:

Are you willing to submit a PR to fix? (Yes, No)

Requested priority: (Blocking, High, Normal, Low)

Products/sites affected: (if applicable)

Describe the issue:

On the 6.49.0 Fabric site, the following behavior occurs:

Actual behavior:

Input often does not update as user selects and collapses dropdown.

There are other issues related to input, so I'm going to reference them here as the cause or fix may be similar: #5917, #3061, #3055, #5834

Expected behavior:

Input updates as user selects and collapses dropdown.

If applicable, please provide a codepen repro:

Provided fixed version link above.

[JasonGore]

We should think about how we prioritize and approach #5205 given these outstanding issues.

[natalieethell]

While trying to debug #5834, it was also made apparent that ComboBox is not working properly in the most basic scenario when allowFreeform is false and autoComplete is true. I've included a screen capture below using the example on the demo page (courtesy of @kysedate):

When trying to type Arial Black or Times New Roman, it types in all caps (and doesn't autocomplete). It also does not allow text deletion, which forces the user to select a different option to start over.

[NZainchkovskiy]

Any updates on this and related issues?
Combobox is broken in many scenarios, and it's lasting a few months now.
This component is not supported any more?

[JasonGore]

We need to revisit ComboBox holistically as there are numerous issues with it combined with the context of #5205, so I'll mark this blocked for now.

[dcokely7]

There is a very similar behavior where when you have a controlled multi-select Combobox and supply a selectedkey prop, when the component renders the selected keys dont display until you give the combobox focus then click off of it. You can see this behavior on the Fabric Documentation site:
https://developer.microsoft.com/en-us/fabric#/components/ComboBox

But when you click the dropdown, you see it does in fact have items selected:

I can file a separate bug if that makes more sense.

[ecraig12345]

I was working on the examples recently, and I'm pretty sure that both the ComboBox itself AND the example code to control the items are buggy. The example code is an interesting case study on why (with the current implementation) it's very difficult to have a controlled ComboBox which allows freeform options and behaves in a reasonable manner. I also tried to make an uncontrolled+freeform example and wasn't able to.

@dcokely7 Thanks for reporting that issue. If you could open a separate GitHub issue, that might be good to help keep it from getting lost.

[StanTempAccount]

Please address this issue asap.

[micahgodbolt]

We've done a bunch of updates to the ComboBox recently. Would be good to see if this issue is still valid.

[msft-github-bot]

This issue has been automatically marked as stale because it has marked as requiring author feedback but has not had any activity for 4 days. It will be closed if no further activity occurs within 3 days of this comment. Thank you for your contributions to Fabric React!