components icon indicating copy to clipboard operation
components copied to clipboard

bug(CdkListbox): cdkOption requires additional event to rerender after list of options changed

Open degloman opened this issue 1 year ago • 1 comments

Is this a regression?

  • [ ] Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

No response

Description

When any option was selected in the list and than user filtered them somehow and back to the initial list, that selected option will be rendered incorrectly.

https://github.com/angular/components/assets/13451032/4392054a-68e3-439e-a250-0084c943d37d

P.S. A bit similar problem was there: https://github.com/angular/components/issues/28557

Reproduction

StackBlitz link: https://stackblitz.com/edit/stackblitz-starters-xvgkha?file=src%2Findex.html,src%2Fmain.ts Steps to reproduce:

  1. Click "Ron" option (it becomes true)
  2. Type in input letter "J"
  3. Remove letter "J"
  4. See that option "Ron" is false.
  5. Type in input letter "R" or click outside input
  6. See that option "Ron" is true.

Expected Behavior

Option should be rendered immediately based on its internal state (isSelected()/isActive()).

Actual Behavior

Option requires one more event to be rendered based on its internal state (isSelected()/isActive()).

Environment

  • Angular: 17
  • CDK/Material: 17.3.3
  • Browser(s): Chrome and Safari
  • Operating System (e.g. Windows, macOS, Ubuntu):

degloman avatar Apr 05 '24 09:04 degloman

It seems like this flag isn't being updated as expected https://github.com/angular/components/blob/main/src/cdk/listbox/listbox.ts#L895.

crisbeto avatar May 22 '24 15:05 crisbeto