feat-bug(aria/combobox-listbox): listbox `[multi]="true"` works only for combobox `readonly` true

[silveoj]

Feature Description

If listbox's multi=true and combobox's readonly=false we can select only one item. We can only type first letters of countries. And select only one country. We can't use even standard , separator.

If listbox's multi=true and combobox's readonly=true we can open combobox/listbox and select multiple items.

See live: stackblitz

Use Case

It's useful for multiselect, autocomplete

[AdrianRomanski]

@crisbeto @silveoj I'm starting to work on this bug. Expect to deliver it until the end of the week (hopefully faster :D)

[crisbeto]

I have a suspicion that we aren't supposed to support this since the selection relies on arrow keys and you can use the arrow keys while typing as well (e.g. to move the caret forward/backwards). cc @wagnermaciel @ok7sai

[AdrianRomanski]

Current behaviour:

Select with only Arrrows and Enter

1. Tab - focus on input

2. Arrow down - focus move on first item

3. Enter - item selected

4. Arrow down - focus move on first item

5. Enter - item selected, visible in input field, but values are empty [BUG SPOTTED?]

6. Arrow down - focus move on first item

7. Enter - item selected, only one is selected (we should have 3), value is again visible in values (only the last one)

[AdrianRomanski]

The above Bug does not appear with readonly set to true

[AdrianRomanski]

Autocomplete enabled for second and subsequent entries

Besides that i think it should be nice, if we select a value, and still have a chance to use autocomplete.

Let's imagine sitation when im looking for Andorra, Mozampique, and Yemen.
I know exacly what countries i want to select, but still need to click arrows multiple times in order to reach given countries.

Selecting Andorra

I start by typing 'And' got the Andorra!

Selecting Mozampique.

Pressing enter have no effect, Pressing space actually changes the value for used Autocomplete.

Adding M to trigger Autocomplete changes the value used for Autocomplete

ArrowDown/ArrowUp have no effect, because there is only one country called Andorra, so we got one result

Solutions

What comes to my mind is to either

1. After selection to add separator, move the carret after it and allow selections with Autocomplete
2. Add the user ability to add separators on its own