Dropdown: Clicking on "No results found." leads to hard to remove text from input

[nreijmersdal]

Steps

1. Type enough characters in a "fluid multiple selection search" dropdown until "No results found." is displayed.
2. Click "No results found."
3. Double click the empty space right of the typed text to select it. Do not double click the text itself.
4. Press backspace or delete

Expected Result

The text is removed

Actual Result

Text stays selected

Notes

• Semantic-UI doesn't allow clicking on "No results found."
• Only with fluid, text selection works fine without fluid.
• Maybe click on "No results found." should just remove the text just as if you click outside the dropdown to cancel it.

Version

Semantic-UI 2.2.9
React Semantic-UI 0.67.0

Testcase

http://codepen.io/nreijmersdal/pen/JWJbbg

[levithomason]

Having a hard time reproducing this, what am I missing?

[nreijmersdal]

@levithomason thanks for your effort. Seems you need to double click more to the right. Like in the middle of the bar. Its about 200pixels right from the text during my testing.

Could also be a Chrome (Version 56.0.2924.87 64-bit) issue. Haven't tested on other browsers.

[levithomason]

Ah yes, it appears the issue is that the search input is far too narrow:

It would appear this is also the case in SUI core:

However, the core Dropdown focuses the search input when the Dropdown is clicked. We need to implement something similar.

[ozzy432836]

Is it possible to add a click event to no results found? I have put a compnent that returns an Icon with an onClick event instead of a string and it works but I get an error Failed prop type: Invalid prop noResultsMessage of type object supplied to Dropdown, expected string.