Skip to content
This repository has been archived by the owner on Apr 12, 2024. It is now read-only.

Commit

Permalink
fix(mocks): remove usage of $animate.flushNext in favour of queing
Browse files Browse the repository at this point in the history 
The flushNext method of testing is difficult and highly coupled with the behavior
of ngAnimate's $animate workflow. It is much better instead to just queue all
$animate animation calls into a queue collection which is available on the $animate
service when mock.animate is included as a module within test code.
  • Loading branch information
@matsko
matsko committed Feb 6, 2014
1 parent a8c1d9c commit 906fdad
Show file tree
Hide file tree
Showing 9 changed files with 205 additions and 182 deletions.
25 changes: 4 additions & 21 deletions src/ngMock/angular-mocks.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -790,37 +790,20 @@ if(animateLoaded) {
angular.mock.animate = angular.module('mock.animate', ['ng'])

.config(['$provide', function($provide) {

$provide.decorator('$animate', function($delegate) {
var animate = {
queue : [],
enabled : $delegate.enabled,
flushNext : function(name) {
var tick = animate.queue.shift();

if (!tick) throw new Error('No animation to be flushed');
if(tick.method !== name) {
throw new Error('The next animation is not "' + name +
'", but is "' + tick.method + '"');
}
tick.fn();
return tick;
}
};

angular.forEach(['enter','leave','move','addClass','removeClass'], function(method) {
animate[method] = function() {
var params = arguments;
animate.queue.push({
method : method,
params : params,
element : angular.isElement(params[0]) && params[0],
parent : angular.isElement(params[1]) && params[1],
after : angular.isElement(params[2]) && params[2],
fn : function() {
$delegate[method].apply($delegate, params);
}
event : method,
element : arguments[0],
args : arguments
});
$delegate[method].apply($delegate, arguments);
};
});

Expand Down
20 changes: 12 additions & 8 deletions test/ng/compileSpec.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4506,8 +4506,9 @@ describe('$compile', function() {
$rootScope.val2 = 'rice';
$rootScope.$digest();

data = $animate.flushNext('addClass');
expect(data.params[1]).toBe('ice rice');
data = $animate.queue.shift();
expect(data.event).toBe('addClass');
expect(data.args[1]).toBe('ice rice');

expect(element.hasClass('ice')).toBe(true);
expect(element.hasClass('rice')).toBe(true);
Expand All @@ -4516,10 +4517,12 @@ describe('$compile', function() {
$rootScope.val2 = 'dice';
$rootScope.$digest();

data = $animate.flushNext('removeClass');
expect(data.params[1]).toBe('rice');
data = $animate.flushNext('addClass');
expect(data.params[1]).toBe('dice');
data = $animate.queue.shift();
expect(data.event).toBe('removeClass');
expect(data.args[1]).toBe('rice');
data = $animate.queue.shift();
expect(data.event).toBe('addClass');
expect(data.args[1]).toBe('dice');

expect(element.hasClass('ice')).toBe(true);
expect(element.hasClass('dice')).toBe(true);
Expand All @@ -4529,8 +4532,9 @@ describe('$compile', function() {
$rootScope.val2 = '';
$rootScope.$digest();

data = $animate.flushNext('removeClass');
expect(data.params[1]).toBe('ice dice');
data = $animate.queue.shift();
expect(data.event).toBe('removeClass');
expect(data.args[1]).toBe('ice dice');

expect(element.hasClass('ice')).toBe(false);
expect(element.hasClass('dice')).toBe(false);
Expand Down
30 changes: 17 additions & 13 deletions test/ng/directive/ngClassSpec.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -320,23 +320,23 @@ describe('ngClass animations', function() {

$rootScope.val = 'one';
$rootScope.$digest();
$animate.flushNext('addClass');
expect($animate.queue.shift().event).toBe('addClass');
expect($animate.queue.length).toBe(0);

$rootScope.val = '';
$rootScope.$digest();
$animate.flushNext('removeClass'); //only removeClass is called
expect($animate.queue.shift().event).toBe('removeClass'); //only removeClass is called
expect($animate.queue.length).toBe(0);

$rootScope.val = 'one';
$rootScope.$digest();
$animate.flushNext('addClass');
expect($animate.queue.shift().event).toBe('addClass');
expect($animate.queue.length).toBe(0);

$rootScope.val = 'two';
$rootScope.$digest();
$animate.flushNext('removeClass');
$animate.flushNext('addClass');
expect($animate.queue.shift().event).toBe('removeClass');
expect($animate.queue.shift().event).toBe('addClass');
expect($animate.queue.length).toBe(0);
});
});
Expand Down Expand Up @@ -430,28 +430,32 @@ describe('ngClass animations', function() {
$rootScope.$digest();

//this fires twice due to the class observer firing
className = $animate.flushNext('addClass').params[1];
expect(className).toBe('one two three');
var item = $animate.queue.shift();
expect(item.event).toBe('addClass');
expect(item.args[1]).toBe('one two three');

expect($animate.queue.length).toBe(0);

$rootScope.three = false;
$rootScope.$digest();

className = $animate.flushNext('removeClass').params[1];
expect(className).toBe('three');
item = $animate.queue.shift();
expect(item.event).toBe('removeClass');
expect(item.args[1]).toBe('three');

expect($animate.queue.length).toBe(0);

$rootScope.two = false;
$rootScope.three = true;
$rootScope.$digest();

className = $animate.flushNext('removeClass').params[1];
expect(className).toBe('two');
item = $animate.queue.shift();
expect(item.event).toBe('removeClass');
expect(item.args[1]).toBe('two');

className = $animate.flushNext('addClass').params[1];
expect(className).toBe('three');
item = $animate.queue.shift();
expect(item.event).toBe('addClass');
expect(item.args[1]).toBe('three');

expect($animate.queue.length).toBe(0);
});
Expand Down
17 changes: 10 additions & 7 deletions test/ng/directive/ngIfSpec.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -245,8 +245,9 @@ describe('ngIf animations', function () {
$rootScope.$digest();
$scope.$apply('value = true');

item = $animate.flushNext('enter').element;
expect(item.text()).toBe('Hi');
item = $animate.queue.shift();
expect(item.event).toBe('enter');
expect(item.element.text()).toBe('Hi');

expect(element.children().length).toBe(1);
}));
Expand All @@ -262,14 +263,16 @@ describe('ngIf animations', function () {
))($scope);
$scope.$apply('value = true');

item = $animate.flushNext('enter').element;
expect(item.text()).toBe('Hi');
item = $animate.queue.shift();
expect(item.event).toBe('enter');
expect(item.element.text()).toBe('Hi');

$scope.$apply('value = false');
expect(element.children().length).toBe(1);
$scope.$apply('value = false');

item = $animate.flushNext('leave').element;
expect(item.text()).toBe('Hi');
item = $animate.queue.shift();
expect(item.event).toBe('leave');
expect(item.element.text()).toBe('Hi');

expect(element.children().length).toBe(0);
}));
Expand Down
41 changes: 22 additions & 19 deletions test/ng/directive/ngIncludeSpec.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -367,7 +367,7 @@ describe('ngInclude', function() {
});

expect(autoScrollSpy).not.toHaveBeenCalled();
$animate.flushNext('enter');
expect($animate.queue.shift().event).toBe('enter');
$timeout.flush();

expect(autoScrollSpy).toHaveBeenCalledOnce();
Expand All @@ -384,25 +384,25 @@ describe('ngInclude', function() {
$rootScope.value = true;
});

$animate.flushNext('enter');
expect($animate.queue.shift().event).toBe('enter');
$timeout.flush();

$rootScope.$apply(function () {
$rootScope.tpl = 'another.html';
$rootScope.value = 'some-string';
});

$animate.flushNext('leave');
$animate.flushNext('enter');
expect($animate.queue.shift().event).toBe('leave');
expect($animate.queue.shift().event).toBe('enter');
$timeout.flush();

$rootScope.$apply(function() {
$rootScope.tpl = 'template.html';
$rootScope.value = 100;
});

$animate.flushNext('leave');
$animate.flushNext('enter');
expect($animate.queue.shift().event).toBe('leave');
expect($animate.queue.shift().event).toBe('enter');
$timeout.flush();

expect(autoScrollSpy).toHaveBeenCalled();
Expand All @@ -418,7 +418,7 @@ describe('ngInclude', function() {
$rootScope.tpl = 'template.html';
});

$animate.flushNext('enter');
expect($animate.queue.shift().event).toBe('enter');
$timeout.flush();
expect(autoScrollSpy).not.toHaveBeenCalled();
}));
Expand All @@ -434,7 +434,7 @@ describe('ngInclude', function() {
$rootScope.value = false;
});

$animate.flushNext('enter');
expect($animate.queue.shift().event).toBe('enter');
$timeout.flush();

$rootScope.$apply(function () {
Expand All @@ -456,7 +456,7 @@ describe('ngInclude', function() {
expect(autoScrollSpy).not.toHaveBeenCalled();

$rootScope.$apply("tpl = 'template.html'");
$animate.flushNext('enter');
expect($animate.queue.shift().event).toBe('enter');
$timeout.flush();

expect(autoScrollSpy).toHaveBeenCalledOnce();
Expand Down Expand Up @@ -608,8 +608,9 @@ describe('ngInclude animations', function() {
))($rootScope);
$rootScope.$digest();

item = $animate.flushNext('enter').element;
expect(item.text()).toBe('data');
var animation = $animate.queue.pop();
expect(animation.event).toBe('enter');
expect(animation.element.text()).toBe('data');
}));

it('should fire off the leave animation',
Expand All @@ -624,14 +625,16 @@ describe('ngInclude animations', function() {
))($rootScope);
$rootScope.$digest();

item = $animate.flushNext('enter').element;
expect(item.text()).toBe('data');
var animation = $animate.queue.shift();
expect(animation.event).toBe('enter');
expect(animation.element.text()).toBe('data');

$rootScope.tpl = '';
$rootScope.$digest();

item = $animate.flushNext('leave').element;
expect(item.text()).toBe('data');
animation = $animate.queue.shift();
expect(animation.event).toBe('leave');
expect(animation.element.text()).toBe('data');
}));

it('should animate two separate ngInclude elements',
Expand All @@ -647,14 +650,14 @@ describe('ngInclude animations', function() {
))($rootScope);
$rootScope.$digest();

item = $animate.flushNext('enter').element;
expect(item.text()).toBe('one');
var item1 = $animate.queue.shift().element;
expect(item1.text()).toBe('one');

$rootScope.tpl = 'two';
$rootScope.$digest();

var itemA = $animate.flushNext('leave').element;
var itemB = $animate.flushNext('enter').element;
var itemA = $animate.queue.shift().element;
var itemB = $animate.queue.shift().element;
expect(itemA.attr('ng-include')).toBe('tpl');
expect(itemB.attr('ng-include')).toBe('tpl');
expect(itemA).not.toEqual(itemB);
Expand Down
Loading

0 comments on commit 906fdad

Please sign in to comment.