Skip to content

Commit 6e78175

Browse files
m-salaudeenm-salaudeen
authored
Merge pull request #170 from NHSDigital/feature/CCM-7079_nhsapp_review_template_page_automation
CCM-7079: NHS App Review page page automation
2 parents 27a4d00 + d6b85e8 commit 6e78175

File tree

5 files changed

+261
-1
lines changed

5 files changed

+261
-1
lines changed

‎src/__tests__/components/forms/CreateNhsAppTemplate/__snapshots__/CreateNhsAppTemplate.test.tsx.snap‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -151,6 +151,7 @@ exports[`renders page 1`] = `
151151
/>
152152
</div>
153153
<p
154+
id="character-count"
154155
style=""
155156
>
156157
0 of 5000 characters
@@ -614,6 +615,7 @@ exports[`renders page one error 1`] = `
614615
/>
615616
</div>
616617
<p
618+
id="character-count"
617619
style=""
618620
>
619621
0 of 5000 characters
@@ -1091,6 +1093,7 @@ exports[`renders page with multiple errors 1`] = `
10911093
/>
10921094
</div>
10931095
<p
1096+
id="character-count"
10941097
style=""
10951098
>
10961099
0 of 5000 characters
@@ -1512,6 +1515,7 @@ exports[`renders page with preloaded field values 1`] = `
15121515
</textarea>
15131516
</div>
15141517
<p
1518+
id="character-count"
15151519
style=""
15161520
>
15171521
16 of 5000 characters

