primeng icon indicating copy to clipboard operation
primeng copied to clipboard

MultiSelect: Invisible chips have enabled clear buttons

Open szlezakbartosz opened this issue 1 year ago • 0 comments

Describe the bug

When adding chips to multiselect component, the chips that do not fit the input are still generated (at least some of them). Even though they are invisible, they still have active clear buttons. Because of that it's possible to remove the chip eg. when trying to open the dropdown. It is reproducable in the docs:

https://github.com/primefaces/primeng/assets/97099991/40fb130a-4b4b-4a4e-980e-dc7eab6013ad

Environment

Reproducer

No response

Angular version

17.3.1

PrimeNG version

17.16.0

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

18.19.0

Browser(s)

No response

Steps to reproduce the behavior

  1. Open multiselect dropdown
  2. Select multiple items
  3. Inspect the input and look for invisible chip's remove button
  4. Click the invisible button
  5. Chip is removed and item is deselected

Expected behavior

Invisible items should not allow interactions. If the chips need to be generated even though they are not visible, the remove buttons should be disabled.

szlezakbartosz avatar May 07 '24 11:05 szlezakbartosz