Skip to content

Commit 777c050

Browse files
marie-dedikova-nhsmarie-dedikova-nhs
committed
TASK MD: Add missing tests for LoadingSpinner, improve tests in NBSBookingAction & increase coverage
1 parent 25a1d8f commit 777c050

File tree

3 files changed

+98
-47
lines changed

3 files changed

+98
-47
lines changed

‎src/app/_components/loader/LoadingSpinner.test.tsx‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
import { render, screen } from "@testing-library/react";
2+
3+
import LoadingSpinner from "./LoadingSpinner";
4+
5+
describe("LoadingSpinner", () => {
6+
it("renders the loader container", () => {
7+
render(<LoadingSpinner />);
8+
const container: HTMLElement = screen.getByTestId("loader-container");
9+
expect(container).toBeInTheDocument();
10+
});
11+
12+
it("renders the spinner SVG", () => {
13+
render(<LoadingSpinner />);
14+
const svg: HTMLElement = screen.getByTestId("loader-spinner");
15+
expect(svg).toBeInTheDocument();
16+
});
17+
18+
it("applies correct CSS classes", () => {
19+
render(<LoadingSpinner />);
20+
const container: HTMLElement = screen.getByTestId("loader-container");
21+
22+
expect(container.className).toContain("loaderContainer");
23+
expect(container.className).toContain("loaderContainerMiddle");
24+
});
25+
});

‎src/app/_components/loader/LoadingSpinner.tsx‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,9 +4,14 @@ import styles from "@src/app/_components/loader/styles.module.css";
44

