Skip to content

Commit 1b169ae

Browse files
manudeliTkDodo
manudeli
and
TkDodo
authored
test(query-core): use fake timers for queryObserver.test.tsx (#9004)
* test(query-core): use fake timers for queryObserver.test.tsx * chore: update * chore: migrate * chore: update * Removes unused testing library dependency Deletes `@testing-library/dom` from devDependencies in package.json and pnpm-lock.yaml to clean up unused dependencies and streamline the project's dependency tree. * chore: update --------- Co-authored-by: Dominik Dorfmeister <[email protected]>
1 parent 9f93f12 commit 1b169ae

File tree

3 files changed

+114
-50
lines changed

3 files changed

+114
-50
lines changed

‎packages/query-core/package.json‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -59,7 +59,6 @@
5959
"!src/__tests__"
6060
],
6161
"devDependencies": {
62-
"@testing-library/dom": "^10.4.0",
6362
"npm-run-all2": "^5.0.0"
6463
}
6564
}

‎packages/query-core/src/__tests__/queryObserver.test.tsx‎

Lines changed: 48 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,6 @@ import {
77
test,
88
vi,
99
} from 'vitest'
10-
import { waitFor } from '@testing-library/dom'
1110
import { QueryObserver, focusManager } from '..'
1211
import { createQueryClient, queryKey, sleep } from './utils'
1312
import type { QueryClient, QueryObserverResult } from '..'
@@ -16,6 +15,7 @@ describe('queryObserver', () => {
1615
let queryClient: QueryClient
1716

1817
beforeEach(() => {
18+
vi.useFakeTimers()
1919
queryClient = createQueryClient({
2020
defaultOptions: {
2121
queries: {
@@ -28,6 +28,7 @@ describe('queryObserver', () => {
2828

2929
afterEach(() => {
3030
queryClient.clear()
31+
vi.useRealTimers()
3132
})
3233

3334
test('should trigger a fetch when subscribed', async () => {
@@ -37,7 +38,6 @@ describe('queryObserver', () => {
3738
.mockReturnValue('data')
3839
const observer = new QueryObserver(queryClient, { queryKey: key, queryFn })
3940
const unsubscribe = observer.subscribe(() => undefined)
40-
await sleep(1)
4141
unsubscribe()
4242
expect(queryFn).toHaveBeenCalledTimes(1)
4343
})
@@ -109,7 +109,7 @@ describe('queryObserver', () => {
109109
fetchStatus: 'idle',
110110
data: undefined,
111111
})
112-
await waitFor(() => expect(count).toBe(0))
112+
await vi.waitFor(() => expect(count).toBe(0))
113113

114114
unsubscribe()
115115
})
@@ -128,7 +128,7 @@ describe('queryObserver', () => {
128128
data: undefined,
129129
})
130130

131-
await waitFor(() => expect(count).toBe(1))
131+
await vi.waitFor(() => expect(count).toBe(1))
132132
expect(observer.getCurrentResult()).toMatchObject({
133133
status: 'success',
134134
fetchStatus: 'idle',
@@ -158,7 +158,7 @@ describe('queryObserver', () => {
158158
data: undefined,
159159
})
160160

161-
await waitFor(() => expect(count).toBe(1))
161+
await vi.waitFor(() => expect(count).toBe(1))
162162

163163
unsubscribe()
164164
})
@@ -194,7 +194,7 @@ describe('queryObserver', () => {
194194
fetchStatus: 'fetching',
195195
data: undefined,
196196
})
197-
await waitFor(() => expect(count).toBe(1))
197+
await vi.waitFor(() => expect(count).toBe(1))
198198

199199
unsubscribe()
200200
})
@@ -208,20 +208,20 @@ describe('queryObserver', () => {
208208
queryClient.invalidateQueries({ queryKey: key, refetchType: 'inactive' })
209209

210210
// should not refetch since it was active and we only refetch inactive
211-
await waitFor(() => expect(count).toBe(0))
211+
await vi.waitFor(() => expect(count).toBe(0))
212212

213213
queryClient.invalidateQueries({ queryKey: key, refetchType: 'active' })
214214

215215
// should refetch since it was active and we refetch active
216-
await waitFor(() => expect(count).toBe(1))
216+
await vi.waitFor(() => expect(count).toBe(1))
217217

218218
// Toggle enabled
219219
enabled = false
220220

221221
// should not refetch since it is not active and we only refetch active
222222
queryClient.invalidateQueries({ queryKey: key, refetchType: 'active' })
223223

224-
await waitFor(() => expect(count).toBe(1))
224+
await vi.waitFor(() => expect(count).toBe(1))
225225

226226
unsubscribe()
227227
})
@@ -251,7 +251,7 @@ describe('queryObserver', () => {
251251
data: undefined,
252252
})
253253

254-
await waitFor(() => expect(count).toBe(1))
254+
await vi.waitFor(() => expect(count).toBe(1))
255255

256256
// re-subscribe after data comes in
257257
unsubscribe = observer.subscribe(vi.fn())
@@ -275,9 +275,9 @@ describe('queryObserver', () => {
275275
const unsubscribe = observer.subscribe((result) => {
276276
results.push(result)
277277
})
278-
await sleep(1)
278+
await vi.advanceTimersByTimeAsync(1)
279279
observer.setOptions({ queryKey: key2, queryFn: () => 2 })
280-
await sleep(1)
280+
await vi.advanceTimersByTimeAsync(1)
281281
unsubscribe()
282282
expect(results.length).toBe(4)
283283
expect(results[0]).toMatchObject({ data: undefined, status: 'pending' })
@@ -300,7 +300,7 @@ describe('queryObserver', () => {
300300
>()
301301
observerResult = result
302302
})
303-
await sleep(1)
303+
await vi.advanceTimersByTimeAsync(1)
304304
unsubscribe()
305305
expect(observerResult).toMatchObject({ data: { myCount: 1 } })
306306
})
@@ -330,7 +330,7 @@ describe('queryObserver', () => {
330330
const unsubscribe = observer.subscribe((result) => {
331331
observerResult = result
332332
})
333-
await sleep(1)
333+
await vi.advanceTimersByTimeAsync(1)
334334
unsubscribe()
335335
expect(observerResult).toMatchObject({ data: { myCount: 1 } })
336336
})
@@ -374,13 +374,13 @@ describe('queryObserver', () => {
374374
const unsubscribe = observer.subscribe((result) => {
375375
results.push(result)
376376
})
377-
await sleep(1)
377+
await vi.advanceTimersByTimeAsync(1)
378378
observer.setOptions({
379379
queryKey: key,
380380
queryFn,
381381
select: select2,
382382
})
383-
await sleep(1)
383+
await vi.advanceTimersByTimeAsync(1)
384384
await observer.refetch()
385385
unsubscribe()
386386
expect(count).toBe(2)
@@ -429,13 +429,13 @@ describe('queryObserver', () => {
429429
const unsubscribe = observer.subscribe((result) => {
430430
results.push(result)
431431
})
432-
await sleep(1)
432+
await vi.advanceTimersByTimeAsync(1)
433433
observer.setOptions({
434434
queryKey: key,
435435
queryFn,
436436
select,
437437
})
438-
await sleep(1)
438+
await vi.advanceTimersByTimeAsync(1)
439439
await observer.refetch()
440440
unsubscribe()
441441
expect(count).toBe(1)
@@ -497,8 +497,9 @@ describe('queryObserver', () => {
497497
const unsubscribe = observer.subscribe((result) => {
498498
results.push(result)
499499
})
500-
await sleep(50)
501-
await observer.refetch()
500+
await vi.advanceTimersByTimeAsync(50)
501+
observer.refetch()
502+
await vi.advanceTimersByTimeAsync(10)
502503
unsubscribe()
503504
expect(results[0]).toMatchObject({
504505
status: 'pending',
@@ -546,8 +547,9 @@ describe('queryObserver', () => {
546547
const unsubscribe = observer.subscribe((result) => {
547548
results.push(result)
548549
})
549-
await sleep(50)
550-
await observer.refetch()
550+
await vi.advanceTimersByTimeAsync(50)
551+
observer.refetch()
552+
await vi.advanceTimersByTimeAsync(10)
551553
unsubscribe()
552554

553555
expect(results[0]).toMatchObject({
@@ -601,7 +603,7 @@ describe('queryObserver', () => {
601603
enabled: false,
602604
})
603605
const unsubscribe = observer.subscribe(() => undefined)
604-
await sleep(1)
606+
await vi.advanceTimersByTimeAsync(1)
605607
unsubscribe()
606608
expect(queryFn).toHaveBeenCalledTimes(0)
607609
})
@@ -617,7 +619,7 @@ describe('queryObserver', () => {
617619
enabled: () => false,
618620
})
619621
const unsubscribe = observer.subscribe(() => undefined)
620-
await sleep(1)
622+
await vi.advanceTimersByTimeAsync(1)
621623
unsubscribe()
622624
expect(queryFn).toHaveBeenCalledTimes(0)
623625
})
@@ -628,7 +630,7 @@ describe('queryObserver', () => {
628630
.fn<(...args: Array<unknown>) => string>()
629631
.mockReturnValue('data')
630632
new QueryObserver(queryClient, { queryKey: key, queryFn })
631-
await sleep(1)
633+
await vi.advanceTimersByTimeAsync(1)
632634
expect(queryFn).toHaveBeenCalledTimes(0)
633635
})
634636

@@ -664,7 +666,7 @@ describe('queryObserver', () => {
664666
})
665667
observer.setOptions({ queryKey: key, enabled: false, staleTime: 10 })
666668
await queryClient.fetchQuery({ queryKey: key, queryFn })
667-
await sleep(20)
669+
await vi.advanceTimersByTimeAsync(20)
668670
unsubscribe()
669671
expect(queryFn).toHaveBeenCalledTimes(1)
670672
expect(results.length).toBe(2)
@@ -690,7 +692,7 @@ describe('queryObserver', () => {
690692
results2.push(x)
691693
})
692694
await queryClient.fetchQuery({ queryKey: key, queryFn })
693-
await sleep(50)
695+
await vi.advanceTimersByTimeAsync(50)
694696
unsubscribe1()
695697
unsubscribe2()
696698
expect(queryFn).toHaveBeenCalledTimes(1)
@@ -715,9 +717,9 @@ describe('queryObserver', () => {
715717
retryDelay: 50,
716718
})
717719
const unsubscribe = observer.subscribe(() => undefined)
718-
await sleep(70)
720+
await vi.advanceTimersByTimeAsync(70)
719721
unsubscribe()
720-
await sleep(200)
722+
await vi.advanceTimersByTimeAsync(200)
721723
expect(count).toBe(2)
722724
})
723725

@@ -737,10 +739,10 @@ describe('queryObserver', () => {
737739
})
738740
const unsubscribe = observer.subscribe(() => undefined)
739741
expect(count).toBe(1)
740-
await sleep(15)
742+
await vi.advanceTimersByTimeAsync(15)
741743
expect(count).toBe(2)
742744
unsubscribe()
743-
await sleep(10)
745+
await vi.advanceTimersByTimeAsync(10)
744746
expect(queryClient.getQueryCache().find({ queryKey: key })).toBeUndefined()
745747
expect(count).toBe(2)
746748
})
@@ -764,7 +766,7 @@ describe('queryObserver', () => {
764766
results.push(x)
765767
})
766768

767-
await sleep(10)
769+
await vi.advanceTimersByTimeAsync(10)
768770
unsubscribe()
769771

770772
expect(results.length).toBe(2)
@@ -849,7 +851,7 @@ describe('queryObserver', () => {
849851
})
850852

851853
const unsubscribe = observer.subscribe(() => undefined)
852-
await sleep(30)
854+
await vi.advanceTimersByTimeAsync(30)
853855

854856
expect(queryFn).toHaveBeenCalledTimes(1)
855857

@@ -872,7 +874,7 @@ describe('queryObserver', () => {
872874

873875
const unsubscribe = observer.subscribe(() => undefined)
874876

875-
await sleep(10)
877+
await vi.advanceTimersByTimeAsync(10)
876878
expect(observer.getCurrentResult().data).toBe(data)
877879

878880
observer.setOptions({
@@ -949,7 +951,7 @@ describe('queryObserver', () => {
949951
results.push(result)
950952
})
951953

952-
await sleep(1)
954+
await vi.advanceTimersByTimeAsync(1)
953955

954956
observer.setOptions({
955957
queryKey: key2,
@@ -961,7 +963,7 @@ describe('queryObserver', () => {
961963
select: (data) => data.value,
962964
})
963965

964-
await sleep(1)
966+
await vi.advanceTimersByTimeAsync(1)
965967
unsubscribe()
966968
expect(results.length).toBe(4)
967969
expect(keys.length).toBe(3)
@@ -1016,7 +1018,7 @@ describe('queryObserver', () => {
10161018
results.push(result)
10171019
})
10181020

1019-
await sleep(1)
1021+
await vi.advanceTimersByTimeAsync(1)
10201022

10211023
observer.setOptions({
10221024
queryKey: key2,
@@ -1028,7 +1030,7 @@ describe('queryObserver', () => {
10281030
},
10291031
})
10301032

1031-
await sleep(1)
1033+
await vi.advanceTimersByTimeAsync(1)
10321034
unsubscribe()
10331035

10341036
expect(results.length).toBe(4)
@@ -1079,7 +1081,7 @@ describe('queryObserver', () => {
10791081
results.push(result)
10801082
})
10811083

1082-
await sleep(1)
1084+
await vi.advanceTimersByTimeAsync(1)
10831085

10841086
observer.setOptions({
10851087
queryKey: key2,
@@ -1088,7 +1090,7 @@ describe('queryObserver', () => {
10881090
select: stableSelect,
10891091
})
10901092

1091-
await sleep(1)
1093+
await vi.advanceTimersByTimeAsync(1)
10921094
unsubscribe()
10931095

10941096
expect(results.length).toBe(4)
@@ -1170,8 +1172,8 @@ describe('queryObserver', () => {
11701172
}
11711173
})
11721174

1173-
await waitFor(() => expect(results[0]?.isStale).toBe(false))
1174-
await waitFor(() => expect(results[1]?.isStale).toBe(true))
1175+
await vi.waitFor(() => expect(results[0]?.isStale).toBe(false))
1176+
await vi.waitFor(() => expect(results[1]?.isStale).toBe(true))
11751177

11761178
unsubscribe()
11771179
})
@@ -1195,7 +1197,7 @@ describe('queryObserver', () => {
11951197
results.push(observer.getCurrentResult())
11961198
})
11971199

1198-
await waitFor(() => {
1200+
await vi.waitFor(() => {
11991201
expect(results.at(-1)?.data).toBe('data')
12001202
})
12011203

@@ -1228,7 +1230,7 @@ describe('queryObserver', () => {
12281230
results.push(observer.getCurrentResult())
12291231
})
12301232

1231-
await waitFor(() => {
1233+
await vi.waitFor(() => {
12321234
expect(results.at(-1)?.status).toBe('error')
12331235
})
12341236

@@ -1240,7 +1242,7 @@ describe('queryObserver', () => {
12401242
// fail again
12411243
const lengthBefore = results.length
12421244
observer.refetch()
1243-
await waitFor(() => {
1245+
await vi.waitFor(() => {
12441246
expect(results.length).toBeGreaterThan(lengthBefore)
12451247
expect(results.at(-1)?.status).toBe('error')
12461248
})
@@ -1256,7 +1258,7 @@ describe('queryObserver', () => {
12561258
succeeds = true
12571259
observer.refetch()
12581260

1259-
await waitFor(() => {
1261+
await vi.waitFor(() => {
12601262
results.at(-1)?.status === 'success'
12611263
})
12621264

0 commit comments

Comments
 (0)