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

Commit 3333a5c

Browse files
committed
fix(ngAnimate): do not abort animation if only ng-anchor-in is used
1 parent f8f07e8 commit 3333a5c

File tree

2 files changed

+77
-12
lines changed

2 files changed

+77
-12
lines changed

src/ngAnimate/animateCssDriver.js

+24-12
Original file line numberDiff line numberDiff line change
@@ -56,27 +56,39 @@ var $$AnimateCssDriverProvider = ['$$animationProvider', function($$animationPro
5656

5757
rootBodyElement.append(clone);
5858

59-
var animatorOut = prepareOutAnimation();
59+
var animatorIn, animatorOut = prepareOutAnimation();
60+
61+
// the user may not end up using the `out` animation and
62+
// only making use of the `in` animation or vice-versa.
63+
// In either case we should allow this and not assume the
64+
// animation is over unless both animations are not used.
6065
if (!animatorOut) {
61-
return end();
66+
animatorIn = prepareInAnimation();
67+
if (!animatorIn) {
68+
return end();
69+
}
6270
}
6371

72+
var startingAnimator = animatorOut || animatorIn;
73+
6474
return {
6575
start: function() {
6676
var runner;
6777

68-
var currentAnimation = animatorOut.start();
78+
var currentAnimation = startingAnimator.start();
6979
currentAnimation.done(function() {
7080
currentAnimation = null;
71-
var animatorIn = prepareInAnimation();
72-
if (animatorIn) {
73-
currentAnimation = animatorIn.start();
74-
currentAnimation.done(function() {
75-
currentAnimation = null;
76-
end();
77-
runner.complete();
78-
});
79-
return currentAnimation;
81+
if (!animatorIn) {
82+
animatorIn = prepareInAnimation();
83+
if (animatorIn) {
84+
currentAnimation = animatorIn.start();
85+
currentAnimation.done(function() {
86+
currentAnimation = null;
87+
end();
88+
runner.complete();
89+
});
90+
return currentAnimation;
91+
}
8092
}
8193
// in the event that there is no `in` animation
8294
end();

test/ngAnimate/animateCssDriverSpec.js

+53
Original file line numberDiff line numberDiff line change
@@ -410,6 +410,59 @@ describe("ngAnimate $$animateCssDriver", function() {
410410
expect(anchorDetails.event).toBeFalsy();
411411
}));
412412

413+
they("should only fire the ng-anchor-$prop animation if only a $prop animation is defined",
414+
['out', 'in'], function(direction) {
415+
416+
var expectedClass = 'ng-anchor-' + direction;
417+
var animationStarted;
418+
var runner;
419+
420+
module(function($provide) {
421+
$provide.factory('$animateCss', function($$AnimateRunner) {
422+
return function(element, options) {
423+
var addClass = (options.addClass || '').trim();
424+
if (addClass === expectedClass) {
425+
return {
426+
start: function() {
427+
animationStarted = addClass;
428+
return runner = new $$AnimateRunner();
429+
}
430+
};
431+
}
432+
};
433+
});
434+
});
435+
436+
inject(function($rootElement, $$rAF) {
437+
var fromAnchor = jqLite('<div></div>');
438+
from.append(fromAnchor);
439+
var toAnchor = jqLite('<div></div>');
440+
to.append(toAnchor);
441+
442+
$rootElement.append(fromAnchor);
443+
$rootElement.append(toAnchor);
444+
445+
var complete = false;
446+
447+
driver({
448+
from: fromAnimation,
449+
to: toAnimation,
450+
anchors: [{
451+
'out': fromAnchor,
452+
'in': toAnchor
453+
}]
454+
}).start().done(function() {
455+
complete = true;
456+
});
457+
458+
expect(animationStarted).toBe(expectedClass);
459+
runner.end();
460+
$$rAF.flush();
461+
expect(complete).toBe(true);
462+
});
463+
});
464+
465+
413466
it("should provide an explicit delay setting in the options provided to $animateCss for anchor animations",
414467
inject(function($rootElement) {
415468

0 commit comments

Comments
 (0)