Listbox: onClick and onDblClick Even Emitters not working properly

[siddhareddy]

Describe the bug

In the p-listbox when we have onClick or onDblClick event emitters, wrong values are getting emitted

In the below example, when I click on the New York selection. It emits empty value

When I change the item selected to i.e Rome. It shows the older selected value

Same issue when using the onDblClick.

Environment

Operating System : Windows 10
PrimeNG Version: 16.8.0
Angular Version: 16.2.12

Reproducer

https://stackblitz.com/edit/rjbvrn?file=src%2Fapp%2Fdemo%2Flistbox-basic-demo.html

Angular version

16.2.12

PrimeNG version

16.8.0

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

16

Browser(s)

Chrome 119

Steps to reproduce the behavior

1. Go to the demo https://stackblitz.com/edit/rjbvrn?file=src%2Fapp%2Fdemo%2Flistbox-basic-demo.html
2. Click NewYork option and you get empty value
3. Click Rome option and you will get NewYork as a result

Expected behavior

No response

[cetincakiroglu]

Thanks a lot for reporting the issue

[cetincakiroglu]

Hi,

We've checked the previous version and the current version and we've found that onClick and onChange emitters implemented wrongly. Flow should be like this:

1-) User clicks a value
2-) onClick emitter fired with the clicked option, in this step nothing is written to the model value yet. That's why your binding remains undefined.
3-) writeValue method triggered to write value to the model (selectedCity in this case), in this step your binding receives the value.
4-) onChange emitter fired with the current value of the model.

If you check the previous versions for example 16.4x, you'll see that onClick is emitted after onChange which was wrong behavior. The model value shouldn't be written on click, it should change after the click.

The previous implementation was wrong, the current one is fixed and works as it should be, thanks a lot for the feedback.