Ghost/ghost/core/test/e2e-browser/admin/announcement-bar-settings.spec.js
Sam Lord 4815aa6e7f
Parallelise browser tests
refs: https://github.com/TryGhost/DevOps/issues/78

Re-introduce parallel browser tests

These were adding in a previous PR, but the difference between local
running tests and using CI introduced failures.

Added additional fixes to ensure the Stripe API key is used in the CLI when running in CI.
2023-10-13 11:42:39 +00:00

63 lines
2.7 KiB
JavaScript

const {expect} = require('@playwright/test');
const test = require('../fixtures/ghost-test');
test.describe('Announcement Bar Settings', () => {
test('Bar hidden by default', async ({page}) => {
await page.goto('/ghost');
await goToAnnouncementBarSettings(page);
await test.step('Bar should be hidden', async () => {
const htmlFrame = getPreviewFrame(page);
await expect(await htmlFrame.locator('#announcement-bar-root')).toHaveCount(0);
});
});
test('Show/hide bar if visibility checked/unchecked and text filled', async ({page}) => {
await page.goto('/ghost');
const modal = await goToAnnouncementBarSettings(page);
await test.step('Check free members', async () => {
const freeMembersCheckbox = modal.getByLabel('Free members');
await expect(freeMembersCheckbox).not.toBeChecked();
await freeMembersCheckbox.check();
});
await test.step('Fill announcement text', async () => {
await modal.locator('.koenig-react-editor').click();
await expect(await modal.locator('[contenteditable="true"]')).toBeVisible({timeout: 30000}); // add timeout as lexical module loading can take time
await page.keyboard.type('Announcement text');
await modal.getByText('Announcement').first().click(); // defocus the editor
});
const htmlFrame = getPreviewFrame(page);
await test.step('Announcement bar should be visible', async () => {
await expect(await htmlFrame.getByText('Announcement text')).toBeVisible();
});
await test.step('Disable free members', async () => {
const freeMembersCheckbox = modal.getByLabel('Free members');
await expect(freeMembersCheckbox).toBeChecked();
await freeMembersCheckbox.uncheck();
await modal.locator('.koenig-react-editor').click();
});
await test.step('Announcement bar should be hidden', async () => {
await expect(await htmlFrame.getByText('Announcement text')).toBeHidden();
});
});
});
async function goToAnnouncementBarSettings(page) {
await test.step('Navigate to the announcement bar settings', async () => {
await page.locator('[data-test-nav="settings"]').click();
await page.getByTestId('announcement-bar').getByRole('button', {name: 'Customize'}).click();
// Wait for the preview to load
await getPreviewFrame(page).locator('body *:visible').first().waitFor();
});
return page.getByTestId('announcement-bar-modal');
}
function getPreviewFrame(page) {
return page.frameLocator('[data-testid="announcement-bar-preview-iframe"] > iframe[data-visible=true]');
}