When an ng-animate-ref element is cloned before an animation, I would expect it to look exactly the same as its source element. Instead, when the source element has styling applied because of the specific context it is in (e.g. .context .source-element { background: green; }), this styling is not applied to the cloned element.

This makes the animation weird: it first snaps to the styling the .source-element would have when in no context, and then animates to its new context. Example: http://plnkr.co/edit/AXzKmQcE5BUx4NXg4cCS?p=preview. When clicking an element, it first snaps to a blue background, before animating to a black background. I would expect it to animate directly from a green to a black background.

This can be worked around by simply applying all styling directly to the source element to be animated (e.g. .source-element-in-context { background: green; } (see this plunker: http://plnkr.co/edit/Odho9WnoOm9JFv3gzzZl?p=preview), but it makes much more sense to me when angular itself applies all styling of the source element to the cloned element.