🎨 Added post title to document title for easier location with multipl…

…e editor tabs (TryGhost#1072) closes TryGhost/Ghost#10088 * added `updateDocumentTitle` action to base route and replace usage of `.send('collectTitleTokens, [])` * added `.titleToken()` method to editor route to add post title to document title * called `.send('updateDocumentTitle')` after saving post title in editor controller to keep document title in sync * updated editor controller test for latest ember-mocha and ember-test-helpers
goodjobjohn · Jan 21, 2019 · e261b80 · e261b80
1 parent e73920e
commit e261b80
Show file tree

Hide file tree

Showing 5 changed files with 94 additions and 132 deletions.
diff --git a/app/controllers/editor.js b/app/controllers/editor.js
@@ -474,6 +474,8 @@ export default Controller.extend({
         if (this.get('post.isDraft')) {
             yield this.get('autosave').perform();
         }
+
+        this.send('updateDocumentTitle');
     }),
 
     generateSlug: task(function* () {

diff --git a/app/controllers/settings/general.js b/app/controllers/settings/general.js
@@ -274,7 +274,7 @@ export default Controller.extend({
 
             // this forces the document title to recompute after
             // a blog title change
-            this.send('collectTitleTokens', []);
+            this.send('updateDocumentTitle');
 
             return settings;
         } catch (error) {

diff --git a/app/routes/editor.js b/app/routes/editor.js
@@ -17,7 +17,6 @@ export default AuthenticatedRoute.extend(ShortcutsRoute, {
 
     classNames: ['editor'],
     shortcuts: generalShortcuts,
-    titleToken: 'Editor',
 
     activate() {
         this._super(...arguments);
@@ -82,6 +81,10 @@ export default AuthenticatedRoute.extend(ShortcutsRoute, {
         }
     },
 
+    titleToken() {
+        return this.get('controller.post.title') || 'Editor';
+    },
+
     _blurAndScheduleAction(func) {
         let selectedElement = $(document.activeElement);
 

diff --git a/app/utils/document-title.js b/app/utils/document-title.js
@@ -18,6 +18,10 @@ export default function () {
         title: null,
 
         actions: {
+            updateDocumentTitle() {
+                this.send('collectTitleTokens', []);
+            },
+
             collectTitleTokens(tokens) {
                 let {titleToken} = this;
                 let finalTitle;
@@ -49,7 +53,7 @@ export default function () {
 
     Router.reopen({
         updateTitle: on('didTransition', function () {
-            this.send('collectTitleTokens', []);
+            this.send('updateDocumentTitle');
         })
     });
 }
diff --git a/tests/unit/controllers/editor-test.js b/tests/unit/controllers/editor-test.js
@@ -1,190 +1,143 @@
 import EmberObject from '@ember/object';
 import RSVP from 'rsvp';
-import wait from 'ember-test-helpers/wait';
 import {describe, it} from 'mocha';
 import {expect} from 'chai';
-import {run} from '@ember/runloop';
+import {settled} from '@ember/test-helpers';
 import {setupTest} from 'ember-mocha';
 import {task} from 'ember-concurrency';
 
 describe('Unit: Controller: editor', function () {
-    setupTest('controller:editor', {
-        needs: [
-            'controller:application',
-            'service:feature',
-            'service:notifications',
-            // 'service:router',
-            'service:slugGenerator',
-            'service:session',
-            'service:ui'
-        ]
-    });
+    setupTest();
 
     describe('generateSlug', function () {
-        it('should generate a slug and set it on the post', function (done) {
-            run(() => {
-                let controller = this.subject();
-
-                controller.set('slugGenerator', EmberObject.create({
-                    generateSlug(slugType, str) {
-                        return RSVP.resolve(`${str}-slug`);
-                    }
-                }));
-                controller.set('post', EmberObject.create({slug: ''}));
-
-                controller.set('post.titleScratch', 'title');
-
-                expect(controller.get('post.slug')).to.equal('');
-
-                run(() => {
-                    controller.get('generateSlug').perform();
-                });
-
-                wait().then(() => {
-                    expect(controller.get('post.slug')).to.equal('title-slug');
-                    done();
-                });
-            });
+        it('should generate a slug and set it on the post', async function () {
+            let controller = this.owner.lookup('controller:editor');
+
+            controller.set('slugGenerator', EmberObject.create({
+                generateSlug(slugType, str) {
+                    return RSVP.resolve(`${str}-slug`);
+                }
+            }));
+            controller.set('post', EmberObject.create({slug: ''}));
+
+            controller.set('post.titleScratch', 'title');
+            await settled();
+
+            expect(controller.get('post.slug')).to.equal('');
+
+            await controller.get('generateSlug').perform();
+
+            expect(controller.get('post.slug')).to.equal('title-slug');
         });
 
-        it('should not set the destination if the title is "(Untitled)" and the post already has a slug', function (done) {
-            let controller = this.subject();
+        it('should not set the destination if the title is "(Untitled)" and the post already has a slug', async function () {
+            let controller = this.owner.lookup('controller:editor');
 
-            run(() => {
-                controller.set('slugGenerator', EmberObject.create({
-                    generateSlug(slugType, str) {
-                        return RSVP.resolve(`${str}-slug`);
-                    }
-                }));
-                controller.set('post', EmberObject.create({slug: 'whatever'}));
-            });
+            controller.set('slugGenerator', EmberObject.create({
+                generateSlug(slugType, str) {
+                    return RSVP.resolve(`${str}-slug`);
+                }
+            }));
+            controller.set('post', EmberObject.create({slug: 'whatever'}));
 
             expect(controller.get('post.slug')).to.equal('whatever');
 
             controller.set('post.titleScratch', '(Untitled)');
+            await controller.get('generateSlug').perform();
 
-            run(() => {
-                controller.get('generateSlug').perform();
-            });
-
-            wait().then(() => {
-                expect(controller.get('post.slug')).to.equal('whatever');
-                done();
-            });
+            expect(controller.get('post.slug')).to.equal('whatever');
         });
     });
 
     describe('saveTitle', function () {
-        it('should invoke generateSlug if the post is new and a title has not been set', function (done) {
-            let controller = this.subject();
+        beforeEach(function () {
+            this.controller = this.owner.lookup('controller:editor');
+            this.controller.set('target', {send() {}});
+        });
+
+        it('should invoke generateSlug if the post is new and a title has not been set', async function () {
+            let {controller} = this;
 
-            run(() => {
-                controller.set('generateSlug', task(function * () {
-                    this.set('post.slug', 'test-slug');
-                    yield RSVP.resolve();
-                }));
-                controller.set('post', EmberObject.create({isNew: true}));
-            });
+            controller.set('target', {send() {}});
+            controller.set('generateSlug', task(function * () {
+                this.set('post.slug', 'test-slug');
+                yield RSVP.resolve();
+            }));
+            controller.set('post', EmberObject.create({isNew: true}));
 
             expect(controller.get('post.isNew')).to.be.true;
             expect(controller.get('post.titleScratch')).to.not.be.ok;
 
             controller.set('post.titleScratch', 'test');
+            await controller.get('saveTitle').perform();
 
-            run(() => {
-                controller.get('saveTitle').perform();
-            });
-
-            wait().then(() => {
-                expect(controller.get('post.titleScratch')).to.equal('test');
-                expect(controller.get('post.slug')).to.equal('test-slug');
-                done();
-            });
+            expect(controller.get('post.titleScratch')).to.equal('test');
+            expect(controller.get('post.slug')).to.equal('test-slug');
         });
 
-        it('should invoke generateSlug if the post is not new and it\'s title is "(Untitled)"', function (done) {
-            let controller = this.subject();
+        it('should invoke generateSlug if the post is not new and it\'s title is "(Untitled)"', async function () {
+            let {controller} = this;
 
-            run(() => {
-                controller.set('generateSlug', task(function * () {
-                    this.set('post.slug', 'test-slug');
-                    yield RSVP.resolve();
-                }));
-                controller.set('post', EmberObject.create({isNew: false, title: '(Untitled)'}));
-            });
+            controller.set('target', {send() {}});
+            controller.set('generateSlug', task(function * () {
+                this.set('post.slug', 'test-slug');
+                yield RSVP.resolve();
+            }));
+            controller.set('post', EmberObject.create({isNew: false, title: '(Untitled)'}));
 
             expect(controller.get('post.isNew')).to.be.false;
             expect(controller.get('post.titleScratch')).to.not.be.ok;
 
             controller.set('post.titleScratch', 'New Title');
 
-            run(() => {
-                controller.get('saveTitle').perform();
-            });
+            await controller.get('saveTitle').perform();
 
-            wait().then(() => {
-                expect(controller.get('post.titleScratch')).to.equal('New Title');
-                expect(controller.get('post.slug')).to.equal('test-slug');
-                done();
-            });
+            expect(controller.get('post.titleScratch')).to.equal('New Title');
+            expect(controller.get('post.slug')).to.equal('test-slug');
         });
 
-        it('should not invoke generateSlug if the post is new but has a title', function (done) {
-            let controller = this.subject();
+        it('should not invoke generateSlug if the post is new but has a title', async function () {
+            let {controller} = this;
 
-            run(() => {
-                controller.set('generateSlug', task(function * () {
-                    expect(false, 'generateSlug should not be called').to.equal(true);
-                    yield RSVP.resolve();
-                }));
-                controller.set('post', EmberObject.create({
-                    isNew: true,
-                    title: 'a title'
-                }));
-            });
+            controller.set('target', {send() {}});
+            controller.set('generateSlug', task(function * () {
+                expect(false, 'generateSlug should not be called').to.equal(true);
+                yield RSVP.resolve();
+            }));
+            controller.set('post', EmberObject.create({
+                isNew: true,
+                title: 'a title'
+            }));
 
             expect(controller.get('post.isNew')).to.be.true;
             expect(controller.get('post.title')).to.equal('a title');
             expect(controller.get('post.titleScratch')).to.not.be.ok;
 
             controller.set('post.titleScratch', 'test');
+            await controller.get('saveTitle').perform();
 
-            run(() => {
-                controller.get('saveTitle').perform();
-            });
-
-            wait().then(() => {
-                expect(controller.get('post.titleScratch')).to.equal('test');
-                expect(controller.get('post.slug')).to.not.be.ok;
-                done();
-            });
+            expect(controller.get('post.titleScratch')).to.equal('test');
+            expect(controller.get('post.slug')).to.not.be.ok;
         });
 
-        it('should not invoke generateSlug if the post is not new and the title is not "(Untitled)"', function (done) {
-            let controller = this.subject();
+        it('should not invoke generateSlug if the post is not new and the title is not "(Untitled)"', async function () {
+            let {controller} = this;
 
-            run(() => {
-                controller.set('generateSlug', task(function * () {
-                    expect(false, 'generateSlug should not be called').to.equal(true);
-                    yield RSVP.resolve();
-                }));
-                controller.set('post', EmberObject.create({isNew: false}));
-            });
+            controller.set('target', {send() {}});
+            controller.set('generateSlug', task(function * () {
+                expect(false, 'generateSlug should not be called').to.equal(true);
+                yield RSVP.resolve();
+            }));
+            controller.set('post', EmberObject.create({isNew: false}));
 
             expect(controller.get('post.isNew')).to.be.false;
             expect(controller.get('post.title')).to.not.be.ok;
 
             controller.set('post.titleScratch', 'title');
+            await controller.get('saveTitle').perform();
 
-            run(() => {
-                controller.get('saveTitle').perform();
-            });
-
-            wait().then(() => {
-                expect(controller.get('post.titleScratch')).to.equal('title');
-                expect(controller.get('post.slug')).to.not.be.ok;
-                done();
-            });
+            expect(controller.get('post.titleScratch')).to.equal('title');
+            expect(controller.get('post.slug')).to.not.be.ok;
         });
     });
 });