Skip to content
This repository was archived by the owner on Dec 1, 2025. It is now read-only.

Commit a7049e5

Browse files
d4lekd4lek
authored
Merge pull request #91 from thepensionsregulator/feature-editorfonts-a-tag
editor fons + tests
2 parents 83a9664 + df60c98 commit a7049e5

7 files changed

Lines changed: 211 additions & 4 deletions

File tree

‎packages/icons/src/__tests__/icons.spec.tsx‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
import React from 'react';
2+
import { CheckboxChecked } from '../icons';
3+
import { render } from '@testing-library/react';
4+
5+
describe('Icons', () => {
6+
test('SVG component renders it`s children', () => {
7+
const testId = 'svg-icon';
8+
const { getByTestId } = render(
9+
<CheckboxChecked cfg={{ fill: 'danger.1' }} testId={testId} />,
10+
);
11+
12+
expect(getByTestId(testId)).toBeDefined();
13+
expect(getByTestId(testId).innerHTML).toMatchInlineSnapshot(
14+
`"<path d=\\"M 354.5 1304.5 L 387.5 1304.5 L 387.5 1337.5 L 354.5 1337.5 L 354.5 1304.5 Z \\" fill-rule=\\"nonzero\\" fill=\\"#f2f2f2\\" stroke=\\"none\\"></path><path d=\\"M 353 1303 L 389 1303 L 389 1339 L 353 1339 L 353 1303 Z \\" stroke-width=\\"4\\" stroke=\\"#585858\\" fill=\\"none\\"></path><path d=\\"M 359.571428571429 1321 L 368.142857142857 1329.57142857143 \\" stroke-width=\\"8.57142857142857\\" stroke=\\"#036db8\\" fill=\\"none\\"></path><path d=\\"M 368.142857142857 1329.57142857143 L 382.428571428571 1309.57142857143 \\" stroke-width=\\"8.57142857142857\\" stroke=\\"#036db8\\" fill=\\"none\\"></path>"`,
15+
);
16+
});
17+
});

