diff --git a/src/ngAnimate/ngAnimateSwap.js b/src/ngAnimate/ngAnimateSwap.js index 83c128bb8944..ebb98d7d53d4 100644 --- a/src/ngAnimate/ngAnimateSwap.js +++ b/src/ngAnimate/ngAnimateSwap.js @@ -92,7 +92,8 @@ var ngAnimateSwapDirective = ['$animate', function($animate) { restrict: 'A', transclude: 'element', terminal: true, - priority: 600, // we use 600 here to ensure that the directive is caught before others + priority: 550, // We use 550 here to ensure that the directive is caught before others, + // but after `ngIf` (at priority 600). link: function(scope, $element, attrs, ctrl, $transclude) { var previousElement, previousScope; scope.$watchCollection(attrs.ngAnimateSwap || attrs['for'], function(value) { diff --git a/test/ngAnimate/ngAnimateSwapSpec.js b/test/ngAnimate/ngAnimateSwapSpec.js index 4cfedce7e0ce..8d6ebf866cae 100644 --- a/test/ngAnimate/ngAnimateSwapSpec.js +++ b/test/ngAnimate/ngAnimateSwapSpec.js @@ -20,7 +20,7 @@ describe('ngAnimateSwap', function() { })); - it('should render a new container when the expression changes', inject(function() { + it('should render a new container when the expression changes', function() { element = $compile('
{{ exp }}
')($rootScope); $rootScope.$digest(); @@ -40,9 +40,9 @@ describe('ngAnimateSwap', function() { expect(third.textContent).toBe('super'); expect(third).not.toEqual(second); expect(second.parentNode).toBeFalsy(); - })); + }); - it('should render a new container only when the expression property changes', inject(function() { + it('should render a new container only when the expression property changes', function() { element = $compile('
{{ exp.value }}
')($rootScope); $rootScope.exp = { prop: 'hello', @@ -66,9 +66,9 @@ describe('ngAnimateSwap', function() { var three = element.find('div')[0]; expect(three.textContent).toBe('planet'); expect(three).not.toBe(two); - })); + }); - it('should watch the expression as a collection', inject(function() { + it('should watch the expression as a collection', function() { element = $compile('
{{ exp.a }} {{ exp.b }} {{ exp.c }}
')($rootScope); $rootScope.exp = { a: 1, @@ -99,26 +99,24 @@ describe('ngAnimateSwap', function() { var four = element.find('div')[0]; expect(four.textContent.trim()).toBe('4'); expect(four).not.toEqual(three); - })); + }); they('should consider $prop as a falsy value', [false, undefined, null], function(value) { - inject(function() { - element = $compile('
{{ value }}
')($rootScope); - $rootScope.value = true; - $rootScope.$digest(); + element = $compile('
{{ value }}
')($rootScope); + $rootScope.value = true; + $rootScope.$digest(); - var one = element.find('div')[0]; - expect(one).toBeTruthy(); + var one = element.find('div')[0]; + expect(one).toBeTruthy(); - $rootScope.value = value; - $rootScope.$digest(); + $rootScope.value = value; + $rootScope.$digest(); - var two = element.find('div')[0]; - expect(two).toBeFalsy(); - }); + var two = element.find('div')[0]; + expect(two).toBeFalsy(); }); - it('should consider "0" as a truthy value', inject(function() { + it('should consider "0" as a truthy value', function() { element = $compile('
{{ value }}
')($rootScope); $rootScope.$digest(); @@ -130,9 +128,9 @@ describe('ngAnimateSwap', function() { var two = element.find('div')[0]; expect(two).toBeTruthy(); - })); + }); - it('should create a new (non-isolate) scope for each inserted clone', inject(function() { + it('should create a new (non-isolate) scope for each inserted clone', function() { var parentScope = $rootScope.$new(); parentScope.foo = 'bar'; @@ -147,9 +145,9 @@ describe('ngAnimateSwap', function() { expect(scopeTwo.foo).toBe('bar'); expect(scopeOne).not.toBe(scopeTwo); - })); + }); - it('should destroy the previous scope when removing the element', inject(function() { + it('should destroy the previous scope when removing the element', function() { element = $compile('
{{ value }}
')($rootScope); $rootScope.$apply('value = 1'); @@ -166,9 +164,9 @@ describe('ngAnimateSwap', function() { // Removing the old element (without inserting a new one). $rootScope.$apply('value = null'); expect(scopeTwo.$$destroyed).toBe(true); - })); + }); - it('should destroy the previous scope when swapping elements', inject(function() { + it('should destroy the previous scope when swapping elements', function() { element = $compile('
{{ value }}
')($rootScope); $rootScope.$apply('value = 1'); @@ -177,13 +175,34 @@ describe('ngAnimateSwap', function() { $rootScope.$apply('value = 2'); expect(scopeOne.$$destroyed).toBe(true); - })); + }); + it('should work with `ngIf` on the same element', function() { + var tmpl = '
{{ exp }}
'; + element = $compile(tmpl)($rootScope); + $rootScope.$digest(); - describe('animations', function() { - it('should trigger a leave animation followed by an enter animation upon swap', - inject(function() { + var first = element.find('div')[0]; + expect(first).toBeFalsy(); + + $rootScope.exp = 'yes'; + $rootScope.$digest(); + + var second = element.find('div')[0]; + expect(second.textContent).toBe('yes'); + + $rootScope.exp = 'super'; + $rootScope.$digest(); + var third = element.find('div')[0]; + expect(third.textContent).toBe('super'); + expect(third).not.toEqual(second); + expect(second.parentNode).toBeFalsy(); + }); + + + describe('animations', function() { + it('should trigger a leave animation followed by an enter animation upon swap',function() { element = $compile('
{{ exp }}
')($rootScope); $rootScope.exp = 1; $rootScope.$digest(); @@ -208,6 +227,6 @@ describe('ngAnimateSwap', function() { var forth = $animate.queue.shift(); expect(forth.event).toBe('leave'); expect($animate.queue.length).toBe(0); - })); + }); }); });