Version 8.6.3 is a breaking version

[yanmaoyuan]

We use rc-slider within a popup. The popup listens to onBlur to close. This is causing the popup to close while we are moving the slider.

onEnd = () => { this.setState({ handle: null, }, this.blur); this.removeDocumentEvents(); this.removeDocumentEvents(); this.props.onAfterChange(this.getValue()); this.props.onAfterChange(this.getValue()); } }

[rakelley]

This is the set of changes from #371 , introduced in 8.5.0. I've spent some time going in circles on a fix and haven't found one that universally works yet.

There are two fundamental problems:

• Clicking a handle focuses the handle, but the focus does not bubble, so any parent container thinks the slider is no longer focused. This is easily fixable by removing utils.pauseEvent(e) from createSlider.onFocus.
• Releasing a handle blurs everything and focuses nothing, so any parent container treats the slider as no longer focused. This has no easy solution.

The Range.onEnd -> createSlider.blur chain is the culprit, as it's called both when a handle is released and when the slider is blurred, and blurs all handles.

• Not blurring all handles leads to handles becoming "sticky", after dragging a handle you have to click a new handle once to focus it before you can drag the new handle.
• Focusing the slider after blurring all handles causes actual instances of the slider becoming unfocused to be ignored, as the same function chain is triggered by createSlider.onBlur, which will of course be triggered if you click on some other page element with the slider focused.
• Blurring handles but stopping the propagation of the blur event prevents sticky handles, but it's impossible to distinguish between "handle was manually blurred" and "handle was blurred by user clicking somewhere else", so again the slider itself becomes functionally sticky.

Maybe someone with more familiarity with the code base has some idea, in the mean time 8.4.1 works fine for us.