angular / angular/components

Angular ARIA autocomplete selecting options with mouse click or enter don't select them, only with pressing tab.

Đang mở
#32,765 1 bình luận 0 reaction 1 người được giao Được @ok7sai nhận Xem trên GitHub
area: aria/combobox P3
Ngôn ngữ chính
TypeScript
Star
25k
Fork
6.8k
Merge trung bình
1 ngày 8 giờ
Pull request đã merge (30 ngày)
91

Mô tả

### Which @angular/* package(s) are the source of the bug?

Don't known / other

### Is this a regression?

No

### Description

When I setup the Autocomplete component with Angular ARIA components, like in the example provided on the angular website. There is something weird going on with selecting the searched options with a mouse click or pressing `Enter`.

## Reproducing the "bug"
When I use the filterMode `auto-select` and I search for `n`, a sub-set of the country list will appear. If I now move to the second or third option in the list and press enter the value in the input field will be filled with the slected option. But when I check the selected option with an effect, it is the first option of the filtered list.

When you do the same filtering and navigate to the second/thrid option and instead press tab. The selected options is actually selected.

I have made a stackblitz example to show this: https://stackblitz.com/edit/stackblitz-starters-xnilgqyl?file=src%2Fmain.ts,src%2Fcomponents%2Fautocomplete.ts

Is this behaviour by design? That the selection only works on the `tab`-keypress?

## Work around
The workaround we are using right now is to also bind `query` to the `[(value)]` of the `ngComboboxInput`, this way we always get the right selection. The drawback is that we get a console error out of `ngCombobox`.
```
my-component.container.html:11 ERROR TypeError: Cannot read properties of undefined (reading 'length')
at ComboboxPattern.onFilter (_combobox-chunk.mjs:221:55)
at combobox.mjs:308:46
at untracked (_effect-chunk.mjs:403:12)
at untracked2 (_untracked-chunk.mjs:2957:10)
at combobox.mjs:308:7
at Object.phaseFn (core.mjs:2693:30)
at AfterRenderEffectSequence.hooks. (core.mjs:2729:41)
at _debug_node-chunk.mjs:4155:27
at _AfterRenderImpl.maybeTrace (_debug_node-chunk.mjs:4212:75)
at _debug_node-chunk.mjs:4153:78
```

### Please provide a link to a minimal reproduction of the bug

https://stackblitz.com/edit/stackblitz-starters-xnilgqyl?file=src%2Fmain.ts,src%2Fcomponents%2Fautocomplete.ts

### Please provide the exception or error you saw

```true

```

### Please provide the environment you discovered this bug in (run `ng version`)

```true

```

### Anything else?

_No response_

Hướng dẫn đóng góp

Mở hướng dẫn đóng góp

Đánh giá

Issue này chưa được đánh giá.

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.