Dropdown won't open in IE if openOnFocus is false

[cattermo]

Steps

1. I have a dropdown with search and selection enabled and openOnFocus={false}
2. I open the website in Internet explorer 11
3. I click the dropdown with the mouse

Expected Result

The dropdown should open when clicked.

Actual Result

I get a javascript error from this row in the code:
if (options[nextIndex].disabled) return _this.moveSelectionBy(offset, nextIndex);
saying that options[nextIndex] is undefined
The dropdown don't open

Version

0.64.5

[levithomason]

Thanks for the report. Can you please paste the full error or a screenshot of it? Also, a working codepen will help us debug more thoroughly.

@layershifter I'm guessing this is due to different event handling on windows, could you confirm?

[layershifter]

I'll check it on my PC tomorrow.

[cattermo]

Sadly my Internet Explorer is locked to Swedish (work computer) so the error messages was not so usable. I will try to reproduce the bug on codepen tomorrow.

[cattermo]

So here is a pen http://codepen.io/cattermo/pen/zNeqpY
The dropdown does open some times but it's very unreliable and seems to depend a bit on where I click (on the text, on the arrow, on the whitespace etc).
I'm on Windows 7 with Internet Explorer 11.0.9600.18499

I can't reproduce the javascript error, I will have to look into why that occurs in our app but not in the pen.

[levithomason]

Thanks, getting closer here. Could you list specifically what happens when you click each of those parts? Example:

• clicking text, opens dropdown
• clicking dropdown icon, does not open
• clicking whitespace inside the search field, throws error

Something like this will help us track down which event handlers need looked into.

[cattermo]

My results are:

• clicking once on placeholder text, does not open
• double clicking on placeholder text, opens dropdown (!)
• clicking once on arrow, does not open
• double clicking on arrow, opens dropdown (!)
• clicking on whitespace, opens dropdown
• double clicking on whitespace, opens and closes dropdown (as expected)

In summary everything works fine when clicking on the whitespace (between placeholder text and arrow) but clicking the arrow or the placeholder text requires a double click to make the dropdown open.

[cattermo]

We still have this problem in IE11 if anyone has the time to take a look...

[layershifter]

@cattermo I lost this issue from my sight. I've checked Dropdown's docs, but can't reproduce issue. Can you make a codepen with mininal code that shows error in IE?

[cattermo]

The bug can still be reproduced in the pen here http://codepen.io/cattermo/pen/zNeqpY (updated with semantic-ui-react 0.68.2) @layershifter

I still have the same results as my comment from feb 14 says.

[layershifter]

@cattermo Oh, I missed that codepen was already there. It's a known bug with onBlur and IE (facebook/react#3751).

PR is here (#1667), will be awesome to get a feedback.