fix(Dropdown): update text when item selected with keyboard

[ayastreb]

Fixes #2161
the text on dropdown wasn't updated when item is selected with keyboard after search because searchQuery wasn't cleared if there are multiple search results (it is cleared if there's only one search result). And if searchQuery is not cleared, we do not update text in renderText

[codecov-io]

Codecov Report

Merging #2162 into master will increase coverage by 0.03%.
The diff coverage is 100%.

@@            Coverage Diff             @@
##           master    #2162      +/-   ##
==========================================
+ Coverage   99.73%   99.76%   +0.03%     
==========================================
  Files         151      151              
  Lines        2611     2600      -11     
==========================================
- Hits         2604     2594      -10     
+ Misses          7        6       -1

Impacted Files	Coverage Δ
src/modules/Dropdown/Dropdown.js	100% <100%> (ø)	⬆️
src/elements/Step/StepGroup.js	100% <0%> (ø)	⬆️
src/views/Statistic/StatisticValue.js	100% <0%> (ø)	⬆️
src/modules/Modal/Modal.js	100% <0%> (ø)	⬆️
src/elements/Step/Step.js	100% <0%> (ø)	⬆️
src/views/Statistic/StatisticGroup.js	100% <0%> (ø)	⬆️
src/elements/Step/StepTitle.js	100% <0%> (ø)	⬆️
src/views/Statistic/Statistic.js	100% <0%> (ø)	⬆️
src/modules/Popup/Popup.js	100% <0%> (ø)	⬆️
src/elements/Step/StepDescription.js	100% <0%> (ø)	⬆️
... and 4 more

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update bc417d9...e3529a9. Read the comment docs.

[layershifter]

@ayastreb Thanks for the PR, this needs more investigation as it's opposite change to #2112

[layershifter]

Our behaviour should match to SUI:

• https://semantic-ui.com/modules/dropdown.html#search-selection
• https://semantic-ui.com/modules/dropdown.html#multiple-search-selection

[layershifter]

In fact, problem comes from condition with optionSize, which was added in #1956. As I think, we should clear searchQuery always, all other cases can be manually handled by user with searchQuery prop.

As I see the following change will not break any test:

-if (isAdditionItem || optionSize === 1) this.clearSearchQuery()
+this.clearSearchQuery()

@levithomason can you clarify?

[levithomason]

Always clearing seems like the correct solution to me. @ayastreb are there any issues with this feature if we always clear the search query?

[ayastreb]

@levithomason seems to be no issues, all tests are green and it works as expected.

[levithomason]

Thanks guys!

[levithomason]

Released in [email protected]

[scottrblock]

Hi @ayastreb and @levithomason, I'm curious as to why this is only the expected behavior if the item is selected with a keyboard. It currently seems that if there are multiple options and one is clicked with the mouse, the searchQuery is not cleared.

This can be handled by locally managing the searchQuery state and clearing it onClose, but I would expect the same default behavior for selecting an item from the keyboard or mouse.

[levithomason]

Agreed. It should be consistent. This was an oversight. A new issue and PR would be much appreciated.