diff --git a/src/ngAnimate/animate.js b/src/ngAnimate/animate.js index af607568662b..7f37f143b4f9 100644 --- a/src/ngAnimate/animate.js +++ b/src/ngAnimate/animate.js @@ -627,8 +627,10 @@ angular.module('ngAnimate', ['ng']) //temporarily disable the transition so that the enter styles //don't animate twice (this is here to avoid a bug in Chrome/FF). - node.style[w3cTransitionProp + propertyKey] = 'none'; - node.style[vendorTransitionProp + propertyKey] = 'none'; + if(transitionTime > 0) { + node.style[w3cTransitionProp + propertyKey] = 'none'; + node.style[vendorTransitionProp + propertyKey] = 'none'; + } var activeClassName = ''; forEach(className.split(' '), function(klass, i) { @@ -637,8 +639,10 @@ angular.module('ngAnimate', ['ng']) //this triggers a reflow which allows for the transition animation to kick in element.prop('clientWidth'); - node.style[w3cTransitionProp + propertyKey] = ''; - node.style[vendorTransitionProp + propertyKey] = ''; + if(transitionTime > 0) { + node.style[w3cTransitionProp + propertyKey] = ''; + node.style[vendorTransitionProp + propertyKey] = ''; + } element.addClass(activeClassName); var css3AnimationEvents = [w3cAnimationEvent, vendorAnimationEvent, diff --git a/test/ngAnimate/animateSpec.js b/test/ngAnimate/animateSpec.js index adedeac4bf1f..a3a1d0b0ffb4 100644 --- a/test/ngAnimate/animateSpec.js +++ b/test/ngAnimate/animateSpec.js @@ -1270,6 +1270,36 @@ describe("ngAnimate", function() { expect(child.hasClass('ng-enter-active')).toBe(false); })); + it("should not set the transition property flag if only CSS animations are used", + inject(function($compile, $rootScope, $animate, $sniffer) { + + if (!$sniffer.animations) return; + + ss.addRule('.ani.ng-enter', 'my_animation 2s linear;' + + vendorPrefix + 'animation: my_animation 2s linear'); + + ss.addRule('.trans.ng-enter', 'transition:1s linear all;' + + vendorPrefix + 'transition:1s linear all'); + + var element = html($compile('