[Core/RangeSlider] When values equal, always move the nearest handle …

…on track click (#1795)

* RangeSlider now always moves closer handle when values are equal

* Add test

packages/core/src/components/slider/rangeSlider.tsx

@@ -115,9 +115,18 @@ export class RangeSlider extends CoreSlider<IRangeSliderProps> {
     }
 
     protected nearestHandleForValue(value: number, firstHandle: Handle, secondHandle: Handle) {
-        const firstDistance = Math.abs(value - firstHandle.props.value);
+        const firstHandleValue = firstHandle.props.value;
+        const firstDistance = Math.abs(value - firstHandleValue);
         const secondDistance = Math.abs(value - secondHandle.props.value);
-        return secondDistance < firstDistance ? secondHandle : firstHandle;
+        if (firstDistance < secondDistance) {
+            return firstHandle;
+        } else if (secondDistance < firstDistance) {
+            return secondHandle;
+        } else {
+            // if the values are equal, return the handle that is *able* to move
+            // in the necessary direction.
+            return value < firstHandleValue ? firstHandle : secondHandle;
+        }
     }
 
     protected validateProps(props: IRangeSliderProps) {

packages/core/test/slider/rangeSliderTests.tsx

@@ -185,6 +185,25 @@ describe("<RangeSlider>", () => {
         assert.isTrue(changeSpy.notCalled, "onChange was called when disabled");
     });
 
+    it("when values are equal, releasing mouse on a track still moves the nearest handle", () => {
+        const NEXT_LOW_VALUE = 1;
+        const NEXT_HIGH_VALUE = 9;
+        const VALUE = 5;
+
+        const changeSpy = sinon.spy();
+        const slider = renderSlider(<RangeSlider onChange={changeSpy} value={[VALUE, VALUE]} />);
+        const tickSize = slider.state("tickSize");
+
+        slider.find(`.${Classes.SLIDER}`).simulate("mousedown", { clientX: tickSize * NEXT_LOW_VALUE });
+        assert.equal(changeSpy.callCount, 1, "lower handle invokes onChange");
+        assert.deepEqual(changeSpy.firstCall.args[0], [NEXT_LOW_VALUE, VALUE], "lower handle moves");
+        changeSpy.reset();
+
+        slider.find(`.${Classes.SLIDER}`).simulate("mousedown", { clientX: tickSize * NEXT_HIGH_VALUE });
+        assert.equal(changeSpy.callCount, 1, "higher handle invokes onChange");
+        assert.deepEqual(changeSpy.firstCall.args[0], [VALUE, NEXT_HIGH_VALUE], "higher handle moves");
+    });
+
     describe("vertical orientation", () => {
         let changeSpy: Sinon.SinonSpy;
         let releaseSpy: Sinon.SinonSpy;