‎src/components/forms/CreateNhsAppTemplate/CreateNhsAppTemplate.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -101,7 +101,7 @@ export const CreateNhsAppTemplate: FC<PageComponentProps> = ({
101101
error={templateMessageError}
102102
errorProps={{ id: 'nhsAppTemplateMessage-error-message' }}
103103
/>
104-
<p style={useJsEnabledStyle()}>
104+
<p style={useJsEnabledStyle()} id='character-count'>
105105
{nhsAppTemplateMessage.length}
106106
{characterCountText}
107107
</p>

‎tests/test-team/pages/nhs-app/template-mgmt-create-nhs-app-page.ts‎

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
import { Locator, Page } from '@playwright/test';
2+
import { TemplateMgmtBasePage } from '../template-mgmt-base-page';
3+
import { TemplateMgmtMessageFormatting } from '../template-mgmt-message-formatting';
4+
5+
export class TemplateMgmtCreateNhsAppPage extends TemplateMgmtBasePage {
6+
public readonly nameInput: Locator;
7+
8+
public readonly messageTextArea: Locator;
9+
10+
public readonly errorSummary: Locator;
11+
12+
public readonly personalisationFields: Locator;
13+
14+
public readonly namingYourTemplate: Locator;
15+
16+
public readonly characterCountText: Locator;
17+
18+
public readonly messageFormatting: TemplateMgmtMessageFormatting;
19+
20+
constructor(page: Page) {
21+
super(page);
22+
this.nameInput = page.locator('[id="nhsAppTemplateName"]');
23+
this.messageTextArea = page.locator('[id="nhsAppTemplateMessage"]');
24+
this.errorSummary = page.locator('[class="nhsuk-error-summary"]');
25+
this.personalisationFields = page.locator(
26+
'[data-testid="personalisation-details"]'
27+
);
28+
this.namingYourTemplate = page.locator(
29+
'[data-testid="how-to-name-your-template"]'
30+
);
31+
this.characterCountText = page.locator('[id="character-count"]');
32+
this.messageFormatting = new TemplateMgmtMessageFormatting(page);
33+
}
34+
35+
async loadPage(sessionId: string) {
36+
await this.navigateTo(`/templates/create-nhs-app-template/${sessionId}`);
37+
}
38+
}

‎tests/test-team/pages/nhs-app/template-mgmt-preview-nhs-app-page.ts‎

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
import { Locator, Page } from '@playwright/test';
2+
import { TemplateMgmtBasePage } from '../template-mgmt-base-page';
3+
4+
export class TemplateMgmtPreviewNhsAppPage extends TemplateMgmtBasePage {
5+
public readonly editRadioOption: Locator;
6+
7+
public readonly submitRadioOption: Locator;
8+
9+
public readonly errorSummary: Locator;
10+
11+
public readonly messageText: Locator;
12+
13+
public readonly whoYourNhsAppNotificationWillBeSentFrom: Locator;
14+
15+
constructor(page: Page) {
16+
super(page);
17+
this.editRadioOption = page.locator(
18+
'[id="reviewNHSAppTemplateAction-nhsapp-edit"]'
19+
);
20+
this.submitRadioOption = page.locator(
21+
'[id="reviewNHSAppTemplateAction-nhsapp-submit"]'
22+
);
23+
this.errorSummary = page.locator('[class="nhsuk-error-summary"]');
24+
this.messageText = page.locator('[id="preview-content-message"]');
25+
this.whoYourNhsAppNotificationWillBeSentFrom = page.locator(
26+
'[data-testid="preview-message-details"]'
27+
);
28+
}
29+
30+
async loadPage(sessionId: string) {
31+
await this.navigateTo(`/templates/preview-nhs-app-template/${sessionId}`);
32+
}
33+
}

‎tests/test-team/template-mgmt-component-tests/nhs-app/template-mgmt-preview-nhs-app-page.component.ts‎

Lines changed: 185 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,185 @@
1+
import { test, expect } from '@playwright/test';
2+
import SessionStorageHelper from '../../helpers/session-storage-helper';
3+
import { TemplateMgmtPreviewNhsAppPage } from '../../pages/nhs-app/template-mgmt-preview-nhs-app-page';
4+
import { SessionFactory } from '../../helpers/session-factory';
5+
import {
6+
assertFooterLinks,
7+
assertGoBackLink,
8+
assertLoginLink,
9+
assertNotifyBannerLink,
10+
assertSkipToMainContent,
11+
} from '../template-mgmt-common.steps';
12+
13+
const sessions = {
14+
empty: SessionFactory.createNhsAppSession('empty-nhs-app-preview-session'),
15+
valid: {
16+
...SessionFactory.createNhsAppSession('valid-nhs-app-preview-session'),
17+
nhsAppTemplateName: 'test-template-nhs-app',
18+
nhsAppTemplateMessage: 'test-template-message',
19+
},
20+
};
21+
22+
test.describe('Preview NHS App template Page', () => {
23+
const sessionStorageHelper = new SessionStorageHelper(
24+
Object.values(sessions)
25+
);
26+
27+
test.beforeAll(async () => {
28+
await sessionStorageHelper.seedSessionData();
29+
});
30+
31+
test.afterAll(async () => {
32+
await sessionStorageHelper.deleteSessionData();
33+
});
34+
35+
test('when user visits page, then page is loaded', async ({
36+
page,
37+
baseURL,
38+
}) => {
39+
const previewNhsAppTemplatePage = new TemplateMgmtPreviewNhsAppPage(page);
40+
41+
await previewNhsAppTemplatePage.loadPage(sessions.valid.id);
42+
43+
await expect(page).toHaveURL(
44+
`${baseURL}/templates/preview-nhs-app-template/${sessions.valid.id}`
45+
);
46+
47+
await expect(previewNhsAppTemplatePage.editRadioOption).not.toBeChecked();
48+
49+
await expect(previewNhsAppTemplatePage.submitRadioOption).not.toBeChecked();
50+
51+
await expect(previewNhsAppTemplatePage.pageHeader).toContainText(
52+
'NHS App message template'
53+
);
54+
55+
await expect(previewNhsAppTemplatePage.pageHeader).toContainText(
56+
'test-template-nhs-app'
57+
);
58+
59+
await expect(previewNhsAppTemplatePage.messageText).toHaveText(
60+
'test-template-message'
61+
);
62+
});
63+
64+
test.describe('Page functionality', () => {
65+
test('common page tests', async ({ page, baseURL }) => {
66+
const props = {
67+
page: new TemplateMgmtPreviewNhsAppPage(page),
68+
id: sessions.valid.id,
69+
baseURL,
70+
};
71+
72+
await assertSkipToMainContent(props);
73+
await assertNotifyBannerLink(props);
74+
await assertLoginLink(props);
75+
await assertFooterLinks(props);
76+
await assertGoBackLink({
77+
...props,
78+
expectedUrl: `templates/create-nhs-app-template/${sessions.valid.id}`,
79+
});
80+
});
81+
82+
test('when user clicks "Who your NHS App notification will be sent from" tool tips, then tool tips are displayed', async ({
83+
page,
84+
}) => {
85+
const previewNhsAppTemplatePage = new TemplateMgmtPreviewNhsAppPage(page);
86+
87+
await previewNhsAppTemplatePage.loadPage(sessions.valid.id);
88+
89+
await previewNhsAppTemplatePage.whoYourNhsAppNotificationWillBeSentFrom.click(
90+
{
91+
position: { x: 0, y: 0 },
92+
}
93+
);
94+
95+
await expect(
96+
previewNhsAppTemplatePage.whoYourNhsAppNotificationWillBeSentFrom
97+
).toHaveAttribute('open');
98+
});
99+
100+
test('when user submits form with "Edit" data, then the "Create NHS App message template" page is displayed', async ({
101+
baseURL,
102+
page,
103+
}) => {
104+
const previewNhsAppTemplatePage = new TemplateMgmtPreviewNhsAppPage(page);
105+
106+
await previewNhsAppTemplatePage.loadPage(sessions.valid.id);
107+
108+
await previewNhsAppTemplatePage.editRadioOption.click();
109+
110+
await previewNhsAppTemplatePage.clickContinueButton();
111+
112+
await expect(page).toHaveURL(
113+
`${baseURL}/templates/create-nhs-app-template/${sessions.valid.id}`
114+
);
115+
});
116+
117+
test('when user submits form with "Submit" data, then the "Are you sure you want to submit" page is displayed', async ({
118+
baseURL,
119+
page,
120+
}) => {
121+
const previewNhsAppTemplatePage = new TemplateMgmtPreviewNhsAppPage(page);
122+
123+
await previewNhsAppTemplatePage.loadPage(sessions.valid.id);
124+
125+
await previewNhsAppTemplatePage.submitRadioOption.click();
126+
127+
await previewNhsAppTemplatePage.clickContinueButton();
128+
129+
await expect(page).toHaveURL(
130+
`${baseURL}/templates/submit-nhs-app-template/${sessions.valid.id}`
131+
);
132+
});
133+
});
134+
135+
test.describe('Error handling', () => {
136+
test('when user visits page with missing data, then an invalid session error is displayed', async ({
137+
baseURL,
138+
page,
139+
}) => {
140+
const previewNhsAppTemplatePage = new TemplateMgmtPreviewNhsAppPage(page);
141+
142+
await previewNhsAppTemplatePage.loadPage(sessions.empty.id);
143+
144+
await expect(page).toHaveURL(`${baseURL}/templates/invalid-session`);
145+
});
146+
147+
test('when user visits page with a fake session, then an invalid session error is displayed', async ({
148+
baseURL,
149+
page,
150+
}) => {
151+
const previewNhsAppTemplatePage = new TemplateMgmtPreviewNhsAppPage(page);
152+
153+
await previewNhsAppTemplatePage.loadPage('/fake-session-id');
154+
155+
await expect(page).toHaveURL(`${baseURL}/templates/invalid-session`);
156+
});
157+
158+
test('when user submits page with no data, then an error is displayed', async ({
159+
page,
160+
}) => {
161+
const errorMessage = 'Select an option';
162+
163+
const previewNhsAppTemplatePage = new TemplateMgmtPreviewNhsAppPage(page);
164+
165+
await previewNhsAppTemplatePage.loadPage(sessions.valid.id);
166+
167+
await previewNhsAppTemplatePage.clickContinueButton();
168+
169+
await expect(previewNhsAppTemplatePage.errorSummary).toBeVisible();
170+
171+
const selectOptionErrorLink =
172+
previewNhsAppTemplatePage.errorSummary.locator(
173+
'[href="#reviewNHSAppTemplateAction"]'
174+
);
175+
176+
await expect(selectOptionErrorLink).toHaveText(errorMessage);
177+
178+
await selectOptionErrorLink.click();
179+
180+
await expect(
181+
page.locator('#reviewNHSAppTemplateAction')
182+
).toBeInViewport();
183+
});
184+
});
185+
});

0 commit comments

Comments
 (0)