Skip to content

Commit 669d61a

Browse files
committed
compnent test
1 parent a0345d8 commit 669d61a

File tree

4 files changed

+301
-8
lines changed

4 files changed

+301
-8
lines changed

frontend/src/__tests__/components/organisms/PreviewLetterTemplate.test.tsx

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -80,4 +80,30 @@ describe('PreviewLetterTemplate component', () => {
8080

8181
expect(container.asFragment()).toMatchSnapshot();
8282
});
83+
84+
it('matches snapshot when template status is NOT_YET_SUBMITTED', () => {
85+
const container = render(
86+
<PreviewLetterTemplate
87+
template={{
88+
id: '0A097DCD-35F9-4DAD-A37E-AC358B71B74D',
89+
name: 'letter',
90+
templateType: 'LETTER',
91+
templateStatus: 'NOT_YET_SUBMITTED',
92+
letterType: 'x0',
93+
language: 'en',
94+
files: {
95+
pdfTemplate: {
96+
fileName: 'file.pdf',
97+
currentVersion: 'b',
98+
virusScanStatus: 'PASSED',
99+
},
100+
},
101+
createdAt: '2025-04-02T09:33:25.729Z',
102+
updatedAt: '2025-04-02T09:33:25.729Z',
103+
}}
104+
/>
105+
);
106+
107+
expect(container.asFragment()).toMatchSnapshot();
108+
});
83109
});

frontend/src/__tests__/components/organisms/__snapshots__/PreviewLetterTemplate.test.tsx.snap

Lines changed: 155 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -155,6 +155,161 @@ exports[`PreviewLetterTemplate component matches snapshot 1`] = `
155155
</DocumentFragment>
156156
`;
157157

