From 25c31c31c98367b5eaea75a16d1b9fb0b5209424 Mon Sep 17 00:00:00 2001
From: Kevin Ansfield <kevin@ghost.org>
Date: Mon, 19 Aug 2024 15:38:00 +0100
Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B=20Fixed=20autosave=20not=20trigger?=
 =?UTF-8?q?ing=20when=20in-editor=20excerpt=20is=20changed=20(#20785)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

ref https://linear.app/tryghost/issue/PLG-174

- added `blur` handler to excerpt field so it acts the same as the title field and triggers a save when it loses focus
---
 .../components/gh-koenig-editor-lexical.hbs   |  1 +
 ghost/admin/app/templates/lexical-editor.hbs  |  1 +
 .../tests/acceptance/editor/lexical-test.js   | 51 +++++++++++++++++--
 3 files changed, 48 insertions(+), 5 deletions(-)

diff --git a/ghost/admin/app/components/gh-koenig-editor-lexical.hbs b/ghost/admin/app/components/gh-koenig-editor-lexical.hbs
index af3524b998..4f386455a8 100644
--- a/ghost/admin/app/components/gh-koenig-editor-lexical.hbs
+++ b/ghost/admin/app/components/gh-koenig-editor-lexical.hbs
@@ -69,6 +69,7 @@
                         @input={{this.onExcerptInput}}
                         @keyDown={{this.onExcerptKeydown}}
                         @didCreateTextarea={{this.registerExcerptElement}}
+                        {{on "blur" @onExcerptBlur}}
                         data-test-textarea="excerpt"
                     />
                     {{#if @excerptHasTk}}
diff --git a/ghost/admin/app/templates/lexical-editor.hbs b/ghost/admin/app/templates/lexical-editor.hbs
index bd9d5d51e7..ce7620137d 100644
--- a/ghost/admin/app/templates/lexical-editor.hbs
+++ b/ghost/admin/app/templates/lexical-editor.hbs
@@ -69,6 +69,7 @@
                 @excerpt={{readonly this.post.customExcerpt}}
                 @excerptHasTk={{this.excerptHasTk}}
                 @setExcerpt={{this.updateExcerpt}}
+                @onExcerptBlur={{perform this.autosaveTask}}
                 @excerptErrorMessage={{this.excerptErrorMessage}}
                 @body={{readonly this.post.lexicalScratch}}
                 @bodyPlaceholder={{concat "Begin writing your " this.post.displayName "..."}}
diff --git a/ghost/admin/tests/acceptance/editor/lexical-test.js b/ghost/admin/tests/acceptance/editor/lexical-test.js
index 1f0909ecb4..c62b00b64b 100644
--- a/ghost/admin/tests/acceptance/editor/lexical-test.js
+++ b/ghost/admin/tests/acceptance/editor/lexical-test.js
@@ -1,6 +1,8 @@
 import loginAsRole from '../../helpers/login-as-role';
-import {currentURL} from '@ember/test-helpers';
+import {blur, currentURL, fillIn, find, waitUntil} from '@ember/test-helpers';
+import {enableLabsFlag} from '../../helpers/labs-flag';
 import {expect} from 'chai';
+import {invalidateSession} from 'ember-simple-auth/test-support';
 import {setupApplicationTest} from 'ember-mocha';
 import {setupMirage} from 'ember-cli-mirage/test-support';
 import {visit} from '../../helpers/visit';
@@ -11,16 +13,55 @@ describe('Acceptance: Lexical editor', function () {
 
     beforeEach(async function () {
         this.server.loadFixtures();
+        await loginAsRole('Administrator', this.server);
     });
 
     it('redirects to signin when not authenticated', async function () {
+        await invalidateSession();
         await visit('/editor/post/');
         expect(currentURL(), 'currentURL').to.equal('/signin');
     });
 
-    it('loads editor', async function () {
-        await loginAsRole('Administrator', this.server);
-        await visit('/editor/post/');
-        expect(currentURL(), 'currentURL').to.equal('/editor/post/');
+    describe('new post', function () {
+        // TODO: test it actually loads the editor
+        it('loads editor', async function () {
+            await visit('/editor/post/');
+            expect(currentURL(), 'currentURL').to.equal('/editor/post/');
+        });
+
+        it('saves on title change', async function () {
+            await visit('/editor/post/');
+            await fillIn('[data-test-editor-title-input]', 'Test Post');
+            await blur('[data-test-editor-title-input]');
+
+            // NOTE: during testing we switch status so quickly this doesn't catch the intermediate state
+            // await waitUntil(function () {
+            //     return find('[data-test-editor-post-status]').textContent.includes('Saving...');
+            // });
+
+            await waitUntil(function () {
+                return find('[data-test-editor-post-status]').textContent.includes('Saved');
+            }, {timeoutMessage: 'Timed out waiting for "Saved" status'});
+
+            expect(currentURL(), 'currentURL').to.equal(`/editor/post/1`);
+        });
+
+        it('saves on excerpt change', async function () {
+            // excerpt is not shown by default
+            enableLabsFlag(this.server, 'editorExcerpt');
+
+            await visit('/editor/post/');
+            await fillIn('[data-test-textarea="excerpt"]', 'Test Post');
+            await blur('[data-test-textarea="excerpt"]');
+
+            await waitUntil(function () {
+                return find('[data-test-editor-post-status]').textContent.includes('Saved');
+            }, {timeoutMessage: 'Timed out waiting for "Saved" status'});
+
+            expect(currentURL(), 'currentURL').to.equal(`/editor/post/1`);
+        });
+
+        // TODO: requires editor to be loading
+        it('saves on content change');
     });
 });