Skip to content

Commit 49e8002

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

File tree

2 files changed

+75
-72
lines changed

2 files changed

+75
-72
lines changed

src/renderer/routes/LoginWithOAuthApp.test.tsx

Lines changed: 40 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
1-
import { fireEvent, render, screen, waitFor } 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 { AppContext } from '../context/App';
46
import type { AuthState, ClientID, ClientSecret, Hostname } from '../types';
57
import * as comms from '../utils/comms';
@@ -38,7 +40,7 @@ describe('renderer/routes/LoginWithOAuthApp.tsx', () => {
3840
expect(tree).toMatchSnapshot();
3941
});
4042

41-
it('let us go back', () => {
43+
it('let us go back', async () => {
4244
render(
4345
<AppContext.Provider value={{ auth: mockAuth }}>
4446
<MemoryRouter>
@@ -47,7 +49,7 @@ describe('renderer/routes/LoginWithOAuthApp.tsx', () => {
4749
</AppContext.Provider>,
4850
);
4951

50-
fireEvent.click(screen.getByTestId('header-nav-back'));
52+
await userEvent.click(screen.getByTestId('header-nav-back'));
5153

5254
expect(mockNavigate).toHaveBeenNthCalledWith(1, -1);
5355
});
@@ -89,11 +91,9 @@ describe('renderer/routes/LoginWithOAuthApp.tsx', () => {
8991
</AppContext.Provider>,
9092
);
9193

92-
fireEvent.change(screen.getByTestId('login-hostname'), {
93-
target: { value: '' },
94-
});
94+
await userEvent.clear(screen.getByTestId('login-hostname'));
9595

96-
fireEvent.click(screen.getByTestId('login-create-oauth-app'));
96+
await userEvent.click(screen.getByTestId('login-create-oauth-app'));
9797

9898
expect(openExternalLinkMock).toHaveBeenCalledTimes(0);
9999
});
@@ -107,11 +107,11 @@ describe('renderer/routes/LoginWithOAuthApp.tsx', () => {
107107
</AppContext.Provider>,
108108
);
109109

110-
fireEvent.change(screen.getByTestId('login-hostname'), {
111-
target: { value: 'company.github.com' },
112-
});
110+
const hostname = screen.getByTestId('login-hostname');
111+
await userEvent.clear(hostname);
112+
await userEvent.type(hostname, 'company.github.com');
113113

114-
fireEvent.click(screen.getByTestId('login-create-oauth-app'));
114+
await userEvent.click(screen.getByTestId('login-create-oauth-app'));
115115

116116
expect(openExternalLinkMock).toHaveBeenCalledTimes(1);
117117
});
@@ -132,25 +132,27 @@ describe('renderer/routes/LoginWithOAuthApp.tsx', () => {
132132
</AppContext.Provider>,
133133
);
134134

135-
fireEvent.change(screen.getByTestId('login-hostname'), {
136-
target: { value: 'github.com' },
137-
});
138-
fireEvent.change(screen.getByTestId('login-clientId'), {
139-
target: { value: '1234567890_ASDFGHJKL' },
140-
});
141-
fireEvent.change(screen.getByTestId('login-clientSecret'), {
142-
target: { value: '1234567890_asdfghjklPOIUYTREWQ0987654321' },
143-
});
135+
const hostname = screen.getByTestId('login-hostname');
136+
await userEvent.clear(hostname);
137+
await userEvent.type(hostname, 'github.com');
138+
139+
await userEvent.type(
140+
screen.getByTestId('login-clientId'),
141+
'1234567890_ASDFGHJKL',
142+
);
144143

145-
fireEvent.click(screen.getByTestId('login-submit'));
144+
await userEvent.type(
145+
screen.getByTestId('login-clientSecret'),
146+
'1234567890_asdfghjklPOIUYTREWQ0987654321',
147+
);
146148

147-
await waitFor(() => expect(mockLoginWithOAuthApp).toHaveBeenCalledTimes(1));
149+
await userEvent.click(screen.getByTestId('login-submit'));
148150

149151
expect(mockLoginWithOAuthApp).toHaveBeenCalledTimes(1);
150152
expect(mockNavigate).toHaveBeenNthCalledWith(1, -1);
151153
});
152154

153-
it('should render the form with errors', () => {
155+
it('should render the form with errors', async () => {
154156
render(
155157
<AppContext.Provider value={{ auth: mockAuth }}>
156158
<MemoryRouter>
@@ -159,22 +161,22 @@ describe('renderer/routes/LoginWithOAuthApp.tsx', () => {
159161
</AppContext.Provider>,
160162
);
161163

162-
fireEvent.change(screen.getByTestId('login-hostname'), {
163-
target: { value: 'test' },
164-
});
165-
fireEvent.change(screen.getByTestId('login-clientId'), {
166-
target: { value: '123' },
167-
});
168-
fireEvent.change(screen.getByTestId('login-clientSecret'), {
169-
target: { value: 'abc' },
170-
});
164+
const hostname = screen.getByTestId('login-hostname');
165+
await userEvent.clear(hostname);
166+
await userEvent.type(hostname, 'test');
167+
168+
await userEvent.type(screen.getByTestId('login-clientId'), '123');
169+
170+
await userEvent.type(screen.getByTestId('login-clientSecret'), 'abc');
171171

172-
fireEvent.click(screen.getByTestId('login-submit'));
172+
await userEvent.click(screen.getByTestId('login-submit'));
173173

174-
expect(screen.getByTestId('login-errors')).toBeTruthy();
175-
expect(screen.getByText('Hostname format is invalid')).toBeTruthy();
176-
expect(screen.getByText('Client ID format is invalid')).toBeTruthy();
177-
expect(screen.getByText('Client Secret format is invalid')).toBeTruthy();
174+
expect(screen.getByTestId('login-errors')).toBeInTheDocument();
175+
expect(screen.getByText('Hostname format is invalid')).toBeInTheDocument();
176+
expect(screen.getByText('Client ID format is invalid')).toBeInTheDocument();
177+
expect(
178+
screen.getByText('Client Secret format is invalid'),
179+
).toBeInTheDocument();
178180
});
179181

180182
it('should open help docs in the browser', async () => {
@@ -186,7 +188,7 @@ describe('renderer/routes/LoginWithOAuthApp.tsx', () => {
186188
</AppContext.Provider>,
187189
);
188190

189-
fireEvent.click(screen.getByTestId('login-docs'));
191+
await userEvent.click(screen.getByTestId('login-docs'));
190192

191193
expect(openExternalLinkMock).toHaveBeenCalledTimes(1);
192194
});

src/renderer/routes/LoginWithPersonalAccessToken.test.tsx

Lines changed: 35 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
1-
import { fireEvent, render, screen, waitFor } from '@testing-library/react';
1+
import { render, screen, waitFor } from '@testing-library/react';
2+
import userEvent from '@testing-library/user-event';
23
import { MemoryRouter } from 'react-router-dom';
4+
35
import { AppContext } from '../context/App';
46
import * as comms from '../utils/comms';
57
import {
@@ -33,14 +35,14 @@ describe('renderer/routes/LoginWithPersonalAccessToken.tsx', () => {
3335
expect(tree).toMatchSnapshot();
3436
});
3537

36-
it('let us go back', () => {
38+
it('let us go back', async () => {
3739
render(
3840
<MemoryRouter>
3941
<LoginWithPersonalAccessTokenRoute />
4042
</MemoryRouter>,
4143
);
4244

43-
fireEvent.click(screen.getByTestId('header-nav-back'));
45+
await userEvent.click(screen.getByTestId('header-nav-back'));
4446

4547
expect(mockNavigate).toHaveBeenNthCalledWith(1, -1);
4648
});
@@ -80,11 +82,9 @@ describe('renderer/routes/LoginWithPersonalAccessToken.tsx', () => {
8082
</AppContext.Provider>,
8183
);
8284

83-
fireEvent.change(screen.getByTestId('login-hostname'), {
84-
target: { value: '' },
85-
});
85+
await userEvent.clear(screen.getByTestId('login-hostname'));
8686

87-
fireEvent.click(screen.getByTestId('login-create-token'));
87+
await userEvent.click(screen.getByTestId('login-create-token'));
8888

8989
expect(openExternalLinkMock).toHaveBeenCalledTimes(0);
9090
});
@@ -102,7 +102,7 @@ describe('renderer/routes/LoginWithPersonalAccessToken.tsx', () => {
102102
</AppContext.Provider>,
103103
);
104104

105-
fireEvent.click(screen.getByTestId('login-create-token'));
105+
await userEvent.click(screen.getByTestId('login-create-token'));
106106

107107
expect(openExternalLinkMock).toHaveBeenCalledTimes(1);
108108
});
@@ -123,15 +123,16 @@ describe('renderer/routes/LoginWithPersonalAccessToken.tsx', () => {
123123
</AppContext.Provider>,
124124
);
125125

126-
fireEvent.change(screen.getByTestId('login-hostname'), {
127-
target: { value: 'github.com' },
128-
});
126+
const hostname = screen.getByTestId('login-hostname');
127+
await userEvent.clear(hostname);
128+
await userEvent.type(hostname, 'github.com');
129129

130-
fireEvent.change(screen.getByTestId('login-token'), {
131-
target: { value: '1234567890123456789012345678901234567890' },
132-
});
130+
await userEvent.type(
131+
screen.getByTestId('login-token'),
132+
'1234567890123456789012345678901234567890',
133+
);
133134

134-
fireEvent.click(screen.getByTestId('login-submit'));
135+
await userEvent.click(screen.getByTestId('login-submit'));
135136

136137
await waitFor(() =>
137138
expect(mockLoginWithPersonalAccessToken).toHaveBeenCalledTimes(1),
@@ -156,15 +157,16 @@ describe('renderer/routes/LoginWithPersonalAccessToken.tsx', () => {
156157
</AppContext.Provider>,
157158
);
158159

159-
fireEvent.change(screen.getByTestId('login-hostname'), {
160-
target: { value: 'github.com' },
161-
});
160+
const hostname = screen.getByTestId('login-hostname');
161+
await userEvent.clear(hostname);
162+
await userEvent.type(hostname, 'github.com');
162163

163-
fireEvent.change(screen.getByTestId('login-token'), {
164-
target: { value: '1234567890123456789012345678901234567890' },
165-
});
164+
await userEvent.type(
165+
screen.getByTestId('login-token'),
166+
'1234567890123456789012345678901234567890',
167+
);
166168

167-
fireEvent.click(screen.getByTestId('login-submit'));
169+
await userEvent.click(screen.getByTestId('login-submit'));
168170

169171
await waitFor(() =>
170172
expect(mockLoginWithPersonalAccessToken).toHaveBeenCalledTimes(1),
@@ -174,25 +176,24 @@ describe('renderer/routes/LoginWithPersonalAccessToken.tsx', () => {
174176
expect(mockNavigate).toHaveBeenCalledTimes(0);
175177
});
176178

177-
it('should render the form with errors', () => {
179+
it('should render the form with errors', async () => {
178180
render(
179181
<MemoryRouter>
180182
<LoginWithPersonalAccessTokenRoute />
181183
</MemoryRouter>,
182184
);
183185

184-
fireEvent.change(screen.getByTestId('login-hostname'), {
185-
target: { value: 'test' },
186-
});
187-
fireEvent.change(screen.getByTestId('login-token'), {
188-
target: { value: '123' },
189-
});
186+
const hostname = screen.getByTestId('login-hostname');
187+
await userEvent.clear(hostname);
188+
await userEvent.type(hostname, 'test');
189+
190+
await userEvent.type(screen.getByTestId('login-token'), '123');
190191

191-
fireEvent.click(screen.getByTestId('login-submit'));
192+
await userEvent.click(screen.getByTestId('login-submit'));
192193

193-
expect(screen.getByTestId('login-errors')).toBeTruthy();
194-
expect(screen.getByText('Hostname format is invalid')).toBeTruthy();
195-
expect(screen.getByText('Token format is invalid')).toBeTruthy();
194+
expect(screen.getByTestId('login-errors')).toBeInTheDocument();
195+
expect(screen.getByText('Hostname format is invalid')).toBeInTheDocument();
196+
expect(screen.getByText('Token format is invalid')).toBeInTheDocument();
196197
});
197198

198199
it('should open help docs in the browser', async () => {
@@ -208,7 +209,7 @@ describe('renderer/routes/LoginWithPersonalAccessToken.tsx', () => {
208209
</AppContext.Provider>,
209210
);
210211

211-
fireEvent.click(screen.getByTestId('login-docs'));
212+
await userEvent.click(screen.getByTestId('login-docs'));
212213

213214
expect(openExternalLinkMock).toHaveBeenCalledTimes(1);
214215
});

0 commit comments

Comments
 (0)