Skip to content

Commit c588977

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

File tree

9 files changed

+87
-93
lines changed

9 files changed

+87
-93
lines changed

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

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
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

34
import { type ITooltip, Tooltip } from './Tooltip';
45

@@ -13,15 +14,15 @@ describe('renderer/components/fields/Tooltip.tsx', () => {
1314
expect(tree).toMatchSnapshot();
1415
});
1516

16-
it('should display on mouse enter / leave', () => {
17+
it('should display on mouse enter / leave', async () => {
1718
render(<Tooltip {...props} />);
1819

1920
const tooltipElement = screen.getByTestId('tooltip-test');
2021

21-
fireEvent.mouseEnter(tooltipElement);
22+
await userEvent.hover(tooltipElement);
2223
expect(tooltipElement).toMatchSnapshot();
2324

24-
fireEvent.mouseLeave(tooltipElement);
25+
await userEvent.unhover(tooltipElement);
2526
expect(tooltipElement).toMatchSnapshot();
2627
});
2728
});

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

Lines changed: 18 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
1-
import { act, fireEvent, render, screen } from '@testing-library/react';
1+
import { act, render, screen } from '@testing-library/react';
2+
import userEvent from '@testing-library/user-event';
23
import { MemoryRouter } from 'react-router-dom';
34

45
import { mockAccountNotifications } from '../../__mocks__/notifications-mocks';
@@ -77,14 +78,10 @@ describe('renderer/components/filters/UserHandleFilter.tsx', () => {
7778
);
7879
});
7980

80-
fireEvent.change(screen.getByTitle('Include handles'), {
81-
target: { value: 'github-user' },
82-
});
83-
84-
fireEvent.keyDown(screen.getByTitle('Include handles'), {
85-
key: 'Enter',
86-
code: 'Enter',
87-
});
81+
await userEvent.type(
82+
screen.getByTitle('Include handles'),
83+
'github-user{enter}',
84+
);
8885

8986
expect(updateFilter).toHaveBeenCalledWith(
9087
'filterIncludeHandles',
@@ -113,14 +110,10 @@ describe('renderer/components/filters/UserHandleFilter.tsx', () => {
113110
);
114111
});
115112

116-
fireEvent.change(screen.getByTitle('Include handles'), {
117-
target: { value: 'github-user' },
118-
});
119-
120-
fireEvent.keyDown(screen.getByTitle('Include handles'), {
121-
key: 'Enter',
122-
code: 'Enter',
123-
});
113+
await userEvent.type(
114+
screen.getByTitle('Include handles'),
115+
'github-user{enter}',
116+
);
124117

125118
expect(updateFilter).toHaveBeenCalledTimes(0);
126119
});
@@ -147,14 +140,10 @@ describe('renderer/components/filters/UserHandleFilter.tsx', () => {
147140
);
148141
});
149142

150-
fireEvent.change(screen.getByTitle('Exclude handles'), {
151-
target: { value: 'github-user' },
152-
});
153-
154-
fireEvent.keyDown(screen.getByTitle('Exclude handles'), {
155-
key: 'Enter',
156-
code: 'Enter',
157-
});
143+
await userEvent.type(
144+
screen.getByTitle('Exclude handles'),
145+
'github-user{enter}',
146+
);
158147

159148
expect(updateFilter).toHaveBeenCalledWith(
160149
'filterExcludeHandles',
@@ -183,14 +172,10 @@ describe('renderer/components/filters/UserHandleFilter.tsx', () => {
183172
);
184173
});
185174

186-
fireEvent.change(screen.getByTitle('Exclude handles'), {
187-
target: { value: 'github-user' },
188-
});
189-
190-
fireEvent.keyDown(screen.getByTitle('Exclude handles'), {
191-
key: 'Enter',
192-
code: 'Enter',
193-
});
175+
await userEvent.type(
176+
screen.getByTitle('Exclude handles'),
177+
'github-user{enter}',
178+
);
194179

195180
expect(updateFilter).toHaveBeenCalledTimes(0);
196181
});

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

