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' ;
23import { MemoryRouter } from 'react-router-dom' ;
4+
35import { mockAccountNotifications } from '../__mocks__/notifications-mocks' ;
46import { mockAuth , mockSettings } from '../__mocks__/state-mocks' ;
57import { 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 } ) ;
0 commit comments