mirror of
https://github.com/TryGhost/Ghost.git
synced 2025-01-27 22:49:56 -05:00
972cc82958
REF https://linear.app/ghost/issue/PLG-298/ - When you're typing a comment, and exit the input field, it collapses into a non-editable state; you first have to click on it again to "open" the form. This means you can't select the text or instantly start typing again. When the input has a value, we should stop it from closing. - added custom `useEditor` hook that wraps TipTap and exposes both the `editor` and `hasContent` props keeping logic out of the consuming components --------- Co-authored-by: Kevin Ansfield <kevin@lookingsideways.co.uk>
48 lines
2.2 KiB
TypeScript
48 lines
2.2 KiB
TypeScript
import {MockedApi, initialize} from '../utils/e2e';
|
|
import {buildMember} from '../utils/fixtures';
|
|
import {expect, test} from '@playwright/test';
|
|
|
|
test.describe('Main form', async () => {
|
|
let mockedApi: MockedApi;
|
|
|
|
async function initializeTest(page, options = {}) {
|
|
mockedApi = new MockedApi({});
|
|
mockedApi.setMember(buildMember({}));
|
|
|
|
return await initialize({
|
|
mockedApi,
|
|
page,
|
|
publication: 'Publisher Weekly',
|
|
...options
|
|
});
|
|
}
|
|
|
|
test('hides header by default', async ({page}) => {
|
|
const {frame} = await initializeTest(page);
|
|
await expect(frame.locator('[data-testid="main-form"]')).toBeVisible();
|
|
await expect(frame.locator('[data-testid="main-form"] [data-testid="form-header"]')).not.toBeVisible();
|
|
});
|
|
|
|
test('shows header when focused', async ({page}) => {
|
|
const {frame} = await initializeTest(page);
|
|
await frame.locator('[data-testid="main-form"] [data-testid="form-editor"]').click();
|
|
await expect(frame.locator('[data-testid="main-form"] [data-testid="form-header"]')).toBeVisible();
|
|
});
|
|
|
|
test('hides header when blurred', async ({page}) => {
|
|
const {frame} = await initializeTest(page);
|
|
await frame.locator('[data-testid="main-form"] [data-testid="form-editor"]').click();
|
|
await expect(frame.locator('[data-testid="main-form"] [data-testid="form-header"]')).toBeVisible();
|
|
await page.locator('body').click();
|
|
await expect(frame.locator('[data-testid="main-form"] [data-testid="form-header"]')).not.toBeVisible();
|
|
});
|
|
|
|
test('keeps showing header when blurred with unpublished changes', async ({page}) => {
|
|
const {frame} = await initializeTest(page);
|
|
await frame.locator('[data-testid="main-form"] [data-testid="form-editor"]').click();
|
|
await expect(frame.locator('[data-testid="main-form"] [data-testid="form-header"]')).toBeVisible();
|
|
await frame.locator('[data-testid="main-form"] [data-testid="form-editor"]').pressSequentially('Some text');
|
|
await page.locator('body').click();
|
|
await expect(frame.locator('[data-testid="main-form"] [data-testid="form-header"]')).toBeVisible();
|
|
});
|
|
});
|