fix(ngView): use animation promises ensure that only one leave animation occurs at a time

the tracking depended on a local flag variable, which was susceptible to corruption due to
race conditions.

Closes angular#9355
Closes angular#7606

Author: IgorMinar

src/ngRoute/directive/ngView.js

@@ -188,27 +188,27 @@ function ngViewFactory(   $route,   $anchorScroll,   $animate) {
     link: function(scope, $element, attr, ctrl, $transclude) {
         var currentScope,
             currentElement,
-            previousElement,
+            previousLeaveAnimation,
             autoScrollExp = attr.autoscroll,
             onloadExp = attr.onload || '';
 
         scope.$on('$routeChangeSuccess', update);
         update();
 
         function cleanupLastView() {
-          if(previousElement) {
-            previousElement.remove();
-            previousElement = null;
+          if(previousLeaveAnimation) {
+            $animate.cancel(previousLeaveAnimation);
           }
+
           if(currentScope) {
             currentScope.$destroy();
             currentScope = null;
           }
           if(currentElement) {
-            $animate.leave(currentElement).then(function() {
-              previousElement = null;
+            previousLeaveAnimation = $animate.leave(currentElement);
+            previousLeaveAnimation.then(function() {
+              previousLeaveAnimation = null;
             });
-            previousElement = currentElement;
             currentElement = null;
           }
         }

test/ngRoute/directive/ngViewSpec.js

@@ -845,18 +845,8 @@ describe('ngView animations', function() {
       });
     });
 
-    it('should destroy the previous leave animation if a new one takes place', function() {
-      module(function($provide) {
-        $provide.decorator('$animate', function($delegate, $$q) {
-          var emptyPromise = $$q.defer().promise;
-          $delegate.leave = function() {
-            return emptyPromise;
-          };
-          return $delegate;
-        });
-      });
+    it('should destroy the previous leave animation if a new one takes place',
       inject(function ($compile, $rootScope, $animate, $location) {
-        var item;
         var $scope = $rootScope.$new();
         element = $compile(html(
           '<div>' +
@@ -884,8 +874,8 @@ describe('ngView animations', function() {
         $rootScope.$digest();
 
         expect(destroyed).toBe(true);
-      });
-    });
+      })
+    );
   });