test(): simplify the event listener tests

Author: Narretz

test/ngAnimate/animateCssSpec.js

@@ -1406,122 +1406,101 @@ describe("ngAnimate $animateCss", function() {
       });
 
       describe('transitionend/animationend event listeners', function() {
-        var element, callLog, proxyListener, origListener, type, progress;
+        var element, elementOnSpy, elementOffSpy, progress;
+
+        function setStyles(event) {
+          switch (event) {
+            case TRANSITIONEND_EVENT:
+              ss.addRule('.ng-enter', 'transition: 10s linear all;');
+              progress = transitionProgress;
+              break;
+            case ANIMATIONEND_EVENT:
+              ss.addRule('.ng-enter', ANIMATION_PROP + ':animation 10s;');
+              progress = keyframeProgress;
+              break;
+          }
+        }
 
         beforeEach(inject(function($rootElement, $document) {
-
           element = jqLite('<div></div>');
           $rootElement.append(element);
           jqLite($document[0].body).append($rootElement);
 
-          callLog = {};
-
-          var origOn = element.on,
-          origOff = element.off;
-
-          proxyListener = function() {
-            callLog[type] = callLog[type]++ || 1;
-            origListener.apply(this, arguments);
-          };
-
-          // Overwrite the .on function to log calls to the event listeners
-          element.on = function() {
-            origListener = arguments[1];
-            type = arguments[0];
-            origOn.call(this, arguments[0], proxyListener);
-          };
-
-          // Make sure the .off function removes the proxyListener
-          element.off = function() {
-            origOff.call(this, arguments[0], proxyListener);
-          };
-
+          elementOnSpy = spyOn(element, 'on').andCallThrough();
+          elementOffSpy = spyOn(element, 'off').andCallThrough();
         }));
 
         they('should remove the $prop event listeners on cancel',
-          [TRANSITIONEND_EVENT, ANIMATIONEND_EVENT],
-          function(event) {inject(function($animateCss) {
-
-            switch (event) {
-              case TRANSITIONEND_EVENT:
-                progress = bind(this, transitionProgress, element, 10);
-                break;
-              case ANIMATIONEND_EVENT:
-                progress = bind(this, keyframeProgress, element, 10);
-                break;
-            }
+          [TRANSITIONEND_EVENT, ANIMATIONEND_EVENT], function(event) {
+            inject(function($animateCss) {
 
-            var animator = $animateCss(element, {
-              duration: 10,
-              to: { 'background': 'red' }
-            });
+              setStyles(event);
 
-            var runner = animator.start();
-            triggerAnimationStartFrame();
+              var animator = $animateCss(element, {
+                event: 'enter',
+                structural: true
+              });
 
-            runner.cancel();
+              var runner = animator.start();
+              triggerAnimationStartFrame();
 
-            // Trigger an end event
-            progress();
+              expect(elementOnSpy).toHaveBeenCalledOnce();
+              expect(elementOnSpy.mostRecentCall.args[0]).toBe(event);
 
-            expect(callLog[event]).toBeFalsy();
-          });
+              runner.cancel();
+
+              expect(elementOffSpy).toHaveBeenCalledOnce();
+              expect(elementOffSpy.mostRecentCall.args[0]).toBe(event);
+            });
         });
 
         they("should remove the $prop event listener when the animation is closed",
           [TRANSITIONEND_EVENT, ANIMATIONEND_EVENT], function(event) {
-          inject(function($animateCss) {
+            inject(function($animateCss) {
 
-            switch (event) {
-              case TRANSITIONEND_EVENT:
-                ss.addRule('.ng-enter', TRANSITION_PROP + '1s linear all;' +
-                                        TRANSITION_PROP + '-duration:10s;');
-
-                progress = bind(this, transitionProgress, element, 10);
-                break;
-              case ANIMATIONEND_EVENT:
-                ss.addRule('.ng-enter', ANIMATION_PROP + ':animation 10s;');
-                progress = bind(this, keyframeProgress, element, 10);
-                break;
-            }
+              setStyles(event);
 
-            var animator = $animateCss(element, {
-              event: 'enter',
-              structural: true
-            });
+              var animator = $animateCss(element, {
+                event: 'enter',
+                structural: true
+              });
 
-            var runner = animator.start();
-            triggerAnimationStartFrame();
+              var runner = animator.start();
+              triggerAnimationStartFrame();
 
-            progress();
-            expect(element).not.toHaveClass('ng-enter ng-enter-active');
+              expect(elementOnSpy).toHaveBeenCalledOnce();
+              expect(elementOnSpy.mostRecentCall.args[0]).toBe(event);
 
-            // Trigger another end event
-            progress();
+              progress(element, 10);
 
-            expect(callLog[event]).toBe(1);
-          });
+              expect(elementOffSpy).toHaveBeenCalledOnce();
+              expect(elementOffSpy.mostRecentCall.args[0]).toBe(event);
+            });
         });
 
-        it("should remove the transitionend event listener when the closing timeout occurs",
-          inject(function($animateCss, $document, $rootElement, $timeout) {
+        they("should remove the $prop event listener when the closing timeout occurs",
+          [TRANSITIONEND_EVENT, ANIMATIONEND_EVENT], function(event) {
+            inject(function($animateCss, $timeout) {
 
-            ss.addRule('.ng-enter', 'transition:10s linear all;');
+              setStyles(event);
 
-            var animator = $animateCss(element, {
-              event: 'enter',
-              structural: true
-            });
+              var animator = $animateCss(element, {
+                event: 'enter',
+                structural: true
+              });
 
-            animator.start();
-            triggerAnimationStartFrame();
-            $timeout.flush(15000);
+              animator.start();
+              triggerAnimationStartFrame();
 
-            // Force an transitionend event
-            transitionProgress(element, 10);
+              expect(elementOnSpy).toHaveBeenCalledOnce();
+              expect(elementOnSpy.mostRecentCall.args[0]).toBe(event);
 
-            expect(callLog[TRANSITIONEND_EVENT]).toBeFalsy();
-        }));
+              $timeout.flush(15000);
+
+              expect(elementOffSpy).toHaveBeenCalledOnce();
+              expect(elementOffSpy.mostRecentCall.args[0]).toBe(event);
+            });
+        });
       });
     });