fix($animate): ensure enable/disable animations work when the document node is used

Closes #4669

2 files changed, 45 insertions, 2 deletions

diff --git a/src/ngAnimate/animate.js b/src/ngAnimate/animate.js
index d0cc5aa6..b2b88d0a 100644
--- a/src/ngAnimate/animate.js
+++ b/src/ngAnimate/animate.js
@@ -705,13 +705,16 @@ angular.module('ngAnimate', ['ng'])
           //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 || parent[0] == $document[0]) return true;
+          if(parent.length === 0) return true;
 
-          var state = parent.data(NG_ANIMATE_STATE);
+          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;
           }
+
+          if(isRoot) return true;
         }
         while(parent = parent.parent());
 
diff --git a/test/ngAnimate/animateSpec.js b/test/ngAnimate/animateSpec.js
index 7bd9fc85..c995cd83 100644
--- a/test/ngAnimate/animateSpec.js
+++ b/test/ngAnimate/animateSpec.js
@@ -120,6 +120,46 @@ describe("ngAnimate", function() {
           expect(count).toBe(0);
         });
       });
+
+      it('should check enable/disable animations up until the $rootElement element', function() {
+        var rootElm = jqLite('<div></div>');
+
+        var captured = false;
+        module(function($provide, $animateProvider) {
+          $provide.value('$rootElement', rootElm);
+          $animateProvider.register('.ani', function() {
+            return {
+              addClass : function(element, className, done) {
+                captured = true;
+                done();
+              }
+            }
+          });
+        });
+        inject(function($animate, $rootElement, $rootScope, $compile, $timeout) {
+          var initialState;
+          angular.bootstrap(rootElm, ['ngAnimate']);
+
+          $animate.enabled(true);
+
+          var element = $compile('<div class="ani"></div>')($rootScope);
+          rootElm.append(element);
+
+          expect(captured).toBe(false);
+          $animate.addClass(element, 'red');
+          expect(captured).toBe(true);
+
+          captured = false;
+          $animate.enabled(false);
+
+          $animate.addClass(element, 'blue');
+          expect(captured).toBe(false);
+
+          //clean up the mess
+          $animate.enabled(false, rootElm);
+          dealoc(rootElm);
+        });
+      });
     });
 
     describe("with polyfill", function() {