react: CSSTransitionGroup transitions don't fire reliably unless `transition` set on -active class
Here is an example of how <ReactCSSTransitionGroup> is explained in the README:
http://jsfiddle.net/deadlyicon/kb3gN/4984/
It works.
Here is that same example except I’ve added a componentDidMount method that focuses a button within the component being transitioned:
http://jsfiddle.net/deadlyicon/kb3gN/4985/
Notice how the enter transition fails to animate.
This is possibly a browser bug but I thought I’d let you know anyway.
It’s also worth noting that this bug can be worked around by moving the transition out of .example-enter and into .example-enter.example-enter-active like so:
http://jsfiddle.net/deadlyicon/kb3gN/4986/
Hope this helps improve React 😄
About this issue
- Original URL
- State: closed
- Created 10 years ago
- Comments: 15 (7 by maintainers)
Thanks for the fiddle! The bug happens also when the
autoFocusattribute gets added to the Close button.