fix($animate): ensure former nodes are fully cleaned up when a follow…

…-up structural animation takes place

Closes #4435

src/ngAnimate/animate.js

@@ -588,6 +588,7 @@ angular.module('ngAnimate', ['ng'])
  //if an animation is currently running on the element then lets take the steps
  //to cancel that animation and fire any required callbacks
  $timeout.cancel(ngAnimateState.flagTimer);
+ cleanup(element);
  cancelAnimations(ngAnimateState.animations);
  (ngAnimateState.done || noop)();
  }
@@ -700,25 +701,24 @@ angular.module('ngAnimate', ['ng'])
  return rootAnimateState.disabled || rootAnimateState.running;
  }
 
- var validState;
  do {
  //the element did not reach the root element which means that it
  //is not apart of the DOM. Therefore there is no reason to do
  //any animations on it
- if(parent.length === 0) return true;
+ if(parent.length === 0) break;
 
  var isRoot = parent[0] == $rootElement[0];
  var state = isRoot ? rootAnimateState : parent.data(NG_ANIMATE_STATE);
- if(state && (state.disabled != null || state.running != null)) {
-  validState = state;
- break;
+ var result = state && (!!state.disabled || !!state.running);
+ if(isRoot || result) {
+ return result;
  }
 
  if(isRoot) return true;
  }
  while(parent = parent.parent());
 
- return validState ? (validState.disabled || validState.running) : true;
+ return true;
  }
  }]);
 

test/ngAnimate/animateSpec.js

@@ -1817,6 +1817,42 @@ describe("ngAnimate", function() {
 // expect(element.hasClass('hiding')).toBe(false);
 // });
 // });
+ it("should remove all the previous classes when the next animation is applied before a reflow", function() {
+ var fn, interceptedClass;
+ module(function($animateProvider) {
+ $animateProvider.register('.three', function() {
+ return {
+ move : function(element, done) {
+ fn = function() {
+ done();
+ }
+ return function() {
+ interceptedClass = element.attr('class');
+ }
+ }
+ }
+ });
+ });
+ inject(function($compile, $rootScope, $animate, $timeout) {
+ var parent = html($compile('<div class="parent"></div>')($rootScope));
+ var one = $compile('<div class="one"></div>')($rootScope);
+ var two = $compile('<div class="two"></div>')($rootScope);
+ var three = $compile('<div class="three klass"></div>')($rootScope);
+
+ parent.append(one);
+ parent.append(two);
+ parent.append(three);
+
+ $animate.move(three, null, two);
+ $rootScope.$digest();
+
+ $animate.move(three, null, one);
+ $rootScope.$digest();
+
+ //this means that the former animation was cleaned up before the new one starts
+ expect(interceptedClass.indexOf('ng-animate') >= 0).toBe(false);
+ });
+ });
 
  it("should provide the correct CSS class to the addClass and removeClass callbacks within a JS animation", function() {
  module(function($animateProvider) {