diff --git a/dev/examples/Events-whileHover.tsx b/dev/examples/Events-whileHover.tsx index 7c580412ed..4f0351b65c 100644 --- a/dev/examples/Events-whileHover.tsx +++ b/dev/examples/Events-whileHover.tsx @@ -7,17 +7,17 @@ export function App() { setScale(scale + 1)} style={{ width: 100, height: 100, background: "white" }} + transition={{ + type: "spring", + mass: 1, + damping: 10, + stiffness: 60, + restDelta: 0.00001, + restSpeed: 0.00001, + }} /> ) } diff --git a/packages/framer-motion/src/animation/animators/waapi/create-accelerated-animation.ts b/packages/framer-motion/src/animation/animators/waapi/create-accelerated-animation.ts index 430f467251..b9b91ef204 100644 --- a/packages/framer-motion/src/animation/animators/waapi/create-accelerated-animation.ts +++ b/packages/framer-motion/src/animation/animators/waapi/create-accelerated-animation.ts @@ -227,6 +227,15 @@ export function createAcceleratedAnimation( autoplay: false, }) + console.log( + "setting with velocity", + "currentTime", + currentTime, + "value", + sampleAnimation.sample(currentTime - sampleDelta).value, + options + ) + value.setWithVelocity( sampleAnimation.sample(currentTime - sampleDelta).value, sampleAnimation.sample(currentTime).value, diff --git a/packages/framer-motion/src/value/__tests__/index.test.ts b/packages/framer-motion/src/value/__tests__/index.test.ts index e40dd19188..deaa0268d6 100644 --- a/packages/framer-motion/src/value/__tests__/index.test.ts +++ b/packages/framer-motion/src/value/__tests__/index.test.ts @@ -214,4 +214,11 @@ describe("MotionValue velocity calculations", () => { expect(Math.round(value.getVelocity())).toEqual(0) }) + + test("Velocity is correctly calculated after being set with setWithVelocity", async () => { + const value = motionValue(0) + value.set(100) + value.setWithVelocity(200, 100, 10) + expect(Math.round(value.getVelocity())).toBe(-10000) + }) })