ensure onBeforeChange is called when clicking the rail (#822)

* ensure onBeforeChange is called when clicking the rail * add test case * hopefully fix tests, address comments
react-component · Apr 12, 2022 · 0c209f0 · 0c209f0 · vercel · Apr 12, 2022
1 parent 46936f0
commit 0c209f0
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 0 deletions.
diff --git a/src/Slider.tsx b/src/Slider.tsx
@@ -298,6 +298,7 @@ const Slider = React.forwardRef((props: SliderProps, ref: React.Ref<SliderRef>)
         cloneNextValues.push(newValue);
       }
 
+      onBeforeChange?.(getTriggerValue(cloneNextValues));
       triggerChange(cloneNextValues);
       onAfterChange?.(getTriggerValue(cloneNextValues));
     }

diff --git a/tests/Slider.test.js b/tests/Slider.test.js
@@ -537,6 +537,26 @@ describe('Slider', () => {
 
       expect(onChange).toHaveBeenCalledWith([20, 20]);
     });
+
+    it('should call onBeforeChange, onChange, and onAfterChange', () => {
+      const onBeforeChange = jest.fn();
+      const onChange = jest.fn();
+      const onAfterChange = jest.fn();
+      const { container } = render(
+        <Slider
+          onBeforeChange={onBeforeChange}
+          onChange={onChange}
+          onAfterChange={onAfterChange}
+        />,
+      );
+      fireEvent.mouseDown(container.querySelector('.rc-slider'), {
+        clientX: 20,
+      });
+
+      expect(onBeforeChange).toHaveBeenCalledWith(20);
+      expect(onChange).toHaveBeenCalledWith(20);
+      expect(onAfterChange).toHaveBeenCalledWith(20);
+    });
   });
 
   it('autoFocus', () => {