test(ngRepeat): Add 'toContainQueueItem' Jasmine matcher

The 'ngRepeat animations' test group should not assume the order of items in the animation queue. This matcher searches the animation queue for an item with an expected element text and event.

Author: pondermatic

test/ng/directive/ngRepeatSpec.js

@@ -1424,15 +1424,58 @@ describe('ngRepeat animations', function() {
     };
   }));
 
+  beforeEach(function() {
+    jasmine.addMatchers({
+      toContainQueueItem: function() {
+        return {
+          compare: generateCompare(false),
+          negativeCompare: generateCompare(true)
+        };
+        function generateCompare(isNot) {
+          /**
+           * Matcher that checks that the expected element text is in the actual Array of
+           * animation queue items and that the event matches.
+           * @param {array} actual
+           * @param {string} expectedElementText
+           * @param {string} expectedEvent optional if isNot = true
+           * @returns {{pass: boolean, message: message}}
+           */
+          return function(actual, expectedElementText, expectedEvent) {
+            if (expectedEvent === undefined) {
+              expectedEvent = '';
+            }
+            var actualLength = actual.length;
+            var i;
+            var item;
+            var message = valueFn(
+              'Expected animation queue to ' + (isNot ? 'not ' : '') + 'contain an item '
+              + 'where the element\'s text is "' + expectedElementText
+              + '"' + (isNot ? '' : ' and the event is "' + expectedEvent + '"')
+            );
+            var pass = isNot;
+
+            for (i = 0; i < actualLength; i++) {
+              item = actual[i];
+              if (item.element.text() === expectedElementText) {
+                pass = item.event === expectedEvent;
+                break;
+              }
+            }
+
+            return {'pass': pass, 'message': message};
+          };
+        }
+      }
+    });
+  });
+
   afterEach(function() {
     body.empty();
   });
 
   it('should fire off the enter animation',
     inject(function($compile, $rootScope, $animate) {
 
-    var item;
-
     element = $compile(html(
       '<div><div ' +
         'ng-repeat="item in items">' +
@@ -1445,24 +1488,15 @@ describe('ngRepeat animations', function() {
     $rootScope.items = ['1','2','3'];
     $rootScope.$digest();
 
-    item = $animate.queue.shift();
-    expect(item.event).toBe('enter');
-    expect(item.element.text()).toBe('1');
-
-    item = $animate.queue.shift();
-    expect(item.event).toBe('enter');
-    expect(item.element.text()).toBe('2');
-
-    item = $animate.queue.shift();
-    expect(item.event).toBe('enter');
-    expect(item.element.text()).toBe('3');
+    expect($animate.queue).toContainQueueItem('1', 'enter');
+    expect($animate.queue).toContainQueueItem('2', 'enter');
+    expect($animate.queue).toContainQueueItem('3', 'enter');
+    $animate.queue = [];
   }));
 
   it('should fire off the leave animation',
     inject(function($compile, $rootScope, $animate) {
 
-    var item;
-
     element = $compile(html(
       '<div><div ' +
         'ng-repeat="item in items">' +
@@ -1473,24 +1507,18 @@ describe('ngRepeat animations', function() {
     $rootScope.items = ['1','2','3'];
     $rootScope.$digest();
 
-    item = $animate.queue.shift();
-    expect(item.event).toBe('enter');
-    expect(item.element.text()).toBe('1');
-
-    item = $animate.queue.shift();
-    expect(item.event).toBe('enter');
-    expect(item.element.text()).toBe('2');
-
-    item = $animate.queue.shift();
-    expect(item.event).toBe('enter');
-    expect(item.element.text()).toBe('3');
+    expect($animate.queue).toContainQueueItem('1', 'enter');
+    expect($animate.queue).toContainQueueItem('2', 'enter');
+    expect($animate.queue).toContainQueueItem('3', 'enter');
+    $animate.queue = [];
 
     $rootScope.items = ['1','3'];
     $rootScope.$digest();
 
-    item = $animate.queue.shift();
-    expect(item.event).toBe('leave');
-    expect(item.element.text()).toBe('2');
+    expect($animate.queue).not.toContainQueueItem('1');
+    expect($animate.queue).toContainQueueItem('2', 'leave');
+    expect($animate.queue).toContainQueueItem('3', 'move');
+    $animate.queue = [];
   }));
 
   it('should not change the position of the block that is being animated away via a leave animation',
@@ -1530,8 +1558,6 @@ describe('ngRepeat animations', function() {
   it('should fire off the move animation',
     inject(function($compile, $rootScope, $animate) {
 
-      var item;
-
       element = $compile(html(
         '<div>' +
           '<div ng-repeat="item in items">' +
@@ -1543,40 +1569,24 @@ describe('ngRepeat animations', function() {
       $rootScope.items = ['1','2','3'];
       $rootScope.$digest();
 
-      item = $animate.queue.shift();
-      expect(item.event).toBe('enter');
-      expect(item.element.text()).toBe('1');
-
-      item = $animate.queue.shift();
-      expect(item.event).toBe('enter');
-      expect(item.element.text()).toBe('2');
-
-      item = $animate.queue.shift();
-      expect(item.event).toBe('enter');
-      expect(item.element.text()).toBe('3');
+      expect($animate.queue).toContainQueueItem('1', 'enter');
+      expect($animate.queue).toContainQueueItem('2', 'enter');
+      expect($animate.queue).toContainQueueItem('3', 'enter');
+      $animate.queue = [];
 
       $rootScope.items = ['2','3','1'];
       $rootScope.$digest();
 
-      item = $animate.queue.shift();
-      expect(item.event).toBe('move');
-      expect(item.element.text()).toBe('2');
-
-      item = $animate.queue.shift();
-      expect(item.event).toBe('move');
-      expect(item.element.text()).toBe('3');
-
-      item = $animate.queue.shift();
-      expect(item.event).toBe('move');
-      expect(item.element.text()).toBe('1');
+      expect($animate.queue).toContainQueueItem('1', 'move');
+      expect($animate.queue).toContainQueueItem('2', 'move');
+      expect($animate.queue).toContainQueueItem('3', 'move');
+      $animate.queue = [];
     })
   );
 
   it('should fire off the move animation for items that change position when other items are filtered out',
     inject(function($compile, $rootScope, $animate) {
 
-      var item;
-
       element = $compile(html(
         '<div>' +
           '<div ng-repeat="item in items | filter:search">' +
@@ -1589,32 +1599,18 @@ describe('ngRepeat animations', function() {
       $rootScope.search = '';
       $rootScope.$digest();
 
-      item = $animate.queue.shift();
-      expect(item.event).toBe('enter');
-      expect(item.element.text()).toBe('1');
-
-      item = $animate.queue.shift();
-      expect(item.event).toBe('enter');
-      expect(item.element.text()).toBe('2');
-
-      item = $animate.queue.shift();
-      expect(item.event).toBe('enter');
-      expect(item.element.text()).toBe('3');
+      expect($animate.queue).toContainQueueItem('1', 'enter');
+      expect($animate.queue).toContainQueueItem('2', 'enter');
+      expect($animate.queue).toContainQueueItem('3', 'enter');
+      $animate.queue = [];
 
       $rootScope.search = '3';
       $rootScope.$digest();
 
-      item = $animate.queue.shift();
-      expect(item.event).toBe('move');
-      expect(item.element.text()).toBe('3');
-
-      item = $animate.queue.shift();
-      expect(item.event).toBe('leave');
-      expect(item.element.text()).toBe('1');
-
-      item = $animate.queue.shift();
-      expect(item.event).toBe('leave');
-      expect(item.element.text()).toBe('2');
+      expect($animate.queue).toContainQueueItem('1', 'leave');
+      expect($animate.queue).toContainQueueItem('2', 'leave');
+      expect($animate.queue).toContainQueueItem('3', 'move');
+      $animate.queue = [];
     })
   );