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

Commit 2b327f0

Browse files
committed
fix(ngAnimate): fire callbacks when document is hidden
Since commit a3a7afd, animations are not run when the document is hidden (only their structural or class change effects are executed). However, some libraries rely on the $animate.on() callbacks to be called even when no actual animation runs. This commit restores the behavior for the ngAnimate.$animate functions. Note that callbacks still won't be called if animations are disabled, because this would be be a potential breaking change, as some applications might rely on this implementation. Fixes #14120
1 parent 19eca35 commit 2b327f0

File tree

2 files changed

+36
-1
lines changed

2 files changed

+36
-1
lines changed

src/ngAnimate/animateQueue.js

+6-1
Original file line numberDiff line numberDiff line change
@@ -343,12 +343,14 @@ var $$AnimateQueueProvider = ['$animateProvider', function($animateProvider) {
343343

344344
var isStructural = ['enter', 'move', 'leave'].indexOf(event) >= 0;
345345

346+
var documentHidden = $document[0].hidden;
347+
346348
// this is a hard disable of all animations for the application or on
347349
// the element itself, therefore there is no need to continue further
348350
// past this point if not enabled
349351
// Animations are also disabled if the document is currently hidden (page is not visible
350352
// to the user), because browsers slow down or do not flush calls to requestAnimationFrame
351-
var skipAnimations = !animationsEnabled || $document[0].hidden || disabledElementsLookup.get(node);
353+
var skipAnimations = !animationsEnabled || documentHidden || disabledElementsLookup.get(node);
352354
var existingAnimation = (!skipAnimations && activeAnimationsLookup.get(node)) || {};
353355
var hasExistingAnimation = !!existingAnimation.state;
354356

@@ -359,7 +361,10 @@ var $$AnimateQueueProvider = ['$animateProvider', function($animateProvider) {
359361
}
360362

361363
if (skipAnimations) {
364+
// Callbacks should fire even if the document is hidden (regression fix for issue #14120)
365+
if (documentHidden) notifyProgress(runner, event, 'start');
362366
close();
367+
if (documentHidden) notifyProgress(runner, event, 'close');
363368
return runner;
364369
}
365370

test/ngAnimate/animateSpec.js

+30
Original file line numberDiff line numberDiff line change
@@ -2323,6 +2323,36 @@ describe("animations", function() {
23232323
expect(classSpy).not.toHaveBeenCalled();
23242324
}));
23252325

2326+
2327+
describe('because the document is hidden', function() {
2328+
beforeEach(module(function($provide) {
2329+
var doc = jqLite({
2330+
body: document.body,
2331+
hidden: true
2332+
});
2333+
$provide.value('$document', doc);
2334+
}));
2335+
2336+
it('should trigger callbacks for an enter animation',
2337+
inject(function($animate, $rootScope, $rootElement, $document) {
2338+
2339+
var callbackTriggered = false;
2340+
var spy = jasmine.createSpy();
2341+
$animate.on('enter', jqLite($document[0].body), spy);
2342+
2343+
element = jqLite('<div></div>');
2344+
var runner = $animate.enter(element, $rootElement);
2345+
$rootScope.$digest();
2346+
2347+
$animate.flush(); // Flushes the animation frames for the callbacks
2348+
2349+
expect(spy.calls.count()).toBe(2);
2350+
expect(spy.calls.argsFor(0)[1]).toBe('start');
2351+
expect(spy.calls.argsFor(1)[1]).toBe('close');
2352+
}));
2353+
});
2354+
2355+
23262356
});
23272357

23282358
});

0 commit comments

Comments
 (0)