onFocus and onBlur not called

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.

[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.