💄 replace DownloadCountPoller with gh-download-count

closes https://github.com/TryGhost/Ghost/issues/8321
- adds `gh-download-count` component that uses ember-concurrency to poll the count endpoint
- removes the no-longer-needed `setup/one` route as ember-concurrency now handles the setInterval bookkeeping for us
This commit is contained in:
Kevin Ansfield 2017-04-12 12:34:59 +01:00 committed by Austin Burdine
parent 4a4226a6a9
commit 5534678f02
6 changed files with 94 additions and 72 deletions

View File

@ -0,0 +1,41 @@
import Ember from 'ember';
import Component from 'ember-component';
import injectService from 'ember-service/inject';
import {task, timeout} from 'ember-concurrency';
const {testing} = Ember;
const INTERVAL = testing ? 20 : 2000;
export default Component.extend({
ajax: injectService(),
ghostPaths: injectService(),
count: '',
_poll: task(function* () {
let url = this.get('ghostPaths.count');
let pattern = /(-?\d+)(\d{3})/;
try {
let data = yield this.get('ajax').request(url);
let count = data.count.toString();
while (pattern.test(count)) {
count = count.replace(pattern, '$1,$2');
}
this.set('count', count);
if (!testing) {
yield timeout(INTERVAL);
this.get('_poll').perform();
}
} catch (e) {
// no-op - we don't want to create noise for a failed download count
}
}),
didInsertElement() {
this.get('_poll').perform();
}
});

View File

@ -1,68 +0,0 @@
import Ember from 'ember';
import Route from 'ember-route';
import injectService from 'ember-service/inject';
import EmberObject from 'ember-object';
import run from 'ember-runloop';
import AjaxService from 'ember-ajax/services/ajax';
// ember-cli-shims doesn't export Ember.testing
const {testing} = Ember;
let DownloadCountPoller = EmberObject.extend({
url: null,
count: '',
runId: null,
ajax: AjaxService.create(),
notifications: injectService(),
init() {
this._super(...arguments);
this.downloadCounter();
this.poll();
},
poll() {
let interval = testing ? 20 : 2000;
let runId = run.later(this, function () {
this.downloadCounter();
if (!testing) {
this.poll();
}
}, interval);
this.set('runId', runId);
},
downloadCounter() {
this.get('ajax').request(this.get('url')).then((data) => {
let pattern = /(-?\d+)(\d{3})/;
let count = data.count.toString();
while (pattern.test(count)) {
count = count.replace(pattern, '$1,$2');
}
this.set('count', count);
}).catch((error) => {
this.set('count', '');
this.get('notifications').showAPIError(error);
});
}
});
export default Route.extend({
ghostPaths: injectService(),
model() {
return DownloadCountPoller.create({url: this.get('ghostPaths.count')});
},
resetController(controller, isExiting) {
if (isExiting) {
run.cancel(controller.get('model.runId'));
controller.set('model', null);
}
}
});

View File

@ -0,0 +1,5 @@
{{#if hasBlock}}
{{yield count}}
{{else}}
{{count}}
{{/if}}

View File

@ -1,6 +1,6 @@
<header>
<h1>Welcome to <strong>Ghost</strong>!</h1>
<p>All over the world, people have started <em>{{model.count}}</em> incredible blogs with Ghost. Today, were starting yours.</p>
<p>All over the world, people have started <em>{{gh-download-count}}</em> incredible blogs with Ghost. Today, were starting yours.</p>
</header>
<figure class="gh-flow-screenshot">

View File

@ -100,9 +100,8 @@ describe('Acceptance: Setup', function () {
.to.be.false;
// it displays download count (count increments for each ajax call
// and polling is disabled in testing so our count should be "2" -
// 1 for first load and 1 for first poll)
expect(find('.gh-flow-content em').text()).to.equal('2');
// and polling is disabled in testing so our count should be "1"
expect(find('.gh-flow-content em').text().trim()).to.equal('1');
});
click('.gh-btn-green');

View File

@ -0,0 +1,45 @@
import {expect} from 'chai';
import {describe, it} from 'mocha';
import {setupComponentTest} from 'ember-mocha';
import hbs from 'htmlbars-inline-precompile';
import Pretender from 'pretender';
import wait from 'ember-test-helpers/wait';
describe('Integration: Component: gh-download-count', function() {
setupComponentTest('gh-download-count', {
integration: true
});
let server;
beforeEach(function () {
server = new Pretender();
server.get('https://count.ghost.org/', function () {
return [200, {}, JSON.stringify({count: 42})];
});
});
afterEach(function () {
server.shutdown();
});
it('hits count endpoint and renders', function () {
this.render(hbs`{{gh-download-count}}`);
return wait().then(() => {
expect(this.$().text().trim()).to.equal('42');
});
});
it('renders with a block', function () {
this.render(hbs`
{{#gh-download-count as |count|}}
{{count}} downloads
{{/gh-download-count}}
`);
return wait().then(() => {
expect(this.$().text().trim()).to.equal('42 downloads');
});
});
});