feat(ngAnimate): introduce $animate.flush for unit testing

Author: matsko

src/ngMock/angular-mocks.js

@@ -782,8 +782,8 @@ angular.mock.animate = angular.module('ngAnimateMock', ['ng'])
       };
     });
 
-    $provide.decorator('$animate', ['$delegate', '$$asyncCallback', '$timeout', '$browser',
-                            function($delegate,   $$asyncCallback,   $timeout,   $browser) {
+    $provide.decorator('$animate', ['$delegate', '$$asyncCallback', '$timeout', '$browser', '$rootScope', '$$rAF',
+                            function($delegate,   $$asyncCallback,   $timeout,   $browser,   $rootScope,   $$rAF) {
       var animate = {
         queue: [],
         cancel: $delegate.cancel,
@@ -803,6 +803,43 @@ angular.mock.animate = angular.module('ngAnimateMock', ['ng'])
             fn();
           });
           reflowQueue = [];
+        },
+        flush: function() {
+          $rootScope.$digest();
+          var doNextRun, somethingFlushed = false;
+          do {
+            doNextRun = false;
+            if (reflowQueue.length) {
+              doNextRun = somethingFlushed = true;
+              this.triggerReflow();
+            }
+            if ($$rAF.queue.length) {
+              doNextRun = somethingFlushed = true;
+              $$rAF.flush();
+            }
+            if ($$asyncCallback.queue.length) {
+              doNextRun = somethingFlushed = true;
+              this.triggerCallbackEvents();
+            }
+            if (timeoutsRemaining()) {
+              var oldValue = timeoutsRemaining();
+              this.triggerCallbackPromise();
+              var newValue = timeoutsRemaining();
+              if (newValue < oldValue) {
+                doNextRun = somethingFlushed = true;
+              }
+            }
+          } while (doNextRun);
+
+          if (!somethingFlushed) {
+            throw new Error('No pending animations ready to be closed or flushed');
+          }
+
+          $rootScope.$digest();
+
+          function timeoutsRemaining() {
+            return $browser.deferredFns.length;
+          }
         }
       };
 
@@ -1752,15 +1789,16 @@ angular.mock.$TimeoutDecorator = ['$delegate', '$browser', function($delegate, $
 }];
 
 angular.mock.$RAFDecorator = ['$delegate', function($delegate) {
-  var queue = [];
-  var rafFn = function(fn) {
+  var queue, rafFn = function(fn) {
     var index = queue.length;
     queue.push(fn);
     return function() {
       queue.splice(index, 1);
     };
   };
 
+  queue = rafFn.queue = [];
+
   rafFn.supported = $delegate.supported;
 
   rafFn.flush = function() {
@@ -1773,22 +1811,22 @@ angular.mock.$RAFDecorator = ['$delegate', function($delegate) {
       queue[i]();
     }
 
-    queue = [];
+    queue.length = 0;
   };
 
   return rafFn;
 }];
 
 angular.mock.$AsyncCallbackDecorator = ['$delegate', function($delegate) {
-  var callbacks = [];
-  var addFn = function(fn) {
-    callbacks.push(fn);
+  var queue, addFn = function(fn) {
+    queue.push(fn);
   };
+  queue = addFn.queue = [];
   addFn.flush = function() {
-    angular.forEach(callbacks, function(fn) {
+    angular.forEach(queue, function(fn) {
       fn();
     });
-    callbacks = [];
+    queue.length = 0;
   };
   return addFn;
 }];

test/.jshintrc

@@ -165,6 +165,7 @@
     "spyOnlyCallsWithArgs": false,
     "createMockStyleSheet": false,
     "browserTrigger": false,
-    "jqLiteCacheSize": false
+    "jqLiteCacheSize": false,
+    "browserSupportsCssAnimations": false
   }
 }

test/helpers/privateMocks.js

@@ -56,3 +56,12 @@ function createMockStyleSheet(doc, wind) {
     }
   };
 }
+
+function browserSupportsCssAnimations() {
+  var nav = window.navigator.appVersion;
+  if (nav.indexOf('MSIE') >= 0) {
+    var version = parseInt(navigator.appVersion.match(/MSIE ([\d.]+)/)[1]);
+    return version >= 10; //only IE10+ support keyframes / transitions
+  }
+  return true;
+}

test/ng/directive/ngClassSpec.js

@@ -472,7 +472,7 @@ describe('ngClass animations', function() {
       //is spaced-out then it is required so that the original digestion
       //is kicked into gear
       $rootScope.$digest();
-      $animate.triggerCallbacks();
+      $animate.flush();
 
       expect(element.data('state')).toBe('crazy-enter');
       expect(enterComplete).toBe(true);

test/ng/directive/ngIncludeSpec.js

@@ -433,7 +433,7 @@ describe('ngInclude', function() {
 
       expect(autoScrollSpy).not.toHaveBeenCalled();
       expect($animate.queue.shift().event).toBe('enter');
-      $animate.triggerCallbacks();
+      $animate.flush();
 
       expect(autoScrollSpy).toHaveBeenCalledOnce();
     }));
@@ -450,7 +450,7 @@ describe('ngInclude', function() {
       });
 
       expect($animate.queue.shift().event).toBe('enter');
-      $animate.triggerCallbacks();
+      $animate.flush();
 
       $rootScope.$apply(function() {
         $rootScope.tpl = 'another.html';
@@ -459,7 +459,7 @@ describe('ngInclude', function() {
 
       expect($animate.queue.shift().event).toBe('leave');
       expect($animate.queue.shift().event).toBe('enter');
-      $animate.triggerCallbacks();
+      $animate.flush();
 
       $rootScope.$apply(function() {
         $rootScope.tpl = 'template.html';
@@ -468,7 +468,7 @@ describe('ngInclude', function() {
 
       expect($animate.queue.shift().event).toBe('leave');
       expect($animate.queue.shift().event).toBe('enter');
-      $animate.triggerCallbacks();
+      $animate.flush();
 
       expect(autoScrollSpy).toHaveBeenCalled();
       expect(autoScrollSpy.callCount).toBe(3);
@@ -484,7 +484,7 @@ describe('ngInclude', function() {
       });
 
       expect($animate.queue.shift().event).toBe('enter');
-      $animate.triggerCallbacks();
+      $animate.flush();
       expect(autoScrollSpy).not.toHaveBeenCalled();
     }));
 
@@ -500,7 +500,7 @@ describe('ngInclude', function() {
       });
 
       expect($animate.queue.shift().event).toBe('enter');
-      $animate.triggerCallbacks();
+      $animate.flush();
 
       $rootScope.$apply(function() {
         $rootScope.tpl = 'template.html';
@@ -522,7 +522,7 @@ describe('ngInclude', function() {
 
           $rootScope.$apply("tpl = 'template.html'");
           expect($animate.queue.shift().event).toBe('enter');
-          $animate.triggerCallbacks();
+          $animate.flush();
 
           expect(autoScrollSpy).toHaveBeenCalledOnce();
         }

test/ng/directive/ngRepeatSpec.js

@@ -1486,7 +1486,7 @@ describe('ngRepeat animations', function() {
         $rootScope.$digest();
 
         expect(element.text()).toBe('123'); // the original order should be preserved
-        $animate.triggerReflow();
+        $animate.flush();
         $timeout.flush(1500); // 1s * 1.5 closing buffer
         expect(element.text()).toBe('13');