search

primefaces / primereact

The Most Complete React UI Component Library
https://primereact.org
MIT License
6.85k stars 1.04k forks source link

MultiSelect: onBlur event mismatch #2833

Open dominikj111 opened 2 years ago

dominikj111 commented 2 years ago

Describe the bug

The component's event "onBlur" is fired on, not only when focus is lost.

Reproducer

https://codesandbox.io/s/objective-wind-13w45j?file=/src/App.jsx:448-459

PrimeReact version

7.2.1

React version

17.x

Language

ALL

Build / Runtime

Create React App (CRA)

Browser(s)

No response

Steps to reproduce the behavior

1a. click on the MultiSelect to show the list of options 2a. pick any option 3a. onBlur event will increase counter above

1b. click on the MultiSelect to show the list of options and then click on filter input or "select all" checkbox 2b. onBlur event will increase counter above

Expected behavior

The onBlur event should to be triggered only when then component as a whole will lost the focus.

So it shouldn't be triggered during options selection nor filtering, but only when user will click (on|to) some(thing|where) else.

melloware commented 2 years ago

I fixed this by not calling onBlur if the Overlay is showing. This seems to fix the issue and blur is only called now when you leave the field with the overlay closed.

JosuerBague commented 2 months ago

Encountered similar behaviour today, but onBlur only gets called on the initial option selection after the panel first shows.

JosuerBague commented 2 months ago

Oh I guess it gets triggered, because the focus switches from the multiSelect input to the multiSelect option thus triggering the onBlur event.

melloware commented 2 months ago

Yes as part of ARIA WCAG accesibility that is what accessibility says should happen @JosuerBague .