Skip to content

Commit 7f4543a

Browse files
bhansell1bhansell1
committed
CCM-11459: refactor component
1 parent aa33625 commit 7f4543a

File tree

17 files changed

+256
-323
lines changed

17 files changed

+256
-323
lines changed

‎frontend/src/__tests__/components/forms/PreviewEmailTemplate/PreviewEmailTemplate.test.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -117,7 +117,7 @@ describe('Preview email form renders', () => {
117117
/>
118118
);
119119

120-
expect(screen.getByTestId('edit-template-link')).toHaveAttribute(
120+
expect(screen.getByTestId('edit-template-button')).toHaveAttribute(
121121
'href',
122122
'/templates/edit-email-template/template-id'
123123
);

‎frontend/src/__tests__/components/forms/PreviewEmailTemplate/__snapshots__/PreviewEmailTemplate.test.tsx.snap‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -951,7 +951,7 @@ exports[`Preview email form renders matches snapshot when navigating from edit s
951951
<a
952952
aria-disabled="false"
953953
class="nhsuk-button nhsuk-button--secondary"
954-
data-testid="edit-template-link"
954+
data-testid="edit-template-button"
955955
draggable="false"
956956
href="/templates/edit-email-template/template-id"
957957
role="button"
@@ -1357,7 +1357,7 @@ exports[`Preview email form renders matches snapshot when navigating from manage
13571357
<a
13581358
aria-disabled="false"
13591359
class="nhsuk-button nhsuk-button--secondary"
1360-
data-testid="edit-template-link"
1360+
data-testid="edit-template-button"
13611361
draggable="false"
13621362
href="/templates/edit-email-template/template-id"
13631363
role="button"

‎frontend/src/__tests__/components/forms/PreviewNHSAppTemplate/PreviewNHSAppTemplate.test.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -112,7 +112,7 @@ describe('Preview nhs app form renders', () => {
112112
/>
113113
);
114114

115-
expect(screen.getByTestId('edit-template-link')).toHaveAttribute(
115+
expect(screen.getByTestId('edit-template-button')).toHaveAttribute(
116116
'href',
117117
'/templates/edit-nhs-app-template/template-id'
118118
);

‎frontend/src/__tests__/components/forms/PreviewNHSAppTemplate/__snapshots__/PreviewNHSAppTemplate.test.tsx.snap‎

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -239,6 +239,7 @@ exports[`Preview nhs app form renders Routing feature flag - Disabled Client-sid
239239
Continue
240240
</button>
241241
</form>
242+
242243
<p>
243244
<a
244245
data-testid="back-to-templates-link-bottom"
@@ -492,6 +493,7 @@ exports[`Preview nhs app form renders Routing feature flag - Disabled matches er
492493
Continue
493494
</button>
494495
</form>
496+
495497
<p>
496498
<a
497499
data-testid="back-to-templates-link-bottom"
@@ -713,6 +715,7 @@ exports[`Preview nhs app form renders matches snapshot when navigating from edit
713715
Continue
714716
</button>
715717
</form>
718+
716719
<p>
717720
<a
718721
data-testid="back-to-templates-link-bottom"
@@ -851,13 +854,14 @@ exports[`Preview nhs app form renders matches snapshot when navigating from edit
851854
<a
852855
aria-disabled="false"
853856
class="nhsuk-button nhsuk-button--secondary"
854-
data-testid="edit-template-link"
857+
data-testid="edit-template-button"
855858
draggable="false"
856859
href="/templates/edit-nhs-app-template/template-id"
857860
role="button"
858861
>
859862
Edit template
860863
</a>
864+
861865
<p>
862866
<a
863867
data-testid="back-to-templates-link-bottom"
@@ -991,13 +995,14 @@ exports[`Preview nhs app form renders matches snapshot when navigating from mana
991995
<a
992996
aria-disabled="false"
993997
class="nhsuk-button nhsuk-button--secondary"
994-
data-testid="edit-template-link"
998+
data-testid="edit-template-button"
995999
draggable="false"
9961000
href="/templates/edit-nhs-app-template/template-id"
9971001
role="button"
9981002
>
9991003
Edit template
10001004
</a>
1005+
10011006
<p>
10021007
<a
10031008
data-testid="back-to-templates-link-bottom"
@@ -1214,6 +1219,7 @@ exports[`Preview nhs app form renders matches snapshot when navigating from mana
12141219
Continue
12151220
</button>
12161221
</form>
1222+
12171223
<p>
12181224
<a
12191225
data-testid="back-to-templates-link-bottom"

‎frontend/src/__tests__/components/forms/PreviewSMSTemplate/PreviewSMSTemplate.test.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -112,7 +112,7 @@ describe('Review sms form renders', () => {
112112
/>
113113
);
114114

115-
expect(screen.getByTestId('edit-template-link')).toHaveAttribute(
115+
expect(screen.getByTestId('edit-template-button')).toHaveAttribute(
116116
'href',
117117
'/templates/edit-text-message-template/template-id'
118118
);

‎frontend/src/__tests__/components/forms/PreviewSMSTemplate/__snapshots__/PreviewSMSTemplate.test.tsx.snap‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -851,7 +851,7 @@ exports[`Review sms form renders matches snapshot when navigating from edit scre
851851
<a
852852
aria-disabled="false"
853853
class="nhsuk-button nhsuk-button--secondary"
854-
data-testid="edit-template-link"
854+
data-testid="edit-template-button"
855855
draggable="false"
856856
href="/templates/edit-text-message-template/template-id"
857857
role="button"
@@ -1207,7 +1207,7 @@ exports[`Review sms form renders matches snapshot when navigating from manage te
12071207
<a
12081208
aria-disabled="false"
12091209
class="nhsuk-button nhsuk-button--secondary"
1210-
data-testid="edit-template-link"
1210+
data-testid="edit-template-button"
12111211
draggable="false"
12121212
href="/templates/edit-text-message-template/template-id"
12131213
role="button"

‎frontend/src/__tests__/components/organisms/PreviewDigitalTemplate.test.tsx‎

Lines changed: 122 additions & 118 deletions
Original file line numberDiff line numberDiff line change
@@ -1,142 +1,146 @@
11
import { mockDeep } from 'jest-mock-extended';
22
import { render, screen } from '@testing-library/react';
3-
import {
4-
PreviewDigitalTemplate,
5-
PreviewDigitalTemplateEditOnly,
6-
} from '@organisms/PreviewDigitalTemplate';
3+
import { PreviewDigitalTemplate } from '@organisms/PreviewDigitalTemplate';
74
import {
85
EmailTemplate,
96
FormState,
107
NHSAppTemplate,
118
} from 'nhs-notify-web-template-management-utils';
129

1310
describe('PreviewDigitalTemplate', () => {
14-
beforeEach(jest.resetAllMocks);
11+
describe('Routing disabled', () => {
12+
beforeEach(jest.resetAllMocks);
1513

16-
it('matches snapshot', () => {
17-
const container = render(
18-
<PreviewDigitalTemplate
19-
sectionHeading='NHS app message template'
20-
template={mockDeep<NHSAppTemplate>({
21-
id: 'template-id',
22-
name: 'Example NHS APP template',
23-
})}
24-
form={{
25-
formId: 'preview-form',
26-
radiosId: 'preview-example',
27-
action: '',
28-
state: {},
29-
pageHeading: 'Example heading',
30-
options: [
31-
{ id: 'option-1', text: 'option 1' },
32-
{ id: 'option-2', text: 'option 2' },
33-
],
34-
buttonText: 'Continue',
35-
}}
36-
previewDetailsComponent={<>Preview</>}
37-
/>
38-
);
14+
it('matches snapshot', () => {
15+
const container = render(
16+
<PreviewDigitalTemplate
17+
sectionHeading='NHS app message template'
18+
template={mockDeep<NHSAppTemplate>({
19+
id: 'template-id',
20+
name: 'Example NHS APP template',
21+
})}
22+
form={{
23+
formId: 'preview-form',
24+
radiosId: 'preview-example',
25+
action: '',
26+
state: {},
27+
pageHeading: 'Example heading',
28+
options: [
29+
{ id: 'option-1', text: 'option 1' },
30+
{ id: 'option-2', text: 'option 2' },
31+
],
32+
buttonText: 'Continue',
33+
}}
34+
previewDetailsComponent={<>Preview</>}
35+
routingEnabled={false}
36+
/>
37+
);
3938

40-
expect(container.asFragment()).toMatchSnapshot();
41-
});
39+
expect(container.asFragment()).toMatchSnapshot();
40+
});
4241

43-
it('matches error snapshot', () => {
44-
const state: FormState = {
45-
errorState: {
46-
formErrors: [],
47-
fieldErrors: {
48-
exampleError: ['Example error'],
42+
it('matches error snapshot', () => {
43+
const state: FormState = {
44+
errorState: {
45+
formErrors: [],
46+
fieldErrors: {
47+
exampleError: ['Example error'],
48+
},
4949
},
50-
},
51-
};
52-
const container = render(
53-
<PreviewDigitalTemplate
54-
sectionHeading='NHS app message template'
55-
template={mockDeep<NHSAppTemplate>({
56-
id: 'template-id',
57-
name: 'Example NHS APP template',
58-
})}
59-
form={{
60-
formId: 'preview-form',
61-
radiosId: 'preview-example',
62-
action: '',
63-
state,
64-
pageHeading: 'Example heading',
65-
options: [
66-
{ id: 'option-1', text: 'option 1' },
67-
{ id: 'option-2', text: 'option 2' },
68-
],
69-
buttonText: 'Continue',
70-
}}
71-
previewDetailsComponent={<>Preview</>}
72-
/>
73-
);
50+
};
51+
const container = render(
52+
<PreviewDigitalTemplate
53+
sectionHeading='NHS app message template'
54+
template={mockDeep<NHSAppTemplate>({
55+
id: 'template-id',
56+
name: 'Example NHS APP template',
57+
})}
58+
form={{
59+
formId: 'preview-form',
60+
radiosId: 'preview-example',
61+
action: '',
62+
state,
63+
pageHeading: 'Example heading',
64+
options: [
65+
{ id: 'option-1', text: 'option 1' },
66+
{ id: 'option-2', text: 'option 2' },
67+
],
68+
buttonText: 'Continue',
69+
}}
70+
previewDetailsComponent={<>Preview</>}
71+
routingEnabled={false}
72+
/>
73+
);
7474

75-
expect(container.asFragment()).toMatchSnapshot();
76-
});
75+
expect(container.asFragment()).toMatchSnapshot();
76+
});
7777

78-
it('renders component correctly', () => {
79-
render(
80-
<PreviewDigitalTemplate
81-
sectionHeading='Email template'
82-
template={mockDeep<EmailTemplate>({
83-
id: 'template-id',
84-
name: 'Example template',
85-
})}
86-
form={{
87-
formId: 'preview-form',
88-
radiosId: 'preview-example',
89-
action: '',
90-
state: {},
91-
pageHeading: 'Example heading',
92-
options: [
93-
{ id: 'option-1', text: 'option 1' },
94-
{ id: 'option-2', text: 'option 2' },
95-
],
96-
buttonText: 'Continue',
97-
}}
98-
previewDetailsComponent={<>Preview</>}
99-
/>
100-
);
78+
it('renders component correctly', () => {
79+
render(
80+
<PreviewDigitalTemplate
81+
sectionHeading='Email template'
82+
template={mockDeep<EmailTemplate>({
83+
id: 'template-id',
84+
name: 'Example template - routing disabled',
85+
})}
86+
form={{
87+
formId: 'preview-form',
88+
radiosId: 'preview-example',
89+
action: '',
90+
state: {},
91+
pageHeading: 'Example heading',
92+
options: [
93+
{ id: 'option-1', text: 'option 1' },
94+
{ id: 'option-2', text: 'option 2' },
95+
],
96+
buttonText: 'Continue',
97+
}}
98+
previewDetailsComponent={<>Preview</>}
99+
routingEnabled={false}
100+
/>
101+
);
101102

102-
expect(
103-
screen.getByTestId('preview-example-form__legend')
104-
).toHaveTextContent('Example heading');
103+
expect(
104+
screen.getByTestId('preview-example-form__legend')
105+
).toHaveTextContent('Example heading');
105106

106-
expect(screen.getByTestId('submit-button')).toHaveTextContent('Continue');
107+
expect(screen.getByTestId('submit-button')).toBeVisible();
108+
});
107109
});
108-
});
109110

110-
describe('PreviewDigitalTemplateEditOnly', () => {
111-
it('matches snapshot', () => {
112-
const container = render(
113-
<PreviewDigitalTemplateEditOnly
114-
sectionHeading={undefined}
115-
template={mockDeep<NHSAppTemplate>({
116-
id: 'template-id',
117-
name: 'Example NHS APP template',
118-
})}
119-
editPath='/edit-nhs-app-template/template-id'
120-
previewDetailsComponent={<>Preview</>}
121-
/>
122-
);
111+
describe('Routing enabled', () => {
112+
it('matches snapshot', () => {
113+
const container = render(
114+
<PreviewDigitalTemplate
115+
sectionHeading={undefined}
116+
template={mockDeep<NHSAppTemplate>({
117+
id: 'template-id',
118+
name: 'Example NHS APP template',
119+
})}
120+
editPath='/edit-nhs-app-template/template-id'
121+
previewDetailsComponent={<>Preview</>}
122+
routingEnabled={true}
123+
/>
124+
);
123125

124-
expect(container.asFragment()).toMatchSnapshot();
125-
});
126+
expect(container.asFragment()).toMatchSnapshot();
127+
});
126128

127-
it('matches snapshot with section heading', () => {
128-
const container = render(
129-
<PreviewDigitalTemplateEditOnly
130-
sectionHeading='Template saved'
131-
template={mockDeep<NHSAppTemplate>({
132-
id: 'template-id',
133-
name: 'Example NHS APP template',
134-
})}
135-
editPath='/edit-nhs-app-template/template-id'
136-
previewDetailsComponent={<>Preview</>}
137-
/>
138-
);
129+
it('renders component correctly', () => {
130+
render(
131+
<PreviewDigitalTemplate
132+
sectionHeading='Email template - routing enabled'
133+
template={mockDeep<NHSAppTemplate>({
134+
id: 'template-id',
135+
name: 'Example NHS APP template',
136+
})}
137+
editPath='/edit-nhs-app-template/template-id'
138+
previewDetailsComponent={<>Preview</>}
139+
routingEnabled={true}
140+
/>
141+
);
139142

140-
expect(container.asFragment()).toMatchSnapshot();
143+
expect(screen.getByTestId('edit-template-button')).toBeVisible();
144+
});
141145
});
142146
});

0 commit comments

Comments
 (0)