Skip to content

Commit 05c62a0

Browse files
sukvvonmanudeli
sukvvon
and
manudeli
authored
test(react-query/useSuspenseQuery): use precise time in 'advanceTimersByTimeAsync', and add 'expect' using 'toBeInTheDocument' (#9455)
Co-authored-by: Jonghyeon Ko <manudeli.ko@gmail.com>
1 parent e349d85 commit 05c62a0

1 file changed

Lines changed: 53 additions & 55 deletions

File tree

‎packages/react-query/src/__tests__/useSuspenseQuery.test.tsx‎

Lines changed: 53 additions & 55 deletions
Original file line numberDiff line numberDiff line change
@@ -69,12 +69,12 @@ describe('useSuspenseQuery', () => {
6969
</React.Suspense>,
7070
)
7171

72-
await act(() => vi.advanceTimersByTimeAsync(11))
73-
rendered.getByText('data: 1')
72+
await act(() => vi.advanceTimersByTimeAsync(10))
73+
expect(rendered.getByText('data: 1')).toBeInTheDocument()
7474

7575
fireEvent.click(rendered.getByLabelText('toggle'))
76-
await act(() => vi.advanceTimersByTimeAsync(11))
77-
rendered.getByText('data: 2')
76+
await act(() => vi.advanceTimersByTimeAsync(10))
77+
expect(rendered.getByText('data: 2')).toBeInTheDocument()
7878

7979
expect(renders).toBe(6)
8080
expect(states.length).toBe(2)
@@ -114,8 +114,8 @@ describe('useSuspenseQuery', () => {
114114
</React.Suspense>,
115115
)
116116

117-
await act(() => vi.advanceTimersByTimeAsync(11))
118-
rendered.getByText('data: 1')
117+
await act(() => vi.advanceTimersByTimeAsync(10))
118+
expect(rendered.getByText('data: 1')).toBeInTheDocument()
119119

120120
expect(states.length).toBe(1)
121121
expect(states[0]).toMatchObject({
@@ -124,8 +124,8 @@ describe('useSuspenseQuery', () => {
124124
})
125125

126126
fireEvent.click(rendered.getByText('next'))
127-
await act(() => vi.advanceTimersByTimeAsync(11))
128-
rendered.getByText('data: 2')
127+
await act(() => vi.advanceTimersByTimeAsync(10))
128+
expect(rendered.getByText('data: 2')).toBeInTheDocument()
129129

130130
expect(states.length).toBe(2)
131131
expect(states[1]).toMatchObject({
@@ -156,8 +156,8 @@ describe('useSuspenseQuery', () => {
156156
</React.Suspense>,
157157
)
158158

159-
await act(() => vi.advanceTimersByTimeAsync(11))
160-
rendered.getByText('rendered')
159+
await act(() => vi.advanceTimersByTimeAsync(10))
160+
expect(rendered.getByText('rendered')).toBeInTheDocument()
161161

162162
expect(queryFn).toHaveBeenCalledTimes(1)
163163
})
@@ -197,13 +197,13 @@ describe('useSuspenseQuery', () => {
197197
expect(queryCache.find({ queryKey: key })).toBeFalsy()
198198

199199
fireEvent.click(rendered.getByLabelText('toggle'))
200-
await act(() => vi.advanceTimersByTimeAsync(11))
201-
rendered.getByText('rendered')
200+
await act(() => vi.advanceTimersByTimeAsync(10))
201+
expect(rendered.getByText('rendered')).toBeInTheDocument()
202202

203203
expect(queryCache.find({ queryKey: key })?.getObserversCount()).toBe(1)
204204

205205
fireEvent.click(rendered.getByLabelText('toggle'))
206-
await act(() => vi.advanceTimersByTimeAsync(11))
206+
await act(() => vi.advanceTimersByTimeAsync(10))
207207
expect(rendered.queryByText('rendered')).toBeNull()
208208
expect(queryCache.find({ queryKey: key })?.getObserversCount()).toBe(0)
209209
})
@@ -263,13 +263,13 @@ describe('useSuspenseQuery', () => {
263263
</QueryErrorResetBoundary>,
264264
)
265265

266-
rendered.getByText('Loading...')
267-
await act(() => vi.advanceTimersByTimeAsync(71))
268-
rendered.getByText('error boundary')
269-
rendered.getByText('retry')
266+
expect(rendered.getByText('Loading...')).toBeInTheDocument()
267+
await act(() => vi.advanceTimersByTimeAsync(70))
268+
expect(rendered.getByText('error boundary')).toBeInTheDocument()
269+
expect(rendered.getByText('retry')).toBeInTheDocument()
270270
fireEvent.click(rendered.getByText('retry'))
271-
await act(() => vi.advanceTimersByTimeAsync(11))
272-
rendered.getByText('rendered')
271+
await act(() => vi.advanceTimersByTimeAsync(10))
272+
expect(rendered.getByText('rendered')).toBeInTheDocument()
273273

274274
expect(consoleMock.mock.calls[0]?.[1]).toStrictEqual(
275275
new Error('Suspense Error Bingo'),
@@ -330,16 +330,16 @@ describe('useSuspenseQuery', () => {
330330
)
331331

332332
expect(rendered.getByText('Loading...')).toBeInTheDocument()
333-
await act(() => vi.advanceTimersByTimeAsync(71))
333+
await act(() => vi.advanceTimersByTimeAsync(10))
334334
expect(rendered.getByText('error boundary')).toBeInTheDocument()
335335
expect(rendered.getByText('retry')).toBeInTheDocument()
336336
fireEvent.click(rendered.getByText('retry'))
337-
await act(() => vi.advanceTimersByTimeAsync(71))
337+
await act(() => vi.advanceTimersByTimeAsync(10))
338338
expect(rendered.getByText('error boundary')).toBeInTheDocument()
339339
expect(rendered.getByText('retry')).toBeInTheDocument()
340340
succeed = true
341341
fireEvent.click(rendered.getByText('retry'))
342-
await act(() => vi.advanceTimersByTimeAsync(11))
342+
await act(() => vi.advanceTimersByTimeAsync(10))
343343
expect(rendered.getByText('rendered')).toBeInTheDocument()
344344
consoleMock.mockRestore()
345345
})
@@ -375,9 +375,9 @@ describe('useSuspenseQuery', () => {
375375

376376
const rendered = renderWithClient(queryClient, <Page />)
377377

378-
rendered.getByText('Loading...')
379-
await act(() => vi.advanceTimersByTimeAsync(6))
380-
rendered.getByText('data: 1')
378+
expect(rendered.getByText('Loading...')).toBeInTheDocument()
379+
await act(() => vi.advanceTimersByTimeAsync(5))
380+
expect(rendered.getByText('data: 1')).toBeInTheDocument()
381381

382382
expect(
383383
typeof queryClient.getQueryCache().find({ queryKey: key })?.observers[0]
@@ -423,14 +423,12 @@ describe('useSuspenseQuery', () => {
423423
const rendered = renderWithClient(queryClient, <Page />)
424424

425425
expect(rendered.getByText('Loading...')).toBeInTheDocument()
426-
await act(() => vi.advanceTimersByTimeAsync(101))
426+
await act(() => vi.advanceTimersByTimeAsync(100))
427427
expect(rendered.getByText(`data: ${key1}`)).toBeInTheDocument()
428428
fireEvent.click(rendered.getByText('switch'))
429429
expect(rendered.getByText('Loading...')).toBeInTheDocument()
430-
await act(() => vi.advanceTimersByTimeAsync(101))
431-
await vi.waitFor(() =>
432-
expect(rendered.getByText(`data: ${key2}`)).toBeInTheDocument(),
433-
)
430+
await act(() => vi.advanceTimersByTimeAsync(100))
431+
expect(rendered.getByText(`data: ${key2}`)).toBeInTheDocument()
434432
})
435433

436434
it('should retry fetch if the reset error boundary has been reset with global hook', async () => {
@@ -485,16 +483,16 @@ describe('useSuspenseQuery', () => {
485483
const rendered = renderWithClient(queryClient, <App />)
486484

487485
expect(rendered.getByText('Loading...')).toBeInTheDocument()
488-
await act(() => vi.advanceTimersByTimeAsync(71))
486+
await act(() => vi.advanceTimersByTimeAsync(10))
489487
expect(rendered.getByText('error boundary')).toBeInTheDocument()
490488
expect(rendered.getByText('retry')).toBeInTheDocument()
491489
fireEvent.click(rendered.getByText('retry'))
492-
await act(() => vi.advanceTimersByTimeAsync(71))
490+
await act(() => vi.advanceTimersByTimeAsync(10))
493491
expect(rendered.getByText('error boundary')).toBeInTheDocument()
494492
expect(rendered.getByText('retry')).toBeInTheDocument()
495493
succeed = true
496494
fireEvent.click(rendered.getByText('retry'))
497-
await act(() => vi.advanceTimersByTimeAsync(11))
495+
await act(() => vi.advanceTimersByTimeAsync(10))
498496
expect(rendered.getByText('rendered')).toBeInTheDocument()
499497
consoleMock.mockRestore()
500498
})
@@ -536,7 +534,7 @@ describe('useSuspenseQuery', () => {
536534
const rendered = renderWithClient(queryClient, <App />)
537535

538536
expect(rendered.getByText('Loading...')).toBeInTheDocument()
539-
await act(() => vi.advanceTimersByTimeAsync(71))
537+
await act(() => vi.advanceTimersByTimeAsync(10))
540538
expect(rendered.getByText('error boundary')).toBeInTheDocument()
541539
consoleMock.mockRestore()
542540
})
@@ -640,18 +638,18 @@ describe('useSuspenseQuery', () => {
640638
const rendered = renderWithClient(queryClient, <App />)
641639

642640
// render suspense fallback (Loading...)
643-
rendered.getByText('Loading...')
641+
expect(rendered.getByText('Loading...')).toBeInTheDocument()
644642
// resolve promise -> render Page (rendered)
645-
await act(() => vi.advanceTimersByTimeAsync(11))
646-
rendered.getByText('rendered')
643+
await act(() => vi.advanceTimersByTimeAsync(10))
644+
expect(rendered.getByText('rendered')).toBeInTheDocument()
647645

648646
// change query key
649647
succeed = false
650648
// reset query -> and throw error
651649
fireEvent.click(rendered.getByLabelText('fail'))
652650
// render error boundary fallback (error boundary)
653-
await act(() => vi.advanceTimersByTimeAsync(11))
654-
rendered.getByText('error boundary')
651+
await act(() => vi.advanceTimersByTimeAsync(10))
652+
expect(rendered.getByText('error boundary')).toBeInTheDocument()
655653
expect(consoleMock.mock.calls[0]?.[1]).toStrictEqual(
656654
new Error('Suspense Error Bingo'),
657655
)
@@ -713,18 +711,18 @@ describe('useSuspenseQuery', () => {
713711
const rendered = renderWithClient(queryClient, <App />)
714712

715713
// render suspense fallback (Loading...)
716-
rendered.getByText('Loading...')
714+
expect(rendered.getByText('Loading...')).toBeInTheDocument()
717715
// resolve promise -> render Page (rendered)
718-
await act(() => vi.advanceTimersByTimeAsync(11))
719-
rendered.getByText('rendered')
716+
await act(() => vi.advanceTimersByTimeAsync(10))
717+
expect(rendered.getByText('rendered')).toBeInTheDocument()
720718

721719
// change promise result to error
722720
succeed = false
723721
// change query key
724722
fireEvent.click(rendered.getByLabelText('fail'))
725723
// render error boundary fallback (error boundary)
726-
await act(() => vi.advanceTimersByTimeAsync(11))
727-
rendered.getByText('error boundary')
724+
await act(() => vi.advanceTimersByTimeAsync(10))
725+
expect(rendered.getByText('error boundary')).toBeInTheDocument()
728726
expect(consoleMock.mock.calls[0]?.[1]).toStrictEqual(
729727
new Error('Suspense Error Bingo'),
730728
)
@@ -766,7 +764,7 @@ describe('useSuspenseQuery', () => {
766764
</React.Suspense>,
767765
)
768766

769-
await act(() => vi.advanceTimersByTimeAsync(11))
767+
await act(() => vi.advanceTimersByTimeAsync(10))
770768
expect(state).toMatchObject({
771769
data: 1,
772770
status: 'success',
@@ -825,7 +823,7 @@ describe('useSuspenseQuery', () => {
825823
// render suspense fallback (Loading...)
826824
expect(rendered.getByText('Loading...')).toBeInTheDocument()
827825
// resolve promise -> render Page (rendered)
828-
await act(() => vi.advanceTimersByTimeAsync(11))
826+
await act(() => vi.advanceTimersByTimeAsync(10))
829827
expect(rendered.getByText('rendered data success')).toBeInTheDocument()
830828

831829
// change promise result to error
@@ -882,12 +880,12 @@ describe('useSuspenseQuery', () => {
882880
)
883881

884882
expect(rendered.getByText('loading')).toBeInTheDocument()
885-
await act(() => vi.advanceTimersByTimeAsync(101))
883+
await act(() => vi.advanceTimersByTimeAsync(100))
886884
expect(rendered.getByText('data: 1')).toBeInTheDocument()
887885
fireEvent.click(rendered.getByLabelText('toggle'))
888886

889887
expect(rendered.getByText('loading')).toBeInTheDocument()
890-
await act(() => vi.advanceTimersByTimeAsync(101))
888+
await act(() => vi.advanceTimersByTimeAsync(100))
891889
expect(rendered.getByText('data: 2')).toBeInTheDocument()
892890
})
893891

@@ -931,7 +929,7 @@ describe('useSuspenseQuery', () => {
931929
queryKey: key,
932930
queryFn: async () => {
933931
count++
934-
await sleep(1)
932+
await sleep(10)
935933
return count
936934
},
937935
refetchInterval: 10,
@@ -947,12 +945,12 @@ describe('useSuspenseQuery', () => {
947945
</React.Suspense>,
948946
)
949947

950-
await act(() => vi.advanceTimersByTimeAsync(2))
951-
rendered.getByText('count: 1')
952-
await act(() => vi.advanceTimersByTimeAsync(12))
953-
rendered.getByText('count: 2')
954-
await act(() => vi.advanceTimersByTimeAsync(12))
955-
rendered.getByText('count: 3')
948+
await act(() => vi.advanceTimersByTimeAsync(10))
949+
expect(rendered.getByText('count: 1')).toBeInTheDocument()
950+
await act(() => vi.advanceTimersByTimeAsync(21))
951+
expect(rendered.getByText('count: 2')).toBeInTheDocument()
952+
await act(() => vi.advanceTimersByTimeAsync(21))
953+
expect(rendered.getByText('count: 3')).toBeInTheDocument()
956954

957955
expect(count).toBeGreaterThanOrEqual(3)
958956
})

0 commit comments

Comments
 (0)