Fixing initial -> animate animation when variant is the same

motiondivision · Dec 5, 2023 · 0e6d1cb · 0e6d1cb
1 parent 64e2a39
commit 0e6d1cb
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 2 deletions.
diff --git a/packages/framer-motion/src/render/utils/__tests__/animation-state.test.ts b/packages/framer-motion/src/render/utils/__tests__/animation-state.test.ts
@@ -145,6 +145,22 @@ describe("Animation state - Initiating props", () => {
         expect(animate).not.toBeCalled()
     })
 
+    test("Initial animation with prop as variant when initial === animate", () => {
+        const { state } = createTest()
+
+        const animate = mockAnimate(state)
+        state.update({
+            initial: "test",
+            animate: "test",
+            variants: {
+                test: { opacity: 1 },
+            },
+        })
+
+        expect(state.getState()["animate"].protectedKeys).toEqual({})
+        expect(animate).not.toBeCalled()
+    })
+
     test("Initial animation with prop as variant list with initial=false", () => {
         const { state } = createTest()
 

diff --git a/packages/framer-motion/src/render/utils/animation-state.ts b/packages/framer-motion/src/render/utils/animation-state.ts
@@ -340,14 +340,13 @@ export function createAnimationState(
 
         if (
             isInitialRender &&
-            props.initial === false &&
+            (props.initial === false || props.initial === props.animate) &&
             !visualElement.manuallyAnimateOnMount
         ) {
             shouldAnimate = false
         }
 
         isInitialRender = false
-
         return shouldAnimate ? animate(animations) : Promise.resolve()
     }