Skip to content

Commit fae0998

Browse files
authored
Clean up test suite console warnings (#2961)
* Wrap renders in act and waitFor to remove console warnings * Update test util helpers
1 parent 22ebbdb commit fae0998

File tree

22 files changed

+540
-190
lines changed

22 files changed

+540
-190
lines changed

src/commons/__tests__/ContentDisplay.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@ const mockProps: ContentDisplayProps = {
55
display: <div> Test Content </div>
66
};
77

8-
test('ContentDisplay page renders correctly', () => {
8+
test('ContentDisplay page renders correctly', async () => {
99
const app = <ContentDisplay {...mockProps} />;
10-
const tree = renderTreeJson(app);
10+
const tree = await renderTreeJson(app);
1111
expect(tree).toMatchSnapshot();
1212
});

src/commons/__tests__/Markdown.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,9 +12,9 @@ const mockProps = (sourceChapter: Chapter, sourceVariant: Variant) => {
1212
};
1313
};
1414

15-
test('Markdown page renders correctly', () => {
15+
test('Markdown page renders correctly', async () => {
1616
const app = <Markdown {...mockProps(Chapter.SOURCE_1, Variant.DEFAULT)} />;
17-
const tree = renderTreeJson(app);
17+
const tree = await renderTreeJson(app);
1818
expect(tree).toMatchSnapshot();
1919
});
2020

src/commons/assessment/__tests__/Assessment.tsx

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { render, screen } from '@testing-library/react';
1+
import { act, render, screen } from '@testing-library/react';
22
import { Provider } from 'react-redux';
33
import { MemoryRouter } from 'react-router';
44
import { Store } from 'redux';
@@ -47,25 +47,25 @@ const createTestComponent = (mockStore: Store<OverallState>) => (
4747
</Provider>
4848
);
4949

50-
test('Assessment page "loading" content renders correctly', () => {
50+
test('Assessment page "loading" content renders correctly', async () => {
5151
const mockStore = getOverriddenStore({});
5252
const app = createTestComponent(mockStore);
5353

54-
const tree = renderTreeJson(app);
54+
const tree = await renderTreeJson(app);
5555
expect(tree).toMatchSnapshot();
5656

5757
render(app);
5858
screen.getByText('Fetching assessment...');
5959
});
6060

61-
test('Assessment page with 0 missions renders correctly', () => {
61+
test('Assessment page with 0 missions renders correctly', async () => {
6262
const mockStore = getOverriddenStore({ assessmentOverviews: [] });
6363
const app = createTestComponent(mockStore);
6464

65-
const tree = renderTreeJson(app);
65+
const tree = await renderTreeJson(app);
6666
expect(tree).toMatchSnapshot();
6767

68-
render(app);
68+
await act(() => render(app));
6969
screen.getByText('There are no assessments.');
7070
});
7171

@@ -76,23 +76,23 @@ test('Assessment page with multiple loaded missions renders correctly', async ()
7676
});
7777
const app = createTestComponent(mockStore);
7878

79-
const tree = renderTreeJson(app);
79+
const tree = await renderTreeJson(app);
8080
expect(tree).toMatchSnapshot();
8181

82-
render(app);
82+
await act(() => render(app));
8383
expect(screen.getAllByTestId('Assessment-Attempt-Button').length).toBe(3);
8484
});
8585

86-
test('Assessment page does not show attempt Button for upcoming assessments for student user', () => {
86+
test('Assessment page does not show attempt Button for upcoming assessments for student user', async () => {
8787
const mockStore = getOverriddenStore({
8888
assessmentOverviews: mockAssessmentOverviews,
8989
role: Role.Student
9090
});
9191
const app = createTestComponent(mockStore);
9292

93-
const tree = renderTreeJson(app);
93+
const tree = await renderTreeJson(app);
9494
expect(tree).toMatchSnapshot();
9595

96-
render(app);
96+
await act(() => render(app));
9797
expect(screen.getAllByTestId('Assessment-Attempt-Button').length).toBe(2);
9898
});

src/commons/assessmentWorkspace/__tests__/AssessmentWorkspace.tsx

Lines changed: 14 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { render, screen } from '@testing-library/react';
1+
import { render, screen, waitFor } from '@testing-library/react';
22
import { require as acequire } from 'ace-builds';
33
import { Provider } from 'react-redux';
44
import { createMemoryRouter, RouterProvider } from 'react-router';
@@ -101,7 +101,7 @@ const createMemoryRouterWithRoutes = (props: AssessmentWorkspaceProps) => {
101101
};
102102

103103
const renderElement = (props: AssessmentWorkspaceProps) =>
104-
render(createMemoryRouterWithRoutes(props));
104+
waitFor(() => render(createMemoryRouterWithRoutes(props)));
105105

106106
const getEditor = () => screen.queryByTestId('Editor');
107107
const getMCQChooser = () => screen.queryByTestId('MCQChooser');
@@ -118,17 +118,17 @@ describe('AssessmentWorkspace', () => {
118118
});
119119
});
120120

121-
test('AssessmentWorkspace page "loading" content renders correctly', () => {
121+
test('AssessmentWorkspace page "loading" content renders correctly', async () => {
122122
const app = createMemoryRouterWithRoutes(mockUndefinedAssessmentWorkspaceProps);
123-
const tree = renderTreeJson(app);
123+
const tree = await renderTreeJson(app);
124124
expect(tree).toMatchSnapshot();
125125

126126
render(app);
127127
screen.getByText('Getting mission ready...');
128128
});
129129

130-
test('AssessmentWorkspace page with programming question renders correctly', () => {
131-
const { container } = renderElement(mockProgrammingAssessmentWorkspaceProps);
130+
test('AssessmentWorkspace page with programming question renders correctly', async () => {
131+
const { container } = await renderElement(mockProgrammingAssessmentWorkspaceProps);
132132

133133
expect(container).toMatchSnapshot();
134134
expect(getEditor()).toBeTruthy();
@@ -138,8 +138,8 @@ describe('AssessmentWorkspace', () => {
138138
expect(getContestVotingTab(container)).toBeNull();
139139
});
140140

141-
test('AssessmentWorkspace page with overdue assessment renders correctly', () => {
142-
const { container } = renderElement(mockClosedProgrammingAssessmentWorkspaceProps);
141+
test('AssessmentWorkspace page with overdue assessment renders correctly', async () => {
142+
const { container } = await renderElement(mockClosedProgrammingAssessmentWorkspaceProps);
143143

144144
expect(container).toMatchSnapshot();
145145
expect(getEditor()).toBeTruthy();
@@ -149,8 +149,8 @@ describe('AssessmentWorkspace', () => {
149149
expect(getContestVotingTab(container)).toBeNull();
150150
});
151151

152-
test('AssessmentWorkspace page with MCQ question renders correctly', () => {
153-
const { container } = renderElement(mockMcqAssessmentWorkspaceProps);
152+
test('AssessmentWorkspace page with MCQ question renders correctly', async () => {
153+
const { container } = await renderElement(mockMcqAssessmentWorkspaceProps);
154154

155155
expect(container).toMatchSnapshot();
156156
expect(getEditor()).toBeNull();
@@ -160,8 +160,8 @@ describe('AssessmentWorkspace', () => {
160160
expect(getContestVotingTab(container)).toBeNull();
161161
});
162162

163-
test('AssessmentWorkspace page with ContestVoting question renders correctly', () => {
164-
const { container } = renderElement(mockContestVotingAssessmentWorkspaceProps);
163+
test('AssessmentWorkspace page with ContestVoting question renders correctly', async () => {
164+
const { container } = await renderElement(mockContestVotingAssessmentWorkspaceProps);
165165

166166
expect(container).toMatchSnapshot();
167167
expect(getEditor()).toBeTruthy();
@@ -171,8 +171,8 @@ describe('AssessmentWorkspace', () => {
171171
expect(getContestVotingTab(container)).toBeTruthy();
172172
});
173173

174-
test('AssessmentWorkspace renders Grading tab correctly if the question has been graded', () => {
175-
const { container } = renderElement(mockGradedProgrammingAssessmentWorkspaceProps);
174+
test('AssessmentWorkspace renders Grading tab correctly if the question has been graded', async () => {
175+
const { container } = await renderElement(mockGradedProgrammingAssessmentWorkspaceProps);
176176

177177
expect(container).toMatchSnapshot();
178178
expect(getEditor()).toBeTruthy();

src/commons/assessmentWorkspace/__tests__/__snapshots__/AssessmentWorkspace.tsx.snap

Lines changed: 30 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1442,9 +1442,21 @@ exports[`AssessmentWorkspace AssessmentWorkspace page with MCQ question renders
14421442
>
14431443
<span
14441444
aria-hidden="true"
1445-
class="bp5-icon bp5-icon-standard bp5-icon-arrow-left"
1446-
data-icon="arrow-left"
1447-
/>
1445+
class="bp5-icon bp5-icon-arrow-left"
1446+
>
1447+
<svg
1448+
data-icon="arrow-left"
1449+
height="16"
1450+
role="img"
1451+
viewBox="0 0 16 16"
1452+
width="16"
1453+
>
1454+
<path
1455+
d="M13.99 6.99H4.41L7.7 3.7a1.003 1.003 0 00-1.42-1.42l-5 5a1.014 1.014 0 000 1.42l5 5a1.003 1.003 0 001.42-1.42L4.41 8.99H14c.55 0 1-.45 1-1s-.46-1-1.01-1z"
1456+
fill-rule="evenodd"
1457+
/>
1458+
</svg>
1459+
</span>
14481460
<span
14491461
class="bp5-button-text"
14501462
>
@@ -4157,9 +4169,21 @@ exports[`AssessmentWorkspace AssessmentWorkspace renders Grading tab correctly i
41574169
>
41584170
<span
41594171
aria-hidden="true"
4160-
class="bp5-icon bp5-icon-large bp5-icon-tick"
4161-
data-icon="tick"
4162-
/>
4172+
class="bp5-icon bp5-icon-tick"
4173+
>
4174+
<svg
4175+
data-icon="tick"
4176+
height="20"
4177+
role="img"
4178+
viewBox="0 0 20 20"
4179+
width="20"
4180+
>
4181+
<path
4182+
d="M17 4c-.28 0-.53.11-.71.29L7 13.59 3.71 10.3A.965.965 0 003 10a1.003 1.003 0 00-.71 1.71l4 4c.18.18.43.29.71.29s.53-.11.71-.29l10-10A1.003 1.003 0 0017 4z"
4183+
fill-rule="evenodd"
4184+
/>
4185+
</svg>
4186+
</span>
41634187
</div>
41644188
</span>
41654189
</div>

src/commons/dropdown/__tests__/Dropdown.tsx

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -39,34 +39,34 @@ const getElement = (mockStore: Store<OverallState>) => (
3939
</Provider>
4040
);
4141

42-
test('Dropdown does not mount Profile, DropdownCourses and DropdownCreateCourses components when a user is not logged in', () => {
42+
test('Dropdown does not mount Profile, DropdownCourses and DropdownCreateCourses components when a user is not logged in', async () => {
4343
const mockStore = getMockedStore({
4444
courses: [],
4545
courseId: 1
4646
});
4747
const app = getElement(mockStore);
48-
const tree = renderTreeJson(app);
48+
const tree = await renderTreeJson(app);
4949
expect(tree).toMatchSnapshot();
5050

5151
// Expect the Profile component to NOT be mounted
52-
const dropdown = renderTree(app);
52+
const dropdown = await renderTree(app);
5353
expect(dropdown.root.findAllByType(Profile).length).toBe(0);
5454
expect(dropdown.root.findAllByType(DropdownCourses).length).toBe(0);
5555
expect(dropdown.root.findAllByType(DropdownCreateCourse).length).toBe(0);
5656
});
5757

58-
test('Dropdown correctly mounts Profile, DropdownCourses, and DropdownCreateCourses components when a user is logged in', () => {
58+
test('Dropdown correctly mounts Profile, DropdownCourses, and DropdownCreateCourses components when a user is logged in', async () => {
5959
const mockStore = getMockedStore({
6060
name: 'Some user',
6161
courses: [],
6262
courseId: 1
6363
});
6464
const app = getElement(mockStore);
65-
const tree = renderTreeJson(app);
65+
const tree = await renderTreeJson(app);
6666
expect(tree).toMatchSnapshot();
6767

6868
// Expect the Profile component to be mounted
69-
const dropdown = renderTree(app);
69+
const dropdown = await renderTree(app);
7070
expect(dropdown.root.findByType(Profile)).toBeTruthy();
7171
expect(dropdown.root.findByType(DropdownCourses)).toBeTruthy();
7272
expect(dropdown.root.findByType(DropdownCreateCourse)).toBeTruthy();

src/commons/navigationBar/subcomponents/__tests__/NavigationBarLangSelectButton.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -28,9 +28,9 @@ describe('NavigationBarLangSelectButton', () => {
2828
user = userEvent.setup();
2929
});
3030

31-
it('should render correctly', () => {
31+
it('should render correctly', async () => {
3232
const { app } = createAppWithStore();
33-
const wrapper = renderTreeJson(app);
33+
const wrapper = await renderTreeJson(app);
3434
expect(wrapper).toMatchSnapshot();
3535
});
3636

src/commons/profile/__tests__/Profile.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { render, screen } from '@testing-library/react';
1+
import { act, render, screen } from '@testing-library/react';
22
import { Provider } from 'react-redux';
33
import { MemoryRouter } from 'react-router';
44
import { DeepPartial } from 'redux';
@@ -48,7 +48,7 @@ const createProfileWithStore = (storeOverrides?: DeepPartial<OverallState>) => {
4848
);
4949
};
5050

51-
test('Profile renders correctly when there are no closed assessments', () => {
51+
test('Profile renders correctly when there are no closed assessments', async () => {
5252
const profile = createProfileWithStore({
5353
session: {
5454
name: 'yeet',
@@ -58,7 +58,7 @@ test('Profile renders correctly when there are no closed assessments', () => {
5858
assessmentConfigurations
5959
}
6060
});
61-
render(profile);
61+
await act(() => render(profile));
6262

6363
// Expect the placeholder <div> to be rendered
6464
const placeholders = screen.getAllByTestId('profile-placeholder');
@@ -72,7 +72,7 @@ test('Profile renders correctly when there are no closed assessments', () => {
7272
expect(screen.queryAllByTestId('profile-callouts')).toHaveLength(0);
7373
});
7474

75-
test('Profile renders correctly when there are closed and graded, or closed and not manually graded assessments', () => {
75+
test('Profile renders correctly when there are closed and graded, or closed and not manually graded assessments', async () => {
7676
// Only closed and graded, and closed and not manually graded assessments will be rendered in the Profile
7777
const profile = createProfileWithStore({
7878
session: {
@@ -83,7 +83,7 @@ test('Profile renders correctly when there are closed and graded, or closed and
8383
assessmentConfigurations
8484
}
8585
});
86-
render(profile);
86+
await act(() => render(profile));
8787

8888
// Expect the placeholder <div> to NOT be rendered
8989
expect(screen.queryAllByTestId('profile-placeholder')).toHaveLength(0);

0 commit comments

Comments
 (0)