Fix tests and add rAF fallback
MODIFY
addon/services/scheduler.js
addon/services/scheduler.js
@@ -15,8 +15,7 @@ class Token {
}
class Queue {
- constructor(queueName) {
- this.queueName = queueName;
+ constructor() {
this.reset();
}
@@ -97,17 +96,23 @@ export default Ember.Service.extend({
}
this._nextAfterPaintPromise = new Ember.RSVP.Promise((resolve) => {
- this._nextPaintFrame = requestAnimationFrame(() => {
+ if (typeof requestAnimationFrame === "function") {
+ this._nextPaintFrame = requestAnimationFrame(() => this._rAFCallback(resolve));
+ } else {
+ this._rAFCallback(resolve);
+ }
+ });
+
+ return this._nextAfterPaintPromise;
+ },
+
+ _rAFCallback(resolve) {
this._nextPaintTimeout = Ember.run.later(() => {
this._nextAfterPaintPromise = null;
this._nextPaintFrame = null;
this._nextPaintTimeout = null;
resolve();
}, 0);
- });
- });
-
- return this._nextAfterPaintPromise;
},
// TODO on destroy this should be disconnected I think

MODIFY
tests/acceptance/deferred-render-test.js
tests/acceptance/deferred-render-test.js
@@ -9,28 +9,48 @@ moduleForAcceptance('Acceptance | deferred render', {
});
test('visiting /demo', function(assert) {
- assert.expect(5);
+ assert.expect(3);
+ let done = assert.async();
this.router.on('didTransition', () => {
this.scheduler.queues['afterFirstRoutePaint'].afterPaintPromise.then(() => {
const deferredElement = find('.deferred-container ul');
assert.ok(deferredElement.is(':visible'), 'Deferred content should be visible.');
const adElement = find('.ad-container h3');
- assert.notOk(adElement.is(':visible'), 'Overlay should not be visible.');
+ assert.notOk(adElement.is(':visible'), 'Ad should not be visible.');
});
this.scheduler.queues['afterContentPaint'].afterPaintPromise.then(() => {
- const deferredElement = find('.deferred-container ul');
- assert.ok(deferredElement.is(':visible'), 'Deferred content should be visible.');
const adElement = find('.ad-container h3');
- assert.ok(adElement.is(':visible'), 'Overlay should be visible.');
+ assert.ok(adElement.is(':visible'), 'Ad should be visible.');
+ done();
});
});
visit('/demo');
+});
+
+test('visiting /demo when requestAnimationFrame is not present', function(assert) {
+ let rAF = window.requestAnimationFrame;
+ window.requestAnimationFrame = undefined;
+ assert.expect(3);
+ let done = assert.async();
- andThen(function() {
+ this.router.on('didTransition', () => {
+ this.scheduler.queues['afterFirstRoutePaint'].afterPaintPromise.then(() => {
+ const deferredElement = find('.deferred-container ul');
+ assert.ok(deferredElement.is(':visible'), 'Deferred content should be visible.');
const adElement = find('.ad-container h3');
- assert.ok(adElement.is(':visible'), 'Overlay should be visible.');
+ assert.notOk(adElement.is(':visible'), 'Ad should not be visible.');
});
+
+ this.scheduler.queues['afterContentPaint'].afterPaintPromise.then(() => {
+ const adElement = find('.ad-container h3');
+ assert.ok(adElement.is(':visible'), 'Ad should be visible.');
+ window.requestAnimationFrame = rAF;
+ done();
+ });
+ });
+
+ visit('/demo');
});

Fix tests and add rAF fallback