55
const LoadingSpinner = () => {
66
return (
7-
<div className={`${styles.loaderContainer} ${styles.loaderContainerMiddle}`} id="loaderContainer">
7+
<div
8+
className={`${styles.loaderContainer} ${styles.loaderContainerMiddle}`}
9+
id="loaderContainer"
10+
data-testid="loader-container"
11+
>
812
<svg
913
className={styles.loaderSpinner}
14+
data-testid="loader-spinner"
1015
xmlns="http://www.w3.org/2000/svg"
1116
width="64"
1217
height="64"

‎src/app/_components/nbs/NBSBookingAction.test.tsx‎

Lines changed: 67 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,11 @@ describe("NBSBookingAction", () => {
1414
});
1515

1616
describe("Given vaccine type", () => {
17-
const renderAndClickNBSBookingActionForVaccine = (displayText: string, renderAs: "anchor" | "button") => {
17+
const renderAndClickNBSBookingAction = (
18+
displayText: string,
19+
renderAs: "anchor" | "button" | "actionLink",
20+
whichElement: number = 0,
21+
): HTMLElement => {
1822
render(
1923
<NBSBookingActionForVaccine
2024
vaccineType={VaccineType.RSV}
@@ -23,71 +27,82 @@ describe("NBSBookingAction", () => {
2327
reduceBottomPadding={false}
2428
/>,
2529
);
26-
let bookingAction: HTMLElement;
27-
if (renderAs === "anchor") {
28-
bookingAction = screen.getByRole("link", { name: displayText });
29-
} else {
30-
bookingAction = screen.getByRole("button", { name: displayText });
31-
}
32-
bookingAction.click();
30+
31+
const role: "button" | "link" = renderAs === "button" ? "button" : "link"; // "anchor" and "actionLink" are both links
32+
33+
const element: HTMLElement = screen.getAllByRole(role, { name: displayText })[whichElement];
34+
expect(element).toBeVisible();
35+
element.click();
36+
37+
return element;
3338
};
3439

35-
it("should open NBS SSO link in same window when action is clicked within NHS app", async () => {
40+
it("should open NBS SSO link in same window when action is clicked within NHS app", () => {
3641
(useBrowserContext as jest.Mock).mockReturnValue({
3742
hasContextLoaded: true,
3843
isOpenInMobileApp: true,
3944
});
4045

4146
// render as button
42-
renderAndClickNBSBookingActionForVaccine("test", "button");
47+
renderAndClickNBSBookingAction("test", "button");
4348
expect(window.open).toHaveBeenCalledWith("/api/sso-to-nbs?vaccine=rsv", "_self");
4449

45-
jest.clearAllMocks();
46-
4750
// render as anchor
48-
renderAndClickNBSBookingActionForVaccine("test", "anchor");
51+
renderAndClickNBSBookingAction("test", "anchor");
52+
expect(window.open).toHaveBeenCalledWith("/api/sso-to-nbs?vaccine=rsv", "_self");
53+
54+
// render as action link
55+
renderAndClickNBSBookingAction("test", "actionLink", 1);
4956
expect(window.open).toHaveBeenCalledWith("/api/sso-to-nbs?vaccine=rsv", "_self");
5057
});
5158

52-
it("should open NBS SSO link in new window when action is clicked outside NHS app", async () => {
59+
it("should open NBS SSO link in new window when action is clicked outside NHS app", () => {
5360
(useBrowserContext as jest.Mock).mockReturnValue({
5461
hasContextLoaded: true,
5562
isOpenInMobileApp: false,
5663
});
5764

5865
// render as button
59-
renderAndClickNBSBookingActionForVaccine("test", "button");
66+
renderAndClickNBSBookingAction("test", "button");
6067
expect(window.open).toHaveBeenCalledWith("/api/sso-to-nbs?vaccine=rsv", "_blank");
6168

62-
jest.clearAllMocks();
63-
6469
// render as anchor
65-
renderAndClickNBSBookingActionForVaccine("test", "anchor");
70+
renderAndClickNBSBookingAction("test", "anchor");
71+
expect(window.open).toHaveBeenCalledWith("/api/sso-to-nbs?vaccine=rsv", "_blank");
72+
73+
// render as action link
74+
renderAndClickNBSBookingAction("test", "actionLink", 1);
6675
expect(window.open).toHaveBeenCalledWith("/api/sso-to-nbs?vaccine=rsv", "_blank");
6776
});
6877

69-
it("given browser context has not loaded, should do nothing when action is clicked", async () => {
78+
it("given browser context has not loaded, should do nothing when action is clicked", () => {
7079
(useBrowserContext as jest.Mock).mockReturnValue({
7180
hasContextLoaded: false,
7281
isOpenInMobileApp: undefined,
7382
});
7483

7584
// render as button
76-
renderAndClickNBSBookingActionForVaccine("test", "button");
85+
renderAndClickNBSBookingAction("test", "button");
7786
expect(window.open).not.toHaveBeenCalled();
7887

79-
jest.clearAllMocks();
80-
8188
// render as anchor
82-
renderAndClickNBSBookingActionForVaccine("test", "anchor");
89+
renderAndClickNBSBookingAction("test", "anchor");
90+
expect(window.open).not.toHaveBeenCalled();
91+
92+
// render as action link
93+
renderAndClickNBSBookingAction("test", "actionLink", 1);
8394
expect(window.open).not.toHaveBeenCalled();
8495
});
8596
});
8697

8798
describe("Given base URL", () => {
8899
const url = randomURL();
89100

90-
const renderAndClickNBSBookingActionForBaseUrl = (displayText: string, renderAs: "anchor" | "button") => {
101+
const renderAndClickNBSBookingAction = (
102+
displayText: string,
103+
renderAs: "anchor" | "button" | "actionLink",
104+
whichElement: number = 0,
105+
): HTMLElement => {
91106
render(
92107
<NBSBookingActionForBaseUrl
93108
url={url.href}
@@ -96,63 +111,69 @@ describe("NBSBookingAction", () => {
96111
reduceBottomPadding={false}
97112
/>,
98113
);
99-
let bookingAction;
100-
if (renderAs === "anchor") {
101-
bookingAction = screen.getByRole("link", { name: displayText });
102-
} else {
103-
bookingAction = screen.getByRole("button", { name: displayText });
104-
}
105-
bookingAction.click();
114+
115+
const role: "button" | "link" = renderAs === "button" ? "button" : "link"; // "anchor" and "actionLink" are both links
116+
117+
const element: HTMLElement = screen.getAllByRole(role, { name: displayText })[whichElement];
118+
element.click();
119+
120+
return element;
106121
};
107122

108-
it("should open NBS SSO link in same window when action is clicked within NHS app", async () => {
123+
it("should open NBS SSO link in same window when action is clicked within NHS app", () => {
109124
(useBrowserContext as jest.Mock).mockReturnValue({
110125
hasContextLoaded: true,
111126
isOpenInMobileApp: true,
112127
});
113128

114129
// render as button
115-
renderAndClickNBSBookingActionForBaseUrl("test", "button");
130+
renderAndClickNBSBookingAction("test", "button");
116131
expect(window.open).toHaveBeenCalledWith(`/api/sso-to-nbs?redirectTarget=${url.href}`, "_self");
117132

118-
jest.clearAllMocks();
119-
120133
// render as anchor
121-
renderAndClickNBSBookingActionForBaseUrl("test", "anchor");
134+
renderAndClickNBSBookingAction("test", "anchor");
135+
expect(window.open).toHaveBeenCalledWith(`/api/sso-to-nbs?redirectTarget=${url.href}`, "_self");
136+
137+
// render as action link
138+
renderAndClickNBSBookingAction("test", "actionLink", 1);
122139
expect(window.open).toHaveBeenCalledWith(`/api/sso-to-nbs?redirectTarget=${url.href}`, "_self");
123140
});
124141

125-
it("should open NBS SSO link in new window when action is clicked outside NHS app", async () => {
142+
it("should open NBS SSO link in new window when action is clicked outside NHS app", () => {
126143
(useBrowserContext as jest.Mock).mockReturnValue({
127144
hasContextLoaded: true,
128145
isOpenInMobileApp: false,
129146
});
130147

131148
// render as button
132-
renderAndClickNBSBookingActionForBaseUrl("test", "button");
149+
renderAndClickNBSBookingAction("test", "button");
133150
expect(window.open).toHaveBeenCalledWith(`/api/sso-to-nbs?redirectTarget=${url.href}`, "_blank");
134151

135-
jest.clearAllMocks();
136-
137152
// render as anchor
138-
renderAndClickNBSBookingActionForBaseUrl("test", "anchor");
153+
renderAndClickNBSBookingAction("test", "anchor");
154+
expect(window.open).toHaveBeenCalledWith(`/api/sso-to-nbs?redirectTarget=${url.href}`, "_blank");
155+
156+
// render as action link
157+
renderAndClickNBSBookingAction("test", "actionLink", 1);
139158
expect(window.open).toHaveBeenCalledWith(`/api/sso-to-nbs?redirectTarget=${url.href}`, "_blank");
140159
});
141160

142-
it("given browser context has not loaded, should do nothing when action is clicked", async () => {
161+
it("given browser context has not loaded, should do nothing when action is clicked", () => {
143162
(useBrowserContext as jest.Mock).mockReturnValue({
144163
hasContextLoaded: false,
145164
isOpenInMobileApp: undefined,
146165
});
147166

148167
// render as button
149-
renderAndClickNBSBookingActionForBaseUrl("test", "button");
168+
renderAndClickNBSBookingAction("test", "button");
150169
expect(window.open).not.toHaveBeenCalled();
151170

152-
jest.clearAllMocks();
153-
154171
// render as anchor
155-
renderAndClickNBSBookingActionForBaseUrl("test", "anchor");
172+
renderAndClickNBSBookingAction("test", "anchor");
173+
expect(window.open).not.toHaveBeenCalled();
174+
175+
// render as action link
176+
renderAndClickNBSBookingAction("test", "actionLink", 1);
156177
expect(window.open).not.toHaveBeenCalled();
157178
});
158179
});

0 commit comments

Comments
 (0)