Input not cleared on blur if auto completion is enabled

[amit1911]

Currently the input is only cleared on blur when the autocomplete menu doesn't exist (given that clearOnBlur is true). I think it would be good to have an option wherein the input is always cleared on blur as otherwise the user needs to manually clear it. We just need to change the handleInputBlur function. The current version is as follows:-

handleInputBlur = (event) => {
    if (!this.autoComplete || !this.autoComplete.refs.menu) {
        if (this.props.clearOnBlur) {
            this.setState({ inputValue: '' })
        }

        this.setState({ isFocused: false })

        if (this.props.onBlur) this.props.onBlur(event)
    }
}

The first line above checks if the autocomplete menu exists. If it exists, then it bypasses the whole blur event handling. Maybe we can have another prop alwaysClearOnBlur so that the input is always cleared though I am not sure why are we not handling the blur event in this case. We can customize the handleInputBlur as follows:-

handleInputBlur = (event) => {
    if (!this.autoComplete || !this.autoComplete.refs.menu) {
        if (this.props.clearOnBlur) {
            this.setState({ inputValue: '' })
        }

        this.setState({ isFocused: false })

        if (this.props.onBlur) this.props.onBlur(event)
    }
    if (this.props.alwaysClearOnBlur) {
        this.setState({ inputValue: '' })
    }
}

[leMaik]

@amit1911 Thank you very much for the detailed report! I think that clearOnBlur should always clear on blur, so no need for a alwaysClearOnBlur prop. 😉 I'll track this as a bug.
There were some issues when clearing the input if autoComplete is enabled, though. I'll look into this on the week end. Or would you like to further investigate this issue? I'd really appreciate a PR. 😊

[amit1911]

i disabled the if (!this.autoComplete || !this.autoComplete.refs.menu) { on my local and tested and everything worked fine for me. It was clearing the input on blur for autocomplete. But this might need detailed investigation if you noticed some issues earlier. i can create a PR by just removing the if condition if you want. Not sure if there is anything else to be done here.

[leMaik]

@amit1911 Could you please check if

• auto completion still works when using only the mouse
• auto completion still works when using the arrow keys and pressing enter

We need automated tests for that. 😞

[amit1911]

okay will verify this

[amit1911]

Created the pull request #64 that fixes this issue and also verified the two things mentioned above by @leMaik

[leMaik]

Awesome, thank you very much! 👍