Skip to content

Commit 933602a

Browse files
harrim91harrim91
committed
CCM-11496: PR feedback
1 parent 23382a6 commit 933602a

File tree

3 files changed

+190
-15
lines changed

3 files changed

+190
-15
lines changed

‎frontend/src/__tests__/components/molecules/ContentRenderer.test.tsx‎

Lines changed: 53 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,8 @@ describe('ContentRenderer', () => {
1515
});
1616

1717
it('renders a plain string as MarkdownContent in inline mode', () => {
18-
render(<ContentRenderer content='Just a string block' />);
18+
const container = render(<ContentRenderer content='Just a string block' />);
19+
expect(container.asFragment()).toMatchSnapshot();
1920
expect(screen.getByText('Just a string block')).toBeInTheDocument();
2021
});
2122

@@ -46,7 +47,9 @@ describe('ContentRenderer', () => {
4647
{ type: 'text', text: 'Another paragraph.' },
4748
];
4849

49-
render(<ContentRenderer content={content} />);
50+
const container = render(<ContentRenderer content={content} />);
51+
52+
expect(container.asFragment()).toMatchSnapshot();
5053

5154
const listItems = screen.getAllByRole('paragraph');
5255
expect(listItems).toHaveLength(2);
@@ -59,14 +62,16 @@ describe('ContentRenderer', () => {
5962
{ type: 'inline-text', text: 'Inline content' },
6063
];
6164

62-
render(
65+
const container = render(
6366
<ul>
6467
<li data-testid='list-item'>
6568
<ContentRenderer content={content} />
6669
</li>
6770
</ul>
6871
);
6972

73+
expect(container.asFragment()).toMatchSnapshot();
74+
7075
const listItem = screen.getByTestId('list-item');
7176
expect(listItem).toHaveTextContent('Inline content');
7277
expect(listItem.querySelector('p')).toBeNull();
@@ -75,14 +80,16 @@ describe('ContentRenderer', () => {
7580
it('treats a string as inline text (no paragraph wrapper)', () => {
7681
const content: string = 'Inline via string';
7782

78-
render(
83+
const container = render(
7984
<ul>
8085
<li data-testid='list-item'>
8186
<ContentRenderer content={content} />
8287
</li>
8388
</ul>
8489
);
8590

91+
expect(container.asFragment()).toMatchSnapshot();
92+
8693
const listItem = screen.getByTestId('list-item');
8794
expect(listItem).toHaveTextContent('Inline via string');
8895
expect(listItem.querySelector('p')).toBeNull();
@@ -91,14 +98,16 @@ describe('ContentRenderer', () => {
9198
it('treats a string array as inline text (no paragraph wrapper)', () => {
9299
const content: ContentItem[] = ['Inline via string'];
93100

94-
render(
101+
const container = render(
95102
<ul>
96103
<li data-testid='list-item'>
97104
<ContentRenderer content={content} />
98105
</li>
99106
</ul>
100107
);
101108

109+
expect(container.asFragment()).toMatchSnapshot();
110+
102111
const listItem = screen.getByTestId('list-item');
103112
expect(listItem).toHaveTextContent('Inline via string');
104113
expect(listItem.querySelector('p')).toBeNull();
@@ -116,7 +125,9 @@ describe('ContentRenderer', () => {
116125
},
117126
];
118127

119-
render(<ContentRenderer content={content} />);
128+
const container = render(<ContentRenderer content={content} />);
129+
130+
expect(container.asFragment()).toMatchSnapshot();
120131

121132
const hiddenText = screen.getByText('An example of heading markdown');
122133
expect(hiddenText).toHaveAttribute('id', 'heading-markdown-description');
@@ -128,17 +139,41 @@ describe('ContentRenderer', () => {
128139
);
129140
});
130141

131-
it('renders list blocks', () => {
142+
it('renders unordered list blocks', () => {
132143
const content: ContentBlock[] = [
133144
{
134145
type: 'text',
135146
text: markdownList('ul', ['Item 1', 'Item 2', 'Item 3']),
136147
},
137148
];
138149

139-
render(<ContentRenderer content={content} />);
150+
const container = render(<ContentRenderer content={content} />);
151+
152+
expect(container.asFragment()).toMatchSnapshot();
153+
154+
const listItems = screen.getAllByRole('listitem');
155+
expect(listItems).toHaveLength(3);
156+
expect(listItems[0]?.parentElement?.tagName).toBe('UL');
157+
expect(listItems[0]).toHaveTextContent('Item 1');
158+
expect(listItems[1]).toHaveTextContent('Item 2');
159+
expect(listItems[2]).toHaveTextContent('Item 3');
160+
});
161+
162+
it('renders ordered list blocks', () => {
163+
const content: ContentBlock[] = [
164+
{
165+
type: 'text',
166+
text: markdownList('ol', ['Item 1', 'Item 2', 'Item 3']),
167+
},
168+
];
169+
170+
const container = render(<ContentRenderer content={content} />);
171+
172+
expect(container.asFragment()).toMatchSnapshot();
173+
140174
const listItems = screen.getAllByRole('listitem');
141175
expect(listItems).toHaveLength(3);
176+
expect(listItems[0]?.parentElement?.tagName).toBe('OL');
142177
expect(listItems[0]).toHaveTextContent('Item 1');
143178
expect(listItems[1]).toHaveTextContent('Item 2');
144179
expect(listItems[2]).toHaveTextContent('Item 3');
@@ -158,12 +193,14 @@ describe('ContentRenderer', () => {
158193
},
159194
];
160195

161-
render(<ContentRenderer content={content} />);
196+
const container = render(<ContentRenderer content={content} />);
162197

163-
const listItems = screen.getAllByRole('paragraph');
164-
expect(listItems).toHaveLength(2);
165-
expect(listItems[0]).toHaveClass('foo');
166-
expect(listItems[1]).toHaveClass('bar');
198+
expect(container.asFragment()).toMatchSnapshot();
199+
200+
const paragraphs = screen.getAllByRole('paragraph');
201+
expect(paragraphs).toHaveLength(2);
202+
expect(paragraphs[0]).toHaveClass('foo');
203+
expect(paragraphs[1]).toHaveClass('bar');
167204
});
168205

169206
it('renders with overrides on inline-text blocks', () => {
@@ -175,7 +212,9 @@ describe('ContentRenderer', () => {
175212
},
176213
];
177214

178-
render(<ContentRenderer content={content} />);
215+
const container = render(<ContentRenderer content={content} />);
216+
217+
expect(container.asFragment()).toMatchSnapshot();
179218

180219
const link = screen.getByRole('link');
181220
expect(link).toHaveClass('foo');

‎frontend/src/__tests__/components/molecules/__snapshots__/ContentRenderer.test.tsx.snap‎

Lines changed: 136 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,136 @@
1+
// Jest Snapshot v1, https://goo.gl/fbAQLP
2+
3+
exports[`ContentRenderer renders a plain string as MarkdownContent in inline mode 1`] = `
4+
<DocumentFragment>
5+
Just a string block
6+
</DocumentFragment>
7+
`;
8+
9+
exports[`ContentRenderer renders an inline-text block without a paragraph wrapper 1`] = `
10+
<DocumentFragment>
11+
<ul>
12+
<li
13+
data-testid="list-item"
14+
>
15+
Inline content
16+
</li>
17+
</ul>
18+
</DocumentFragment>
19+
`;
20+
21+
exports[`ContentRenderer renders code blocks with accessible description 1`] = `
22+
<DocumentFragment>
23+
<span
24+
class="nhsuk-u-visually-hidden"
25+
id="heading-markdown-description"
26+
>
27+
An example of heading markdown
28+
</span>
29+
<pre
30+
class="nhsuk-code-block"
31+
>
32+
<code
33+
aria-describedby="heading-markdown-description"
34+
>
35+
# This is a heading
36+
</code>
37+
</pre>
38+
</DocumentFragment>
39+
`;
40+
41+
exports[`ContentRenderer renders ordered list blocks 1`] = `
42+
<DocumentFragment>
43+
<ol
44+
start="1"
45+
>
46+
<li>
47+
Item 1
48+
</li>
49+
<li>
50+
Item 2
51+
</li>
52+
<li>
53+
Item 3
54+
</li>
55+
</ol>
56+
</DocumentFragment>
57+
`;
58+
59+
exports[`ContentRenderer renders text blocks using MarkdownContent 1`] = `
60+
<DocumentFragment>
61+
<p>
62+
This is a paragraph.
63+
</p>
64+
<p>
65+
Another paragraph.
66+
</p>
67+
</DocumentFragment>
68+
`;
69+
70+
exports[`ContentRenderer renders unordered list blocks 1`] = `
71+
<DocumentFragment>
72+
<ul>
73+
<li>
74+
Item 1
75+
</li>
76+
<li>
77+
Item 2
78+
</li>
79+
<li>
80+
Item 3
81+
</li>
82+
</ul>
83+
</DocumentFragment>
84+
`;
85+
86+
exports[`ContentRenderer renders with overrides on inline-text blocks 1`] = `
87+
<DocumentFragment>
88+
This is a
89+
<a
90+
class="foo"
91+
href="https://example.com"
92+
>
93+
link
94+
</a>
95+
.
96+
</DocumentFragment>
97+
`;
98+
99+
exports[`ContentRenderer renders with overrides on text blocks 1`] = `
100+
<DocumentFragment>
101+
<p
102+
class="foo"
103+
>
104+
This is a paragraph.
105+
</p>
106+
<p
107+
class="bar"
108+
>
109+
Another paragraph.
110+
</p>
111+
</DocumentFragment>
112+
`;
113+
114+
exports[`ContentRenderer treats a string array as inline text (no paragraph wrapper) 1`] = `
115+
<DocumentFragment>
116+
<ul>
117+
<li
118+
data-testid="list-item"
119+
>
120+
Inline via string
121+
</li>
122+
</ul>
123+
</DocumentFragment>
124+
`;
125+
126+
exports[`ContentRenderer treats a string as inline text (no paragraph wrapper) 1`] = `
127+
<DocumentFragment>
128+
<ul>
129+
<li
130+
data-testid="list-item"
131+
>
132+
Inline via string
133+
</li>
134+
</ul>
135+
</DocumentFragment>
136+
`;

‎frontend/src/app/message-plans/move-to-production/[routingConfigId]/page.module.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
.table {
2-
background-color: #fff;
2+
background-color: var(--nhsuk-card-background-colour);
33
border: 1px solid var(--nhsuk-border-colour);
44

55
th {

0 commit comments

Comments
 (0)