Skip to content

Commit 120c175

Browse files
setchysetchy
committed
test: refactor to use user event
Signed-off-by: Adam Setch <[email protected]>
1 parent ac6e765 commit 120c175

File tree

10 files changed

+120
-83
lines changed

10 files changed

+120
-83
lines changed

‎src/renderer/components/Sidebar.test.tsx‎

Lines changed: 26 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
1-
import { fireEvent, render, screen } from '@testing-library/react';
1+
import { render, screen } from '@testing-library/react';
2+
import userEvent from '@testing-library/user-event';
23
import { MemoryRouter } from 'react-router-dom';
4+
35
import { mockAccountNotifications } from '../__mocks__/notifications-mocks';
46
import { mockAuth, mockSettings } from '../__mocks__/state-mocks';
57
import { AppContext } from '../context/App';
@@ -59,7 +61,7 @@ describe('renderer/components/Sidebar.tsx', () => {
5961
expect(tree).toMatchSnapshot();
6062
});
6163

62-
it('should navigate home when clicking the gitify logo', () => {
64+
it('should navigate home when clicking the gitify logo', async () => {
6365
render(
6466
<AppContext.Provider
6567
value={{
@@ -75,12 +77,13 @@ describe('renderer/components/Sidebar.tsx', () => {
7577
</AppContext.Provider>,
7678
);
7779

78-
fireEvent.click(screen.getByTestId('sidebar-home'));
80+
await userEvent.click(screen.getByTestId('sidebar-home'));
81+
7982
expect(mockNavigate).toHaveBeenNthCalledWith(1, '/', { replace: true });
8083
});
8184

8285
describe('notifications icon', () => {
83-
it('opens notifications home when clicked', () => {
86+
it('opens notifications home when clicked', async () => {
8487
render(
8588
<AppContext.Provider
8689
value={{
@@ -96,7 +99,7 @@ describe('renderer/components/Sidebar.tsx', () => {
9699
</AppContext.Provider>,
97100
);
98101

99-
fireEvent.click(screen.getByTestId('sidebar-notifications'));
102+
await userEvent.click(screen.getByTestId('sidebar-notifications'));
100103

101104
expect(openExternalLinkMock).toHaveBeenCalledTimes(1);
102105
expect(openExternalLinkMock).toHaveBeenCalledWith(
@@ -144,7 +147,7 @@ describe('renderer/components/Sidebar.tsx', () => {
144147
});
145148

146149
describe('Filter notifications', () => {
147-
it('go to the filters route', () => {
150+
it('go to the filters route', async () => {
148151
render(
149152
<AppContext.Provider
150153
value={{
@@ -160,12 +163,12 @@ describe('renderer/components/Sidebar.tsx', () => {
160163
</AppContext.Provider>,
161164
);
162165

163-
fireEvent.click(screen.getByTestId('sidebar-filter-notifications'));
166+
await userEvent.click(screen.getByTestId('sidebar-filter-notifications'));
164167

165168
expect(mockNavigate).toHaveBeenNthCalledWith(1, '/filters');
166169
});
167170

168-
it('go to the home if filters path already shown', () => {
171+
it('go to the home if filters path already shown', async () => {
169172
render(
170173
<AppContext.Provider
171174
value={{
@@ -181,14 +184,14 @@ describe('renderer/components/Sidebar.tsx', () => {
181184
</AppContext.Provider>,
182185
);
183186

184-
fireEvent.click(screen.getByTestId('sidebar-filter-notifications'));
187+
await userEvent.click(screen.getByTestId('sidebar-filter-notifications'));
185188

186189
expect(mockNavigate).toHaveBeenNthCalledWith(1, '/', { replace: true });
187190
});
188191
});
189192

190193
describe('quick links', () => {
191-
it('opens my github issues page', () => {
194+
it('opens my github issues page', async () => {
192195
render(
193196
<AppContext.Provider
194197
value={{
@@ -204,15 +207,15 @@ describe('renderer/components/Sidebar.tsx', () => {
204207
</AppContext.Provider>,
205208
);
206209

207-
fireEvent.click(screen.getByTestId('sidebar-my-issues'));
210+
await userEvent.click(screen.getByTestId('sidebar-my-issues'));
208211

209212
expect(openExternalLinkMock).toHaveBeenCalledTimes(1);
210213
expect(openExternalLinkMock).toHaveBeenCalledWith(
211214
'https://github.com/issues',
212215
);
213216
});
214217

215-
it('opens my github pull requests page', () => {
218+
it('opens my github pull requests page', async () => {
216219
render(
217220
<AppContext.Provider
218221
value={{
@@ -228,7 +231,7 @@ describe('renderer/components/Sidebar.tsx', () => {
228231
</AppContext.Provider>,
229232
);
230233

231-
fireEvent.click(screen.getByTestId('sidebar-my-pull-requests'));
234+
await userEvent.click(screen.getByTestId('sidebar-my-pull-requests'));
232235

233236
expect(openExternalLinkMock).toHaveBeenCalledTimes(1);
234237
expect(openExternalLinkMock).toHaveBeenCalledWith(
@@ -238,7 +241,7 @@ describe('renderer/components/Sidebar.tsx', () => {
238241
});
239242

240243
describe('Refresh Notifications', () => {
241-
it('should refresh the notifications when status is not loading', () => {
244+
it('should refresh the notifications when status is not loading', async () => {
242245
render(
243246
<AppContext.Provider
244247
value={{
@@ -256,12 +259,12 @@ describe('renderer/components/Sidebar.tsx', () => {
256259
</AppContext.Provider>,
257260
);
258261

259-
fireEvent.click(screen.getByTestId('sidebar-refresh'));
262+
await userEvent.click(screen.getByTestId('sidebar-refresh'));
260263

261264
expect(fetchNotifications).toHaveBeenCalledTimes(1);
262265
});
263266

264-
it('should not refresh the notifications when status is loading', () => {
267+
it('should not refresh the notifications when status is loading', async () => {
265268
render(
266269
<AppContext.Provider
267270
value={{
@@ -279,14 +282,14 @@ describe('renderer/components/Sidebar.tsx', () => {
279282
</AppContext.Provider>,
280283
);
281284

282-
fireEvent.click(screen.getByTestId('sidebar-refresh'));
285+
await userEvent.click(screen.getByTestId('sidebar-refresh'));
283286

284287
expect(fetchNotifications).not.toHaveBeenCalled();
285288
});
286289
});
287290

288291
describe('Settings', () => {
289-
it('go to the settings route', () => {
292+
it('go to the settings route', async () => {
290293
render(
291294
<AppContext.Provider
292295
value={{
@@ -302,12 +305,12 @@ describe('renderer/components/Sidebar.tsx', () => {
302305
</AppContext.Provider>,
303306
);
304307

305-
fireEvent.click(screen.getByTestId('sidebar-settings'));
308+
await userEvent.click(screen.getByTestId('sidebar-settings'));
306309

307310
expect(mockNavigate).toHaveBeenNthCalledWith(1, '/settings');
308311
});
309312

310-
it('go to the home if settings path already shown', () => {
313+
it('go to the home if settings path already shown', async () => {
311314
render(
312315
<AppContext.Provider
313316
value={{
@@ -324,14 +327,14 @@ describe('renderer/components/Sidebar.tsx', () => {
324327
</AppContext.Provider>,
325328
);
326329

327-
fireEvent.click(screen.getByTestId('sidebar-settings'));
330+
await userEvent.click(screen.getByTestId('sidebar-settings'));
328331

329332
expect(fetchNotifications).toHaveBeenCalledTimes(1);
330333
expect(mockNavigate).toHaveBeenNthCalledWith(1, '/', { replace: true });
331334
});
332335
});
333336

334-
it('should quit the app', () => {
337+
it('should quit the app', async () => {
335338
const quitAppMock = jest.spyOn(comms, 'quitApp');
336339

337340
render(
@@ -349,7 +352,7 @@ describe('renderer/components/Sidebar.tsx', () => {
349352
</AppContext.Provider>,
350353
);
351354

352-
fireEvent.click(screen.getByTestId('sidebar-quit'));
355+
await userEvent.click(screen.getByTestId('sidebar-quit'));
353356

354357
expect(quitAppMock).toHaveBeenCalledTimes(1);
355358
});

‎src/renderer/components/fields/Tooltip.test.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import { fireEvent, render, screen } from '@testing-library/react';
2+
23
import { type ITooltip, Tooltip } from './Tooltip';
34

45
describe('renderer/components/fields/Tooltip.tsx', () => {

‎src/renderer/components/filters/FilterSection.test.tsx‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,8 @@
11
import { MarkGithubIcon } from '@primer/octicons-react';
2-
import { act, fireEvent, render, screen } from '@testing-library/react';
2+
import { act, render, screen } from '@testing-library/react';
3+
import userEvent from '@testing-library/user-event';
34
import { MemoryRouter } from 'react-router-dom';
5+
46
import { mockAccountNotifications } from '../../__mocks__/notifications-mocks';
57
import { mockSettings } from '../../__mocks__/state-mocks';
68
import { AppContext } from '../../context/App';
@@ -98,7 +100,7 @@ describe('renderer/components/filters/FilterSection.tsx', () => {
98100
);
99101
});
100102

101-
fireEvent.click(screen.getByLabelText('Open'));
103+
await userEvent.click(screen.getByLabelText('Open'));
102104

103105
expect(updateFilter).toHaveBeenCalledWith(mockFilterSetting, 'open', true);
104106

@@ -133,7 +135,7 @@ describe('renderer/components/filters/FilterSection.tsx', () => {
133135
);
134136
});
135137

136-
fireEvent.click(screen.getByLabelText('Closed'));
138+
await userEvent.click(screen.getByLabelText('Closed'));
137139

138140
expect(updateFilter).toHaveBeenCalledWith(
139141
mockFilterSetting,

‎src/renderer/components/filters/UserHandleFilter.test.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import { act, fireEvent, render, screen } from '@testing-library/react';
22
import { MemoryRouter } from 'react-router-dom';
3+
34
import { mockAccountNotifications } from '../../__mocks__/notifications-mocks';
45
import { mockSettings } from '../../__mocks__/state-mocks';
56
import { AppContext } from '../../context/App';

‎src/renderer/components/icons/LogoIcon.test.tsx‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,6 @@
1-
import { fireEvent, render, screen } from '@testing-library/react';
1+
import { render, screen } from '@testing-library/react';
2+
import userEvent from '@testing-library/user-event';
3+
24
import { Size } from '../../types';
35
import { LogoIcon } from './LogoIcon';
46

@@ -15,11 +17,11 @@ describe('renderer/components/icons/LogoIcon.tsx', () => {
1517
expect(tree).toMatchSnapshot();
1618
});
1719

18-
it('should click on the logo', () => {
20+
it('should click on the logo', async () => {
1921
const onClick = jest.fn();
2022
render(<LogoIcon onClick={onClick} size={Size.SMALL} />);
2123

22-
fireEvent.click(screen.getByLabelText('Gitify Logo'));
24+
await userEvent.click(screen.getByLabelText('Gitify Logo'));
2325

2426
expect(onClick).toHaveBeenCalledTimes(1);
2527
});

‎src/renderer/components/notifications/AccountNotifications.test.tsx‎

Lines changed: 31 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,6 @@
1-
import { act, fireEvent, render, screen } from '@testing-library/react';
1+
import { render, screen } from '@testing-library/react';
2+
import userEvent from '@testing-library/user-event';
3+
24
import {
35
mockGitHubCloudAccount,
46
mockSettings,
@@ -34,6 +36,7 @@ describe('renderer/components/notifications/AccountNotifications.tsx', () => {
3436
<AccountNotifications {...props} />
3537
</AppContext.Provider>,
3638
);
39+
3740
expect(tree).toMatchSnapshot();
3841
});
3942

@@ -52,6 +55,7 @@ describe('renderer/components/notifications/AccountNotifications.tsx', () => {
5255
<AccountNotifications {...props} />
5356
</AppContext.Provider>,
5457
);
58+
5559
expect(tree).toMatchSnapshot();
5660
});
5761

@@ -68,6 +72,7 @@ describe('renderer/components/notifications/AccountNotifications.tsx', () => {
6872
<AccountNotifications {...props} />
6973
</AppContext.Provider>,
7074
);
75+
7176
expect(tree).toMatchSnapshot();
7277
});
7378

@@ -88,6 +93,7 @@ describe('renderer/components/notifications/AccountNotifications.tsx', () => {
8893
<AccountNotifications {...props} />
8994
</AppContext.Provider>,
9095
);
96+
9197
expect(tree).toMatchSnapshot();
9298
});
9399

@@ -103,15 +109,13 @@ describe('renderer/components/notifications/AccountNotifications.tsx', () => {
103109
error: null,
104110
};
105111

106-
await act(async () => {
107-
render(
108-
<AppContext.Provider value={{ settings: mockSettings }}>
109-
<AccountNotifications {...props} />
110-
</AppContext.Provider>,
111-
);
112-
});
112+
render(
113+
<AppContext.Provider value={{ settings: mockSettings }}>
114+
<AccountNotifications {...props} />
115+
</AppContext.Provider>,
116+
);
113117

114-
fireEvent.click(screen.getByTestId('account-profile'));
118+
await userEvent.click(screen.getByTestId('account-profile'));
115119

116120
expect(openAccountProfileMock).toHaveBeenCalledTimes(1);
117121
expect(openAccountProfileMock).toHaveBeenCalledWith(mockGitHubCloudAccount);
@@ -129,15 +133,13 @@ describe('renderer/components/notifications/AccountNotifications.tsx', () => {
129133
error: null,
130134
};
131135

132-
await act(async () => {
133-
render(
134-
<AppContext.Provider value={{ settings: mockSettings }}>
135-
<AccountNotifications {...props} />
136-
</AppContext.Provider>,
137-
);
138-
});
136+
render(
137+
<AppContext.Provider value={{ settings: mockSettings }}>
138+
<AccountNotifications {...props} />
139+
</AppContext.Provider>,
140+
);
139141

140-
fireEvent.click(screen.getByTestId('account-issues'));
142+
await userEvent.click(screen.getByTestId('account-issues'));
141143

142144
expect(openMyIssuesMock).toHaveBeenCalledTimes(1);
143145
expect(openMyIssuesMock).toHaveBeenCalledWith(
@@ -157,15 +159,13 @@ describe('renderer/components/notifications/AccountNotifications.tsx', () => {
157159
error: null,
158160
};
159161

160-
await act(async () => {
161-
render(
162-
<AppContext.Provider value={{ settings: mockSettings }}>
163-
<AccountNotifications {...props} />
164-
</AppContext.Provider>,
165-
);
166-
});
162+
render(
163+
<AppContext.Provider value={{ settings: mockSettings }}>
164+
<AccountNotifications {...props} />
165+
</AppContext.Provider>,
166+
);
167167

168-
fireEvent.click(screen.getByTestId('account-pull-requests'));
168+
await userEvent.click(screen.getByTestId('account-pull-requests'));
169169

170170
expect(openPullRequestsMock).toHaveBeenCalledTimes(1);
171171
expect(openPullRequestsMock).toHaveBeenCalledWith(
@@ -181,15 +181,13 @@ describe('renderer/components/notifications/AccountNotifications.tsx', () => {
181181
error: null,
182182
};
183183

184-
await act(async () => {
185-
render(
186-
<AppContext.Provider value={{ settings: mockSettings }}>
187-
<AccountNotifications {...props} />
188-
</AppContext.Provider>,
189-
);
190-
});
184+
render(
185+
<AppContext.Provider value={{ settings: mockSettings }}>
186+
<AccountNotifications {...props} />
187+
</AppContext.Provider>,
188+
);
191189

192-
fireEvent.click(screen.getByTestId('account-toggle'));
190+
await userEvent.click(screen.getByTestId('account-toggle'));
193191

194192
const tree = render(
195193
<AppContext.Provider value={{ settings: mockSettings }}>

0 commit comments

Comments
 (0)