fix(reset-drag): resetState and then dragging positions wrong

When using `resetState` and then dragging the position was off.
idanen · Dec 2, 2019 · 3aae4a9 · 3aae4a9
1 parent 2887e8e
commit 3aae4a9
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 1 deletion.
diff --git a/src/lib/Draggable.jsx b/src/lib/Draggable.jsx
@@ -148,7 +148,8 @@ export function useDraggable({
 
   const resetState = useCallback(() => {
     setDelta({ x: 0, y: 0 });
-  }, [setDelta]);
+    setPrev({ x: 0, y: 0 });
+  }, [setDelta, setPrev]);
 
   return { targetRef, handleRef, getTargetProps, dragging, delta, resetState };
 }

diff --git a/src/lib/draggable.test.js b/src/lib/draggable.test.js
@@ -285,6 +285,18 @@ describe('draggable', () => {
         'translate(0px, 0px)'
       );
     });
+
+    describe('after reset', () => {
+      it('should start dragging from the original position', () => {
+        const { getByText, getByTestId, drag } = utils;
+        drag({ start: { clientX: 3, clientY: 5 }, delta: { x: 15, y: 20 } });
+        fireEvent.click(getByText(/reset/i));
+        drag({ start: { clientX: 3, clientY: 5 }, delta: { x: 15, y: 20 } });
+        expect(getByTestId('main').style.transform).to.equal(
+          'translate(15px, 20px)'
+        );
+      });
+    });
   });
 
   function Consumer(props) {