React-select: onFocus and onBlur not called

[ooflorent]

NOTE: The issue was encountered in 1.0.0-beta5

When the <Select/> component is not searchable, neither onFocus nor onBlur are called when interacting with the component. I don't think it is the expected behaviour.

[cedricdelpoux]

I agree with @ooflorent. I encountered this error.

I needed the onFocus et onBlur events on my <Select /> and the only fix I found was to add the searchable prop.

But I don't want my <Select /> to be searchable.

[IgorKirei]

Seems it doesn't matter for author. So many questions without any response.

[choonkending]

@IgorKirey Sometimes a repo maintainer could be busy with their own work and life. I know there might be a lot of issues that do not have a response (and I understand the frustration), but what we can do as a community is to try our best to provide support + try our best to give a hand in projects we care about. That's the power of Open Source right? :)

---

Issue related info
Have been encountering the same issue but only on IE Edge.

Browser: IE Edge (IE13)
OS: Windows 10
react-select version: beta-13

The onBlur event is working on Chrome and Safari, but not on Edge.

            <Select
                {...this.props}
                multi={true}
                searchable={false}
                clearable={true}
                autofocus={true}
                openAfterFocus={true}/>

I'm unsure what the root cause is, whether it is a React 15 problem or whether it's a react-select issue.

Any help would be appreciated!

[loopmode]

This works just fine:

export default class Select extends PureComponent {
    static propTypes = {
        onFocus: PropTypes.func,
        onBlur: PropTypes.func,
    };
    render() {
        const {onFocus, onBlur, ...props} = this.props;
        return (
            <div onFocusCapture={onFocus} onBlurCapture={onBlur}>
                <ReactSelect {...props} />
            </div>
        );
    }
}

Simply use the capturing phase on a parent element. You handle the event on its "way down" before it even reaches ReactSelect.

[j-funk]

I am having this issue in Chrome on v3, the above workaround does not work for me.