Semantic-Org/Semantic-UI-React

Dropdown: When clicking to close a dropdown, it fires "click" and "blur" events

Open

Aperta il 13 mar 2018

Vedi su GitHub
 (8 commenti) (0 reazioni) (0 assegnatari)JavaScript (13.136 star) (4065 fork)batch import
bughelp wanted

Descrizione

This issue happens when controlling manually (via states) the status of a dropdown.

Steps

If you click the "Not ok button" to close the drop-down you will notice that it triggers the click and blur events (It shouldn't fire blur cause I'm still inside the component).

Now, if you click the "ok button" repeatedly, you will notice that only the click event is fired, regardless if the dropdown is opening or closing, and the blur happens only when you actually click outside of the related button, as expected.

Expected Result

When clicking the "not ok button" to close a drop-down, it should fire only a click event.

Actual Result

When clicking the "not ok button" to close a drop-down, it fires a click and blur event.

Version

0.78.3 OS: High Sierra

Testcase

https://codesandbox.io/s/3q781mpvw1

Guida contributor

Tech stack
javascriptreact
Dominio
frontend
Tipo issue
bug
DifficoltàQuanto dovrebbe essere impegnativa per un nuovo contributor.
3
Tempo stimatoTempo stimato per completare e verificare uno scope piccolo.
1-3 hours
Stato attivitàQuanto è probabile che la issue sia ancora attiva e reviewable.
stale
ChiarezzaQuanto chiaramente la issue descrive problema, scope e risultato atteso.
mostly clear
Prerequisiti
basic understanding of React event handlingfamiliarity with component state management
Adatta ai principiantiQuanto la issue è adatta a contributor alla prima esperienza.
55
Direzione di ricerca
Start by examining the Dropdown component's event handler for the 'Not ok button' in the provided CodeSandbox. Investigate why clicking that button triggers a blur event while the 'ok button' does not. Look at the component's state management and how focus/blur events are handled, particularly in cases where the dropdown is closed programmatically.