From 0d4eb419c41003e61301a461063858f22b44c6ca Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Matias=20Niemel=C3=A4?= Date: Mon, 31 Aug 2015 10:58:20 -0700 Subject: [PATCH] fix(ngAnimate): allow animations if the body node is changed If an ngIf is placed on the body then resulting node is different from what was there originally and that causes issues with ngAnimate. This patch fixes this. Closes #12366 Closes #12721 --- src/ngAnimate/animateQueue.js | 21 +++++++++++++++------ 1 file changed, 15 insertions(+), 6 deletions(-) diff --git a/src/ngAnimate/animateQueue.js b/src/ngAnimate/animateQueue.js index 6337ec0c03c2..fc49dba9a49b 100644 --- a/src/ngAnimate/animateQueue.js +++ b/src/ngAnimate/animateQueue.js @@ -66,10 +66,10 @@ var $$AnimateQueueProvider = ['$animateProvider', function($animateProvider) { return (nO.addClass && nO.addClass === cO.removeClass) || (nO.removeClass && nO.removeClass === cO.addClass); }); - this.$get = ['$$rAF', '$rootScope', '$rootElement', '$document', '$$body', '$$HashMap', - '$$animation', '$$AnimateRunner', '$templateRequest', '$$jqLite', '$$forceReflow', - function($$rAF, $rootScope, $rootElement, $document, $$body, $$HashMap, - $$animation, $$AnimateRunner, $templateRequest, $$jqLite, $$forceReflow) { + this.$get = ['$$rAF', '$rootScope', '$rootElement', '$document', '$$HashMap', '$$animation', + '$$AnimateRunner', '$templateRequest', '$$jqLite', '$$forceReflow', + function($$rAF, $rootScope, $rootElement, $document, $$HashMap, $$animation, + $$AnimateRunner, $templateRequest, $$jqLite, $$forceReflow) { var activeAnimationsLookup = new $$HashMap(); var disabledElementsLookup = new $$HashMap(); @@ -501,8 +501,17 @@ var $$AnimateQueueProvider = ['$animateProvider', function($animateProvider) { return getDomNode(nodeOrElmA) === getDomNode(nodeOrElmB); } + function isBodyElement(node, $document) { + // if a ng-if is placed on the tag then we + // may end up with a new body element entirely so it's + // best to just compare the body directly to the body + // node present within the document node. + return $document[0].body === node; + } + function areAnimationsAllowed(element, parentElement, event) { - var bodyElementDetected = isMatchingElement(element, $$body) || element[0].nodeName === 'HTML'; + var node = getDomNode(element); + var bodyElementDetected = isBodyElement(node, $document) || node.nodeName === 'HTML'; var rootElementDetected = isMatchingElement(element, $rootElement); var parentAnimationDetected = false; var animateChildren; @@ -558,7 +567,7 @@ var $$AnimateQueueProvider = ['$animateProvider', function($animateProvider) { if (!bodyElementDetected) { // we also need to ensure that the element is or will be apart of the body element // otherwise it is pointless to even issue an animation to be rendered - bodyElementDetected = isMatchingElement(parentElement, $$body); + bodyElementDetected = isBodyElement(parentNode, $document); } parentElement = parentElement.parent();