TransitionGroup regressions in v0.5.1

[ozanvos]

I've encountered some problems after upgrading to React v.0.5.1 and looks like there are some regressions related to the transitions addon.

Here are some test cases: v0.5.0, v0.5.1

[zpao]

cc @petehunt

#439 has the commits that went into 0.5.1. Or ea1ab55...6401681 which is easier to look at. I'm 99.99% sure it's 1b835fb you want.

I think what might be happening is that by fixing a bug, we triggered behavior you weren't expecting. If you look at the console and end state in your 0.5.0 example, no end event is triggered (because of a bug on our end) and your node still has classes on it that it shouldn't. But if you remove those classes your transition is triggered again. This happens in your 0.5.1 example.

[zpao]

Having not used TransitionGroup, I'll admit the docs could be clearer. But using those examples, I think you want the transition to be set in .card-enter. That way when the transform is applied, it happens once, but then card-enter and card-enter-active are presumably removed at the same time, so there is no transition back. If you leave the transition on .card, any changes will result in a transition. See it in action: http://jsfiddle.net/8GAwn/

[ozanvos]

@zpao Yeah, turns out I overlooked the fact that the default opacity value is 1 and looking at the documentation I thought .example-enter-active was supposed to stay enabled (of course in this scenario .example-enter class would've been redundant).

Since the card doesn't have a back face in my reduced test case the rotated card looks the same, so your version seems to what I want, but fixing the problem by moving the translation to .card-enter didn't translate well into my application. Anyhow, once I wrapped my head around the timeline it was a piece of cake. Thanks!