framer / motion

Open source, production-ready animation and gesture library for React
https://framer.com/motion
MIT License
22.27k stars 733 forks source link

Fix animating between unit type and `0` with keyframes #2646

Closed mattgperry closed 1 week ago

mattgperry commented 2 weeks ago

This PR fixes animating between 0 and unit types when multiple keyframes are defined:

animate({ y: ["100%", 0] })

There has always been a bug (unfixed by this PR) where, when multiple keyframes of mixed type are provided, Motion will perform measurements to convert the types to the same, animatable, type.

The bug is that the initial state will be measured as the element currently is, not what the explicit initial keyframe has been provided as (in this case "100%").

This PR fixes this situation by ensuring 0 is converted to the same value type (in this case %) and also brings the performance benefit of skipping measurements in this case.