Dropdown fires onChange when navigating through the options with keyboard cursor (UP and DOWN) instead of when you actually select the desired option (RETURN)

Bug Report

Steps

You need a Dropdown with search and selection enabled. Then…

1. Click in the dropdown and make a search.
2. Set an onChange function that just do console.log('onChange executed').
3. Click on the Dropdown to open the options.
4. Press arrow keys up and down on the keyboard to start moving over the options.
5. You’ll see that everytime you press the key, onChange is fired (you’ll see the console.log message)

With current behavior, if your application fires some code when you select an option (loading another dropdown, showing/hiding something, etc.), that code is going to be executed when you’re moving through the options. This can be problematic, because maybe you’re reseting some state, so you can´t recover that data.

Expected Result

onChange only should be fired when you actually select one option pressing ENTER.

Actual Result

onChange is fired when you move through the options just to find the one you want to select. So, onChange is executed even if you don’t change your selection.

Version

0.82.5

Testcase

https://codesandbox.io/s/jn76nn5z5v

[quiqueg]

@rigobauer This is the default behavior by design. You can get the behavior you are expecting by setting the selectOnNavigation prop to false. https://react.semantic-ui.com/modules/dropdown/#usage-select-on-navigation

[brianespinosa]

@rigobauer This is the default behavior by design. You can get the behavior you are expecting by setting the selectOnNavigation prop to false. https://react.semantic-ui.com/modules/dropdown/#usage-select-on-navigation

Closing as this has been addressed.