Lines changed: 12 additions & 8 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 { act, render, screen } from '@testing-library/react';
2+
import userEvent from '@testing-library/user-event';
3+
24
import {
35
mockGitHubCloudAccount,
46
mockSettings,
@@ -33,10 +35,11 @@ describe('renderer/components/notifications/RepositoryNotifications.tsx', () =>
3335
<RepositoryNotifications {...props} />
3436
</AppContext.Provider>,
3537
);
38+
3639
expect(tree).toMatchSnapshot();
3740
});
3841

39-
it('should open the browser when clicking on the repo name', () => {
42+
it('should open the browser when clicking on the repo name', async () => {
4043
const openExternalLinkMock = jest
4144
.spyOn(comms, 'openExternalLink')
4245
.mockImplementation();
@@ -47,15 +50,15 @@ describe('renderer/components/notifications/RepositoryNotifications.tsx', () =>
4750
</AppContext.Provider>,
4851
);
4952

50-
fireEvent.click(screen.getByTestId('open-repository'));
53+
await userEvent.click(screen.getByTestId('open-repository'));
5154

5255
expect(openExternalLinkMock).toHaveBeenCalledTimes(1);
5356
expect(openExternalLinkMock).toHaveBeenCalledWith(
5457
'https://github.com/gitify-app/notifications-test',
5558
);
5659
});
5760

58-
it('should mark a repo as read', () => {
61+
it('should mark a repo as read', async () => {
5962
render(
6063
<AppContext.Provider
6164
value={{ settings: { ...mockSettings }, markNotificationsAsRead }}
@@ -64,14 +67,14 @@ describe('renderer/components/notifications/RepositoryNotifications.tsx', () =>
6467
</AppContext.Provider>,
6568
);
6669

67-
fireEvent.click(screen.getByTestId('repository-mark-as-read'));
70+
await userEvent.click(screen.getByTestId('repository-mark-as-read'));
6871

6972
expect(markNotificationsAsRead).toHaveBeenCalledWith(
7073
mockGitHubNotifications,
7174
);
7275
});
7376

74-
it('should mark a repo as done', () => {
77+
it('should mark a repo as done', async () => {
7578
render(
7679
<AppContext.Provider
7780
value={{ settings: { ...mockSettings }, markNotificationsAsDone }}
@@ -80,7 +83,7 @@ describe('renderer/components/notifications/RepositoryNotifications.tsx', () =>
8083
</AppContext.Provider>,
8184
);
8285

83-
fireEvent.click(screen.getByTestId('repository-mark-as-done'));
86+
await userEvent.click(screen.getByTestId('repository-mark-as-done'));
8487

8588
expect(markNotificationsAsDone).toHaveBeenCalledWith(
8689
mockGitHubNotifications,
@@ -95,6 +98,7 @@ describe('renderer/components/notifications/RepositoryNotifications.tsx', () =>
9598
<RepositoryNotifications {...props} />
9699
</AppContext.Provider>,
97100
);
101+
98102
expect(tree).toMatchSnapshot();
99103
});
100104

@@ -103,7 +107,7 @@ describe('renderer/components/notifications/RepositoryNotifications.tsx', () =>
103107
render(<RepositoryNotifications {...props} />);
104108
});
105109

106-
fireEvent.click(screen.getByTestId('repository-toggle'));
110+
await userEvent.click(screen.getByTestId('repository-toggle'));
107111

108112
const tree = render(<RepositoryNotifications {...props} />);
109113
expect(tree).toMatchSnapshot();

‎src/renderer/components/primitives/Header.test.tsx‎

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
import { MarkGithubIcon } from '@primer/octicons-react';
2-
import { fireEvent, render, screen } from '@testing-library/react';
2+
import { render, screen } from '@testing-library/react';
3+
import userEvent from '@testing-library/user-event';
4+
35
import { AppContext } from '../../context/App';
46
import { Header } from './Header';
57

@@ -22,15 +24,15 @@ describe('renderer/components/primitives/Header.tsx', () => {
2224
expect(tree).toMatchSnapshot();
2325
});
2426

25-
it('should navigate back', () => {
27+
it('should navigate back', async () => {
2628
render(<Header icon={MarkGithubIcon}>Test Header</Header>);
2729

28-
fireEvent.click(screen.getByTestId('header-nav-back'));
30+
await userEvent.click(screen.getByTestId('header-nav-back'));
2931

3032
expect(mockNavigate).toHaveBeenNthCalledWith(1, -1);
3133
});
3234

33-
it('should navigate back and fetch notifications', () => {
35+
it('should navigate back and fetch notifications', async () => {
3436
render(
3537
<AppContext.Provider
3638
value={{
@@ -43,7 +45,7 @@ describe('renderer/components/primitives/Header.tsx', () => {
4345
</AppContext.Provider>,
4446
);
4547

46-
fireEvent.click(screen.getByTestId('header-nav-back'));
48+
await userEvent.click(screen.getByTestId('header-nav-back'));
4749

4850
expect(mockNavigate).toHaveBeenNthCalledWith(1, -1);
4951
expect(fetchNotifications).toHaveBeenCalledTimes(1);

‎src/renderer/components/settings/SettingsFooter.test.tsx‎

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
1-
import { act, fireEvent, render, screen } from '@testing-library/react';
1+
import { act, render, screen } from '@testing-library/react';
2+
import userEvent from '@testing-library/user-event';
23
import { MemoryRouter } from 'react-router-dom';
4+
35
import { mockAuth, mockSettings } from '../../__mocks__/state-mocks';
46
import { AppContext } from '../../context/App';
57
import * as comms from '../../utils/comms';
@@ -98,7 +100,7 @@ describe('renderer/components/settings/SettingsFooter.tsx', () => {
98100
);
99101
});
100102

101-
fireEvent.click(screen.getByTestId('settings-release-notes'));
103+
await userEvent.click(screen.getByTestId('settings-release-notes'));
102104

103105
expect(openExternalLinkMock).toHaveBeenCalledTimes(1);
104106
expect(openExternalLinkMock).toHaveBeenCalledWith(
@@ -122,7 +124,7 @@ describe('renderer/components/settings/SettingsFooter.tsx', () => {
122124
);
123125
});
124126

125-
fireEvent.click(screen.getByTestId('settings-accounts'));
127+
await userEvent.click(screen.getByTestId('settings-accounts'));
126128

127129
expect(mockNavigate).toHaveBeenCalledWith('/accounts');
128130
});
@@ -145,7 +147,7 @@ describe('renderer/components/settings/SettingsFooter.tsx', () => {
145147
);
146148
});
147149

148-
fireEvent.click(screen.getByTestId('settings-quit'));
150+
await userEvent.click(screen.getByTestId('settings-quit'));
149151

150152
expect(quitAppMock).toHaveBeenCalledTimes(1);
151153
});

‎src/renderer/components/settings/SettingsReset.test.tsx‎

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
1-
import { act, fireEvent, render, screen } from '@testing-library/react';
1+
import { act, render, screen } from '@testing-library/react';
2+
import userEvent from '@testing-library/user-event';
23
import { MemoryRouter } from 'react-router-dom';
4+
35
import { mockAuth, mockSettings } from '../../__mocks__/state-mocks';
46
import { AppContext } from '../../context/App';
57
import { SettingsReset } from './SettingsReset';
@@ -30,8 +32,8 @@ describe('renderer/components/settings/SettingsReset.tsx', () => {
3032
);
3133
});
3234

33-
fireEvent.click(screen.getByTestId('settings-reset'));
34-
fireEvent.click(screen.getByText('Reset'));
35+
await userEvent.click(screen.getByTestId('settings-reset'));
36+
await userEvent.click(screen.getByText('Reset'));
3537

3638
expect(resetSettings).toHaveBeenCalled();
3739
});
@@ -55,8 +57,8 @@ describe('renderer/components/settings/SettingsReset.tsx', () => {
5557
);
5658
});
5759

58-
fireEvent.click(screen.getByTestId('settings-reset'));
59-
fireEvent.click(screen.getByText('Cancel'));
60+
await userEvent.click(screen.getByTestId('settings-reset'));
61+
await userEvent.click(screen.getByText('Cancel'));
6062

6163
expect(resetSettings).not.toHaveBeenCalled();
6264
});

0 commit comments

Comments
 (0)