IE10/11: Menu closes when trying click+drag scroll indicator

[rethwyll]

In IE10 (Win8) and IE11 (Win8.1), when you try to click and drag the scroll indicator in the dropdown menu, the menu closes instead of scrolling. This behavior can be observed on the live demo page (http://jedwatson.github.io/react-select/) with the very first example, the "States" select.

[songz]

Ping. I am having this issue as well.

[petetnt]

Maybe not loosely enough* based on Selectize: selectize/selectize.js#182 🍔 😋

How it was fixed in Selectize: bigfox/selectize.js@0a75d45

Basically the Blur event occurs (causing handleInputBlur) to trigger when the scrollbar is clicked. This does not occur on other browsers. Investigating how to get around this ATM.

[petetnt]

Okay, the fix is pretty trivial:

    handleInputBlur (event) {
        var menuDOM = ReactDOM.findDOMNode(this.refs.menu);
        if (document.activeElement.isEqualNode(menuDOM)) {
            return;
        }

        /**/

Working branch here: https://github.com/petetnt/react-select/tree/petetnt/ie10-11-blur-fix

It needs a test though. ping @JedWatson

[nil4]

@petetnt: thank you, I can confirm your fix resolves this issue on IE 11.

[duoduoin]

@petetnt Thanks, this fixes the issue on IE9-IE11.
@JedWatson could you merge this fix and make a new release?

[petetnt]

I'll create some tests for it and fix spaces to tabs and try to create a PR for this today or tomorrow

[JedWatson]

Thanks @petetnt 😀