From 129e2e021ab1d773874428cd1fb329eae72797c4 Mon Sep 17 00:00:00 2001 From: Tomer Chachamu Date: Tue, 4 Mar 2014 15:29:11 +0000 Subject: [PATCH] fix(ngAnimate): setting classNameFilter disables animation inside ng-if Closes #6539 --- src/ngAnimate/animate.js | 4 ++-- test/ngAnimate/animateSpec.js | 43 +++++++++++++++++++++++++++++++++++ 2 files changed, 45 insertions(+), 2 deletions(-) diff --git a/src/ngAnimate/animate.js b/src/ngAnimate/animate.js index 447dfa3a6bc1..542b678f8316 100644 --- a/src/ngAnimate/animate.js +++ b/src/ngAnimate/animate.js @@ -770,7 +770,7 @@ angular.module('ngAnimate', ['ng']) fireDOMOperation(); fireBeforeCallbackAsync(); fireAfterCallbackAsync(); - fireDoneCallbackAsync(); + closeAnimation(); return; } @@ -949,7 +949,7 @@ angular.module('ngAnimate', ['ng']) animation, but class-based animations don't. An example of this failing would be when a parent HTML tag has a ng-class attribute causing ALL directives below to skip animations during the digest */ - if(runner.isClassBased) { + if(runner && runner.isClassBased) { cleanup(element, className); } else { $$asyncCallback(function() { diff --git a/test/ngAnimate/animateSpec.js b/test/ngAnimate/animateSpec.js index fb9ba19e8f19..204ca9c32114 100644 --- a/test/ngAnimate/animateSpec.js +++ b/test/ngAnimate/animateSpec.js @@ -3356,6 +3356,49 @@ describe("ngAnimate", function() { }); }); + it('should animate only the specified CSS className inside ng-if', function() { + var captures = {}; + module(function($animateProvider) { + $animateProvider.classNameFilter(/prefixed-animation/); + $animateProvider.register('.capture', function() { + return { + enter : buildFn('enter'), + leave : buildFn('leave') + }; + + function buildFn(key) { + return function(element, className, done) { + captures[key] = true; + (done || className)(); + } + } + }); + }); + inject(function($rootScope, $compile, $rootElement, $document, $sniffer, $animate) { + if(!$sniffer.transitions) return; + + var upperElement = $compile('
')($rootScope); + $rootElement.append(upperElement); + jqLite($document[0].body).append($rootElement); + + $rootScope.$digest(); + $animate.triggerCallbacks(); + + var element = upperElement.find('span'); + + var leaveDone = false; + $animate.leave(element, function() { + leaveDone = true; + }); + + $rootScope.$digest(); + $animate.triggerCallbacks(); + + expect(captures['leave']).toBe(true); + expect(leaveDone).toBe(true); + }); + }); + it('should respect the most relevant CSS transition property if defined in multiple classes', inject(function($sniffer, $compile, $rootScope, $rootElement, $animate, $timeout) {