Vue-next: FLIP Animation not applied when first item spliced

[crutchcorn]

Version

3.0.4

Reproduction link

https://codepen.io/crutchcorn/pen/ZEpbZKX

Steps to reproduce

https://v3.vuejs.org/guide/transitions-list.html#list-move-transitions

That's at this link:

https://codepen.io/team/Vue/pen/373b4429eb5769ae2e6d097fd954fd08

Change the remove method to match:

      this.items.splice(0, 1)

What is expected?

The first item in the array is removed and an animation smooths out the other items moving into the first spot

What is actually happening?

It jerkily moves the items to the first index

[crutchcorn]

I have just ran this same issue against 2.6.12 and confirmed that it does indeed work:

https://codepen.io/crutchcorn/pen/oNzjOGm

[edison1105]

caused by this commit e2618a632d4add2819ffb8b575af0da189dc3204 in this PR #2597.

[luwuer]

It happend because transition-property: none will be added to el as inline style on the first frame, so a workaround way is using transition-property: all !important; to cover it.