‎packages/icons/src/icons.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ export const SVG: React.FC<SVGProps> = ({
3939
xmlns="http://www.w3.org/2000/svg"
4040
className={classNames}
4141
xmlnsXlink="http://www.w3.org/1999/xlink"
42-
data-testid={`icon-${testId}`}
42+
data-testid={testId}
4343
>
4444
{children}
4545
</svg>

‎packages/layout/src/components/__tests__/buttons.spec.tsx‎

Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
import React from 'react';
2+
import '@testing-library/jest-dom/extend-expect';
3+
import { render } from '@testing-library/react';
4+
import { ArrowButton } from '../buttons/buttons';
5+
import { ArrowLink } from '../buttons/links';
6+
7+
describe('Buttons', () => {
8+
test('ArrowButton arrow is on the left side', () => {
9+
const testId = 'arrow-button';
10+
const { getByTestId } = render(
11+
<ArrowButton title="Confirm" testId={testId} />,
12+
);
13+
const element = getByTestId(testId);
14+
expect(element.firstChild.lastChild.textContent).toEqual('Confirm');
15+
});
16+
17+
test('ArrowButton arrow is on the right side', () => {
18+
const testId = 'arrow-button';
19+
const { getByTestId } = render(
20+
<ArrowButton title="Confirm" iconSide="right" testId={testId} />,
21+
);
22+
const element = getByTestId(testId);
23+
expect(element.firstChild.firstChild.textContent).toEqual('Confirm');
24+
});
25+
});
26+
27+
describe('Links', () => {
28+
test('ArrowLink arrow is on the left side', () => {
29+
const testId = 'arrow-button';
30+
const { getByTestId } = render(
31+
<ArrowLink title="Confirm" onClick={() => {}} testId={testId} />,
32+
);
33+
const element = getByTestId(testId);
34+
expect(element.firstChild.lastChild.textContent).toEqual('Confirm');
35+
});
36+
37+
test('ArrowLink arrow is on the right side', () => {
38+
const testId = 'arrow-button';
39+
const { getByTestId } = render(
40+
<ArrowLink
41+
title="Confirm"
42+
onClick={() => {}}
43+
iconSide="right"
44+
testId={testId}
45+
/>,
46+
);
47+
const element = getByTestId(testId);
48+
expect(element.firstChild.firstChild.textContent).toEqual('Confirm');
49+
});
50+
});

‎packages/layout/src/components/__tests__/trustee.spec.tsx‎

Lines changed: 135 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,135 @@
1+
import React from 'react';
2+
import '@testing-library/jest-dom/extend-expect';
3+
import { render } from '@testing-library/react';
4+
import { Trustee } from '../cards/trustee/trustee';
5+
6+
// TODO
7+
8+
// test state transitions
9+
// test each form
10+
// test search functionality
11+
// test checkbox state toggles
12+
13+
const trustee = {
14+
schemeRoleId: '12345',
15+
//
16+
title: 'Mr',
17+
forename: 'John',
18+
surname: 'Smith',
19+
trusteeType: 'member-nominated',
20+
isProfessionalTrustee: false,
21+
//
22+
addressLine1: 'The Pensions Regulator',
23+
addressLine2: 'Napier House',
24+
addressLine3: 'Trafalgar Pl',
25+
postTown: 'Brighton',
26+
postcode: 'BN1 4DW',
27+
county: 'West Sussex',
28+
countryId: '',
29+
//
30+
telephoneNumber: '01273 000 111',
31+
emailAddress: 'fred.sandoors@trp.gov.uk',
32+
};
33+
34+
describe('Trustee Preview', () => {
35+
test('buttons renders correctly', () => {
36+
const callbackFn = () => Promise.resolve();
37+
const { getByText } = render(
38+
<Trustee
39+
onDetailsSave={callbackFn}
40+
onContactSave={callbackFn}
41+
onAddressSave={callbackFn}
42+
onRemove={callbackFn}
43+
onCorrect={(_value) => {}}
44+
addressAPI={{
45+
get: (_endpont) => Promise.resolve(),
46+
limit: 100,
47+
}}
48+
complete={true}
49+
trustee={trustee}
50+
testId={trustee.schemeRoleId}
51+
/>,
52+
);
53+
54+
// Buttons are visible
55+
56+
expect(getByText('Trustee')).toBeDefined();
57+
expect(getByText('Correspondence address')).toBeDefined();
58+
expect(getByText('Contact details')).toBeDefined();
59+
expect(getByText('Remove')).toBeDefined();
60+
});
61+
62+
test('initial status is correct', () => {
63+
const callbackFn = () => Promise.resolve();
64+
const { getByText } = render(
65+
<Trustee
66+
onDetailsSave={callbackFn}
67+
onContactSave={callbackFn}
68+
onAddressSave={callbackFn}
69+
onRemove={callbackFn}
70+
onCorrect={(_value) => {}}
71+
addressAPI={{
72+
get: (_endpont) => Promise.resolve(),
73+
limit: 100,
74+
}}
75+
complete={true}
76+
trustee={trustee}
77+
testId={trustee.schemeRoleId}
78+
/>,
79+
);
80+
81+
expect(getByText('No issues')).toBeDefined();
82+
expect(getByText('All details are correct.')).toBeDefined();
83+
});
84+
85+
test('address shows up correctly', () => {
86+
const callbackFn = () => Promise.resolve();
87+
const { getByText } = render(
88+
<Trustee
89+
onDetailsSave={callbackFn}
90+
onContactSave={callbackFn}
91+
onAddressSave={callbackFn}
92+
onRemove={callbackFn}
93+
onCorrect={(_value) => {}}
94+
addressAPI={{
95+
get: (_endpont) => Promise.resolve(),
96+
limit: 100,
97+
}}
98+
complete={true}
99+
trustee={trustee}
100+
testId={trustee.schemeRoleId}
101+
/>,
102+
);
103+
104+
expect(getByText(/The Pensions Regulator/gi)).toBeDefined();
105+
expect(getByText(/Napier House/gi)).toBeDefined();
106+
expect(getByText(/Trafalgar Pl/gi)).toBeDefined();
107+
expect(getByText(/Brighton/gi)).toBeDefined();
108+
expect(getByText(/BN1 4DW/gi)).toBeDefined();
109+
});
110+
111+
test('contact details shows up correctly', () => {
112+
const callbackFn = () => Promise.resolve();
113+
const { getByText } = render(
114+
<Trustee
115+
onDetailsSave={callbackFn}
116+
onContactSave={callbackFn}
117+
onAddressSave={callbackFn}
118+
onRemove={callbackFn}
119+
onCorrect={(_value) => {}}
120+
addressAPI={{
121+
get: (_endpont) => Promise.resolve(),
122+
limit: 100,
123+
}}
124+
complete={true}
125+
trustee={trustee}
126+
testId={trustee.schemeRoleId}
127+
/>,
128+
);
129+
130+
expect(getByText('Phone')).toBeDefined();
131+
expect(getByText('01273 000 111')).toBeDefined();
132+
expect(getByText('Email')).toBeDefined();
133+
expect(getByText('fred.sandoors@trp.gov.uk')).toBeDefined();
134+
});
135+
});

‎packages/layout/src/components/cards/trustee/context.tsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,6 @@ export const TrusteeContext = createContext<TrusteeContextProps>({
2323

2424
type RenderProps = (_: TrusteeContextProps) => ReactElement;
2525
export interface TrusteeInput {
26-
id: string;
2726
schemeRoleId: string;
2827
//
2928
title: string;

‎packages/layout/src/components/cards/trustee/trusteeMachine.ts‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -64,7 +64,6 @@ type TrusteeAddress = Partial<{
6464
}>;
6565

6666
export type TrusteeProps = {
67-
id: string;
6867
schemeRoleId: string;
6968
//
7069
title: string;
@@ -97,7 +96,6 @@ const trusteeMachine = Machine<TrusteeContext, TrusteeStates, TrusteeEvents>({
9796
loading: false,
9897
complete: false,
9998
trustee: {
100-
id: '',
10199
schemeRoleId: '',
102100
//
103101
title: '',

‎packages/theming/src/richTextEditor.module.scss‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -46,6 +46,14 @@
4646
del {
4747
text-decoration: line-through;
4848
}
49+
a {
50+
display: inline-block;
51+
color: $colors-primary-3;
52+
font-family: $fonts-sans-serif;
53+
font-weight: $font-weight-1;
54+
font-size: $font-size-2;
55+
cursor: pointer;
56+
}
4957
// ul {
5058
// }
5159
// ol {

0 commit comments

Comments
 (0)