🐛 Fixed autosave not triggering when in-editor excerpt is changed (#20785)

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
This commit is contained in:
Kevin Ansfield 2024-08-19 15:38:00 +01:00 committed by Kevin Ansfield
parent 64f92fb460
commit 25c31c31c9
No known key found for this signature in database
3 changed files with 48 additions and 5 deletions

View File

@ -69,6 +69,7 @@
@input={{this.onExcerptInput}}
@keyDown={{this.onExcerptKeydown}}
@didCreateTextarea={{this.registerExcerptElement}}
{{on "blur" @onExcerptBlur}}
data-test-textarea="excerpt"
/>
{{#if @excerptHasTk}}

View File

@ -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 "..."}}

View File

@ -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');
});
});