[BUG] Svg morph, isn't really morphing

[aervxa]

Describe the bug

When i use svg morph on a path element, it just scales down path1 and scales path2 back instead of morphing, or atleast that's what it looks like

Provide a minimal reproduction demo of the bug

https://codepen.io/aervxa/pen/RNPEMEY

Detail the steps to reproduce the behavior in the minimal reproduction demo

Watch the animation, you can toggle it via the button

Describe the expected behavior

This is a codepen example doing it with GSAP
https://codepen.io/aervxa/pen/azOPYXy

Environment details

Let me know which OS and browser version you're using.

• OS: Windows 11
• Browser: Chrome and Firefox (zen)
• Version: 137.0.7151.120 and 1.13b respectively

[juliangarnier]

Thanks for reporting this. I think the issue here is that Anime.js doesn't adjust the starting point of the morphed path, this is what causes the weird "flip" effect. I have an improved version of the morph code working locally, I'll try to ship it in the next release!

[aervxa]

Oh yeah, it's a "flip" effect, not scale 😭
Thanks and goodluck! 🫡