Animation bug when remove element

[DonSalvador]

When the wrapper is positioned at the bottom, a bug is shown in the animation when removing an item. Reproduction with Vue

[vixducis]

I encountered the same issue in a react project, implementing a snackbar-like component.

[galaxyblur]

This seems to occur less often with a higher duration, which points to maybe a race condition in calculating the element's offset vs starting its animation.

[syropian]

Same issue for me in a React project. I have two containers in a flex context (with flex-direction: column) and the second container is pushed to the bottom using margin-top: auto, which contains an animated <ul> list that is suffering the same jankiness when deleting items as OP

[drmercer]

Not sure if this is exactly the same issue, but vertical centering also causes a glitch on exit. If you apply these styles to the demo at https://auto-animate.formkit.com/ , then elements pop upwards when you remove them from the list:

#demo > div > [data-has-animation=true] {
  display: flex;
  flex-direction: column;
  justify-content: center;
}