unexpected behaviour when using <transition> appear & mode attrib

[newbie78]

Vue.js version

2.1.10

Reproduction Link

https://jsfiddle.net/pctmfmhe/1/ - a variant with css transition
https://jsfiddle.net/jz5rrgdk/ - a variant with js transition

Steps to reproduce

css: click run on jsfiddle
js: click any button in result pane

What is Expected?

css: not working appear attribute - does not work initial animation
js: not working mode="out-in" attr - after click the button disappears block in <transition> comp. if you remove this attribute then the block does not disappear but the animation (leave & enter) is triggered simultaneously.

What is actually happening?

this is my first app on vue. I don't know =)
I want to know is the problem in my code or is it a bug?
tnx

[posva]

For the CSS one, you need to apply an appear class too since you're using custom classes (https://jsfiddle.net/posva/unup1r7h/) or manually apply the fadeIn class (https://jsfiddle.net/posva/euLu9yze/). We should at least point it out in the docs. Thanks for raising the issue!

About the JS one, you're not calling the done callbacks Velocity(el, 'fadeIn', { duration: 800, complete: done })

[newbie78]

many thanx posva!

css case it all became clear. but i think it is logical that when you specify the attribute 'apper', class of 'enter-active-class' automatically substitutes the <div>. why not?

about done(), callback I missed when reading the manual )
maybe you should add this in the api description?

tnx