158+
exports[`PreviewLetterTemplate component matches snapshot when template status is NOT_YET_SUBMITTED 1`] = `
159+
<DocumentFragment>
160+
<div
161+
class="nhsuk-back-link"
162+
>
163+
<a
164+
class="nhsuk-back-link__link"
165+
href="/templates/message-templates"
166+
id="back-link"
167+
>
168+
<svg
169+
aria-hidden="true"
170+
class="nhsuk-icon nhsuk-icon__chevron-left"
171+
height="24"
172+
viewBox="0 0 24 24"
173+
width="24"
174+
xmlns="http://www.w3.org/2000/svg"
175+
>
176+
<path
177+
d="M8.5 12c0-.3.1-.5.3-.7l5-5c.4-.4 1-.4 1.4 0s.4 1 0 1.4L10.9 12l4.3 4.3c.4.4.4 1 0 1.4s-1 .4-1.4 0l-5-5c-.2-.2-.3-.4-.3-.7z"
178+
/>
179+
</svg>
180+
Back to all templates
181+
</a>
182+
</div>
183+
<main
184+
class="nhsuk-main-wrapper"
185+
id="maincontent"
186+
role="main"
187+
>
188+
<div
189+
class="nhsuk-grid-row"
190+
>
191+
<div
192+
class="nhsuk-grid-column-full"
193+
>
194+
<h1
195+
class="preview__heading"
196+
data-testid="preview-message__heading"
197+
>
198+
letter
199+
</h1>
200+
<div
201+
class="nhsuk-width-container nhsuk-u-margin-bottom-6 nhsuk-body-m"
202+
>
203+
<dl
204+
class="nhsuk-summary-list nhsuk-u-margin-bottom-4 preview"
205+
>
206+
<div
207+
class="nhsuk-summary-list__row"
208+
>
209+
<dt
210+
class="nhsuk-summary-list__key"
211+
>
212+
Template ID
213+
</dt>
214+
<dd
215+
class="nhsuk-summary-list__value"
216+
>
217+
0A097DCD-35F9-4DAD-A37E-AC358B71B74D
218+
</dd>
219+
</div>
220+
<div
221+
class="nhsuk-summary-list__row"
222+
>
223+
<dt
224+
class="nhsuk-summary-list__key"
225+
>
226+
Type
227+
</dt>
228+
<dd
229+
class="nhsuk-summary-list__value"
230+
>
231+
Standard letter
232+
</dd>
233+
</div>
234+
<div
235+
class="nhsuk-summary-list__row"
236+
>
237+
<dt
238+
class="nhsuk-summary-list__key"
239+
>
240+
Status
241+
</dt>
242+
<dd
243+
class="nhsuk-summary-list__value"
244+
>
245+
<strong
246+
class="nhsuk-tag"
247+
>
248+
Not yet submitted
249+
</strong>
250+
</dd>
251+
</div>
252+
<div
253+
class="nhsuk-summary-list__row"
254+
>
255+
<dt
256+
class="nhsuk-summary-list__key"
257+
>
258+
Template file
259+
</dt>
260+
<dd
261+
class="nhsuk-summary-list__value"
262+
>
263+
<div
264+
class="container"
265+
>
266+
<svg
267+
class="icon"
268+
fill="none"
269+
height="26"
270+
viewBox="0 0 20 26"
271+
width="20"
272+
xmlns="http://www.w3.org/2000/svg"
273+
>
274+
<path
275+
d="M0 0V26H20V6.59375L19.7188 6.28125L13.7188 0.28125L13.4062 0H0ZM2 2H12V8H18V24H2V2ZM14 3.4375L16.5625 6H14V3.4375Z"
276+
fill="#4C6272"
277+
/>
278+
</svg>
279+
<p
280+
class="text"
281+
>
282+
file.pdf
283+
</p>
284+
</div>
285+
</dd>
286+
</div>
287+
</dl>
288+
</div>
289+
<a
290+
aria-disabled="false"
291+
class="nhsuk-button"
292+
data-testid="preview-letter-template-cta"
293+
draggable="false"
294+
href="/templates/submit-letter-template/0A097DCD-35F9-4DAD-A37E-AC358B71B74D"
295+
id="preview-letter-template-cta"
296+
role="button"
297+
>
298+
Submit template
299+
</a>
300+
<p>
301+
<a
302+
href="/message-templates"
303+
>
304+
Back to all templates
305+
</a>
306+
</p>
307+
</div>
308+
</div>
309+
</main>
310+
</DocumentFragment>
311+
`;
312+
158313
exports[`PreviewLetterTemplate component matches snapshot when template status is PENDING_PROOF_REQUEST 1`] = `
159314
<DocumentFragment>
160315
<div

tests/test-team/template-mgmt-component-tests/letter/template-mgmt-preview-letter-page.component.spec.ts

Lines changed: 64 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,8 @@ import {
77
TestUserId,
88
} from '../../helpers/auth/cognito-auth-helper';
99
import { TemplateMgmtPreviewLetterPage } from '../../pages/letter/template-mgmt-preview-letter-page';
10+
import { TemplateMgmtSubmitLetterPage } from '../../pages/letter/template-mgmt-submit-letter-page';
11+
import { TemplateMgmtRequestProofPage } from '../../pages/template-mgmt-request-proof-page';
1012

1113
async function createTemplates() {
1214
const user = await createAuthHelper().getTestUser(TestUserId.User1);
@@ -20,16 +22,26 @@ async function createTemplates() {
2022
templateStatus: 'NOT_YET_SUBMITTED',
2123
owner: user.userId,
2224
} as Template,
23-
valid: TemplateFactory.createLetterTemplate(
24-
'valid-letter-preview-template',
25+
notYetSubmitted: TemplateFactory.createLetterTemplate(
26+
'nys-letter-preview-template',
2527
user.userId,
26-
'test-template-letter'
28+
'notYetSubmitted'
29+
),
30+
pendingProofRequest: TemplateFactory.createLetterTemplate(
31+
'ppr-letter-preview-template',
32+
user.userId,
33+
'pendingProofRequest'
34+
),
35+
pendingUpload: TemplateFactory.createLetterTemplate(
36+
'pu-letter-preview-template',
37+
user.userId,
38+
'pendingUpload'
2739
),
2840
};
2941
}
3042

3143
test.describe('Preview Letter template Page', () => {
32-
let templates: { empty: Template; valid: Template };
44+
let templates: Awaited<ReturnType<typeof createTemplates>>;
3345

3446
const templateStorageHelper = new TemplateStorageHelper();
3547

@@ -42,21 +54,65 @@ test.describe('Preview Letter template Page', () => {
4254
await templateStorageHelper.deleteSeededTemplates();
4355
});
4456

45-
test('when user visits page, then page is loaded', async ({
57+
test('when user visits page, then page is loaded, can click to go to submit page', async ({
4658
page,
4759
baseURL,
4860
}) => {
4961
const previewLetterTemplatePage = new TemplateMgmtPreviewLetterPage(page);
5062

51-
await previewLetterTemplatePage.loadPage(templates.valid.id);
63+
await previewLetterTemplatePage.loadPage(templates.notYetSubmitted.id);
5264

5365
await expect(page).toHaveURL(
54-
`${baseURL}/templates/${TemplateMgmtPreviewLetterPage.pageUrlSegment}/${templates.valid.id}`
66+
`${baseURL}/templates/${TemplateMgmtPreviewLetterPage.pageUrlSegment}/${templates.notYetSubmitted.id}`
5567
);
5668

5769
await expect(previewLetterTemplatePage.pageHeader).toContainText(
58-
'test-template-letter'
70+
templates.notYetSubmitted.name
71+
);
72+
73+
await previewLetterTemplatePage.clickContinueButton();
74+
75+
await expect(page).toHaveURL(TemplateMgmtSubmitLetterPage.urlRegexp);
76+
});
77+
78+
test('when template is pending a proof request, user can click to go to request page', async ({
79+
page,
80+
baseURL,
81+
}) => {
82+
const previewLetterTemplatePage = new TemplateMgmtPreviewLetterPage(page);
83+
84+
await previewLetterTemplatePage.loadPage(templates.pendingProofRequest.id);
85+
86+
await expect(page).toHaveURL(
87+
`${baseURL}/templates/${TemplateMgmtPreviewLetterPage.pageUrlSegment}/${templates.pendingProofRequest.id}`
5988
);
89+
90+
await expect(previewLetterTemplatePage.pageHeader).toContainText(
91+
templates.pendingProofRequest.name
92+
);
93+
94+
await previewLetterTemplatePage.clickContinueButton();
95+
96+
await expect(page).toHaveURL(TemplateMgmtRequestProofPage.urlRegexp);
97+
});
98+
99+
test('when status is not actionable, no continue button is displayed', async ({
100+
page,
101+
baseURL,
102+
}) => {
103+
const previewLetterTemplatePage = new TemplateMgmtPreviewLetterPage(page);
104+
105+
await previewLetterTemplatePage.loadPage(templates.pendingUpload.id);
106+
107+
await expect(page).toHaveURL(
108+
`${baseURL}/templates/${TemplateMgmtPreviewLetterPage.pageUrlSegment}/${templates.pendingUpload.id}`
109+
);
110+
111+
await expect(previewLetterTemplatePage.pageHeader).toContainText(
112+
templates.pendingUpload.name
113+
);
114+
115+
await expect(previewLetterTemplatePage.continueButton).toBeHidden();
60116
});
61117

62118
test.describe('Error handling', () => {
Lines changed: 56 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,56 @@
1+
import { test, expect } from '@playwright/test';
2+
import { TemplateStorageHelper } from '../../helpers/db/template-storage-helper';
3+
import { TemplateFactory } from '../../helpers/factories/template-factory';
4+
import { Template } from '../../helpers/types';
5+
import {
6+
createAuthHelper,
7+
TestUserId,
8+
} from '../../helpers/auth/cognito-auth-helper';
9+
import { TemplateMgmtPreviewLetterPage } from '../../pages/letter/template-mgmt-preview-letter-page';
10+
import { TemplateMgmtSubmitLetterPage } from '../../pages/letter/template-mgmt-submit-letter-page';
11+
import { TemplateMgmtRequestProofPage } from '../../pages/template-mgmt-request-proof-page';
12+
13+
async function createTemplates() {
14+
const user = await createAuthHelper().getTestUser(TestUserId.User1);
15+
return {
16+
valid: TemplateFactory.createLetterTemplate(
17+
'letter-request-proof-template',
18+
user.userId,
19+
'request-proof'
20+
),
21+
};
22+
}
23+
24+
test.describe('Request Proof Page', () => {
25+
let templates: Awaited<ReturnType<typeof createTemplates>>;
26+
27+
const templateStorageHelper = new TemplateStorageHelper();
28+
29+
test.beforeAll(async () => {
30+
templates = await createTemplates();
31+
await templateStorageHelper.seedTemplateData(Object.values(templates));
32+
});
33+
34+
test.afterAll(async () => {
35+
await templateStorageHelper.deleteSeededTemplates();
36+
});
37+
38+
test('when user visits page, then page is loaded, can click to go to submit page', async ({
39+
page,
40+
baseURL,
41+
}) => {
42+
const requestProofPage = new TemplateMgmtRequestProofPage(page);
43+
44+
await requestProofPage.loadPage(templates.valid.id);
45+
46+
await expect(page).toHaveURL(
47+
`${baseURL}/templates/${TemplateMgmtRequestProofPage.pageUrlSegment}/${templates.valid.id}`
48+
);
49+
50+
await expect(requestProofPage.pageHeader).toContainText(
51+
templates.valid.name
52+
);
53+
54+
await expect(requestProofPage.requestProofButton).toBeVisible();
55+
});
56+
});

0 commit comments

Comments
 (0)