TryGhost/Ghost
1
0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2024-11-27 18:52:14 +03:00
Code Issues Projects Releases Wiki Activity

Added tests for code injection (#17623)

Browse Source 
refs https://github.com/TryGhost/Product/issues/3688
This commit is contained in:
Jono M 2023-08-08 10:08:19 +01:00 committed by GitHub
parent 209649c556
commit 2ccb04ed7f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 84 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
apps/admin-x-settings/src/components/settings/advanced/CodeInjection.tsx
View File

@ -46,12 +46,12 @@ const CodeInjection: React.FC<{ keywords: string[] }> = ({keywords}) => {
{
id: 'header',
title: 'Site header',
contents: (<CodeEditor {...headerProps} ref={headerEditorRef} autoFocus />)
contents: (<CodeEditor {...headerProps} ref={headerEditorRef} data-testid='header-code' autoFocus />)
},
{
id: 'footer',
title: 'Site footer',
contents: (<CodeEditor {...footerProps} ref={footerEditorRef} />)
contents: (<CodeEditor {...footerProps} ref={footerEditorRef} data-testid='footer-code' />)
}
] as const;

2
apps/admin-x-settings/src/components/settings/advanced/code/CodeModal.tsx
View File

@ -19,7 +19,7 @@ const CodeModal: React.FC<CodeModalProps> = ({hint, value, onChange, afterClose}
afterClose?.();
};
return <Modal afterClose={afterClose} cancelLabel='' okColor='grey' okLabel='Done' size='full' onOk={onOk}>
return <Modal afterClose={afterClose} cancelLabel='' okColor='grey' okLabel='Done' size='full' testId='modal-code' onOk={onOk}>
<CodeEditor extensions={[html()]} height='full' hint={hint} value={value} autoFocus onChange={onChange} />
</Modal>;
};

81
apps/admin-x-settings/test/e2e/advanced/codeInjection.test.ts Normal file
View File

@ -0,0 +1,81 @@
import {expect, test} from '@playwright/test';
import {globalDataRequests, mockApi, updatedSettingsResponse} from '../../utils/e2e';
test.describe('Code injection settings', async () => {
test('Supports adding injected code', async ({page}) => {
const {lastApiRequests} = await mockApi({page, requests: {
...globalDataRequests,
editSettings: {method: 'PUT', path: '/settings/', response: updatedSettingsResponse([
{key: 'codeinjection_head', value: '<testhead />'},
{key: 'codeinjection_foot', value: '<testfoot />'}
])}
}});
await page.goto('/');
const section = page.getByTestId('code-injection');
await section.getByRole('button', {name: 'Edit'}).click();
for (const character of '<testhead />'.split('')) {
await page.keyboard.press(character);
}
await section.getByRole('tab', {name: 'Site footer'}).click();
await section.getByTestId('footer-code').click();
for (const character of '<testfoot />'.split('')) {
await page.keyboard.press(character);
}
await section.getByRole('button', {name: 'Save'}).click();
expect(lastApiRequests.editSettings?.body).toEqual({
settings: [
{key: 'codeinjection_head', value: '<testhead />'},
{key: 'codeinjection_foot', value: '<testfoot />'}
]
});
});
test('Supports continuing editing in fullscreen', async ({page}) => {
const {lastApiRequests} = await mockApi({page, requests: {
...globalDataRequests,
editSettings: {method: 'PUT', path: '/settings/', response: updatedSettingsResponse([
{key: 'codeinjection_head', value: '<1 /><2 /><3 />'}
])}
}});
await page.goto('/');
const section = page.getByTestId('code-injection');
await section.getByRole('button', {name: 'Edit'}).click();
for (const character of '<1 />'.split('')) {
await page.keyboard.press(character);
}
await section.getByRole('button', {name: 'Fullscreen'}).click();
await page.keyboard.press('End');
for (const character of '<2 />'.split('')) {
await page.keyboard.press(character);
}
await page.getByTestId('modal-code').getByRole('button', {name: 'Done'}).click();
await page.keyboard.press('End');
for (const character of '<3 />'.split('')) {
await page.keyboard.press(character);
}
await section.getByRole('button', {name: 'Save'}).click();
expect(lastApiRequests.editSettings?.body).toEqual({
settings: [
{key: 'codeinjection_head', value: '<1 /><2 /><3 />'}
]
});
});
});