diff --git a/src/ng/animator.js b/src/ng/animator.js index 7f0f7b7a8d1b..3682a567b862 100644 --- a/src/ng/animator.js +++ b/src/ng/animator.js @@ -276,8 +276,11 @@ var $AnimatorProvider = function() { var vendorTransitionProp = $sniffer.vendorPrefix + 'Transition'; var w3cTransitionProp = 'transition'; //one day all browsers will have this - var durationKey = 'Duration'; - var duration = 0; + var durationKey = 'Duration', + delayKey = 'Delay', + duration = 0, + delay = 0; + //we want all the styles defined before and after forEach(element, function(element) { var globalStyles = $window.getComputedStyle(element) || {}; @@ -286,8 +289,14 @@ var $AnimatorProvider = function() { parseFloat(globalStyles[vendorTransitionProp + durationKey]) || 0, duration); + + delay = Math.max( + parseFloat(globalStyles[w3cTransitionProp + delayKey]) || + parseFloat(globalStyles[vendorTransitionProp + delayKey]) || + 0, + delay); }); - $window.setTimeout(done, duration * 1000); + $window.setTimeout(done, (duration + delay) * 1000); } else { done(); } diff --git a/test/ng/animatorSpec.js b/test/ng/animatorSpec.js index 4d549ee393ca..803d5f3bc618 100644 --- a/test/ng/animatorSpec.js +++ b/test/ng/animatorSpec.js @@ -301,7 +301,7 @@ describe("$animator", function() { module(function($animationProvider, $provide) { $provide.value('$window', window = angular.mock.createMockWindow()); return function($sniffer, _$rootElement_, $animator) { - vendorPrefix = '-' + $sniffer.vendorPrefix + '-'; + vendorPrefix = '-' + $sniffer.vendorPrefix.toLowerCase() + '-'; $rootElement = _$rootElement_; $animator.enabled(true); }; @@ -333,6 +333,25 @@ describe("$animator", function() { } expect(element[0].style.display).toBe(''); })); + + it("should consider a CSS3 delay if set within the setup class", + inject(function($animator, $rootScope, $compile, $sniffer) { + + var style = vendorPrefix + 'transition: 1s linear all;' + + vendorPrefix + 'transition-delay: 8s;'; + + element = $compile(html('
1
'))($rootScope); + var animator = $animator($rootScope, { + ngAnimate : '{show: \'custom-show\'}' + }); + + animator.show(element); + if ($sniffer.supportsTransitions) { + window.setTimeout.expect(1).process(); + window.setTimeout.expect(9000).process(); + } + })); + }); it("should throw an error when an invalid ng-animate syntax is provided", inject(function($compile, $rootScope) {