Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

test(query-core): add test case for queryClient.isFetching #8720

Merged

Conversation

manudeli
Copy link
Contributor

No description provided.

Copy link

nx-cloud bot commented Feb 27, 2025

View your CI Pipeline Execution ↗ for commit 0156811.

Command Status Duration Result
nx affected --targets=test:sherif,test:knip,tes... ✅ Succeeded 5m 5s View ↗
nx run-many --target=build --exclude=examples/*... ✅ Succeeded 2m 6s View ↗

☁️ Nx Cloud last updated this comment at 2025-03-01 06:15:25 UTC

Copy link

pkg-pr-new bot commented Feb 27, 2025

Open in Stackblitz

More templates

@tanstack/angular-query-devtools-experimental

npm i https://pkg.pr.new/@tanstack/angular-query-devtools-experimental@8720

@tanstack/angular-query-experimental

npm i https://pkg.pr.new/@tanstack/angular-query-experimental@8720

@tanstack/eslint-plugin-query

npm i https://pkg.pr.new/@tanstack/eslint-plugin-query@8720

@tanstack/query-async-storage-persister

npm i https://pkg.pr.new/@tanstack/query-async-storage-persister@8720

@tanstack/query-broadcast-client-experimental

npm i https://pkg.pr.new/@tanstack/query-broadcast-client-experimental@8720

@tanstack/query-core

npm i https://pkg.pr.new/@tanstack/query-core@8720

@tanstack/query-devtools

npm i https://pkg.pr.new/@tanstack/query-devtools@8720

@tanstack/query-persist-client-core

npm i https://pkg.pr.new/@tanstack/query-persist-client-core@8720

@tanstack/query-sync-storage-persister

npm i https://pkg.pr.new/@tanstack/query-sync-storage-persister@8720

@tanstack/react-query

npm i https://pkg.pr.new/@tanstack/react-query@8720

@tanstack/react-query-devtools

npm i https://pkg.pr.new/@tanstack/react-query-devtools@8720

@tanstack/react-query-next-experimental

npm i https://pkg.pr.new/@tanstack/react-query-next-experimental@8720

@tanstack/react-query-persist-client

npm i https://pkg.pr.new/@tanstack/react-query-persist-client@8720

@tanstack/solid-query

npm i https://pkg.pr.new/@tanstack/solid-query@8720

@tanstack/solid-query-devtools

npm i https://pkg.pr.new/@tanstack/solid-query-devtools@8720

@tanstack/solid-query-persist-client

npm i https://pkg.pr.new/@tanstack/solid-query-persist-client@8720

@tanstack/svelte-query-devtools

npm i https://pkg.pr.new/@tanstack/svelte-query-devtools@8720

@tanstack/svelte-query

npm i https://pkg.pr.new/@tanstack/svelte-query@8720

@tanstack/svelte-query-persist-client

npm i https://pkg.pr.new/@tanstack/svelte-query-persist-client@8720

@tanstack/vue-query

npm i https://pkg.pr.new/@tanstack/vue-query@8720

@tanstack/vue-query-devtools

npm i https://pkg.pr.new/@tanstack/vue-query-devtools@8720

commit: 0156811

Comment on lines 411 to 416
queryFn: () => sleep(300).then(() => 'data'),
})
expect(queryClient.isFetching()).toBe(1)
queryClient.prefetchQuery({
queryKey: key2,
queryFn: () => sleep(200).then(() => 'data'),
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

since we use real timers per default, please keep those times short (5ms and 10ms at most), or use fake timers and advance them how you want.

Copy link
Collaborator

@TkDodo TkDodo left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

now that I think about it, we’re actually having problems with these kinds of tests, as they tend to be pretty flaky (see useIsFetching). The reason is probably batching, and how much power the machine has / how much work it has to do, so it appears often in CI that updates are batched together.

using fake timers is better (we have an example for that in the code-base somewhere, too)

@manudeli
Copy link
Contributor Author

now that I think about it, we’re actually having problems with these kinds of tests, as they tend to be pretty flaky (see useIsFetching). The reason is probably batching, and how much power the machine has / how much work it has to do, so it appears often in CI that updates are batched together.

using fake timers is better (we have an example for that in the code-base somewhere, too)

I agree, thanks for feedback!👍

@manudeli manudeli requested a review from TkDodo February 28, 2025 17:20
Copy link

codecov bot commented Feb 28, 2025

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 63.15%. Comparing base (2bf7ec6) to head (0156811).
Report is 2 commits behind head on main.

Additional details and impacted files

Impacted file tree graph

@@             Coverage Diff             @@
##             main    #8720       +/-   ##
===========================================
+ Coverage   46.31%   63.15%   +16.83%     
===========================================
  Files         199      135       -64     
  Lines        7552     4855     -2697     
  Branches     1731     1368      -363     
===========================================
- Hits         3498     3066      -432     
+ Misses       3674     1544     -2130     
+ Partials      380      245      -135     
Components Coverage Δ
@tanstack/angular-query-devtools-experimental ∅ <ø> (∅)
@tanstack/angular-query-experimental 88.65% <ø> (ø)
@tanstack/eslint-plugin-query ∅ <ø> (∅)
@tanstack/query-async-storage-persister 43.85% <ø> (ø)
@tanstack/query-broadcast-client-experimental ∅ <ø> (∅)
@tanstack/query-codemods ∅ <ø> (∅)
@tanstack/query-core 94.19% <ø> (+0.11%) ⬆️
@tanstack/query-devtools 4.78% <ø> (ø)
@tanstack/query-persist-client-core 57.73% <ø> (ø)
@tanstack/query-sync-storage-persister 84.61% <ø> (ø)
@tanstack/react-query 95.09% <ø> (ø)
@tanstack/react-query-devtools 10.00% <ø> (ø)
@tanstack/react-query-next-experimental ∅ <ø> (∅)
@tanstack/react-query-persist-client 100.00% <ø> (ø)
@tanstack/solid-query 78.20% <ø> (ø)
@tanstack/solid-query-devtools ∅ <ø> (∅)
@tanstack/solid-query-persist-client 100.00% <ø> (ø)
@tanstack/svelte-query 87.33% <ø> (ø)
@tanstack/svelte-query-devtools ∅ <ø> (∅)
@tanstack/svelte-query-persist-client 100.00% <ø> (ø)
@tanstack/vue-query 71.01% <ø> (ø)
@tanstack/vue-query-devtools ∅ <ø> (∅)

@manudeli
Copy link
Contributor Author

now that I think about it, we’re actually having problems with these kinds of tests, as they tend to be pretty flaky (see useIsFetching). The reason is probably batching, and how much power the machine has / how much work it has to do, so it appears often in CI that updates are batched together.

using fake timers is better (we have an example for that in the code-base somewhere, too)

I reflected your review

Copy link
Collaborator

@TkDodo TkDodo left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

please move this to beforeAll / afterAll in the describe block:

beforeAll(() => {
  vi.useFakeTimers()
})

afterAll(() => {
  vi.useRealTimers()
})

otherwise, if the test fails, fake timers will be on and it will likely fail all other tests, which can be difficult to debug.

@manudeli
Copy link
Contributor Author

manudeli commented Mar 1, 2025

please move this to beforeAll / afterAll in the describe block:

beforeAll(() => {
  vi.useFakeTimers()
})

afterAll(() => {
  vi.useRealTimers()
})

otherwise, if the test fails, fake timers will be on and it will likely fail all other tests, which can be difficult to debug.

I reflect your review now in 0156811
I didn't know about fake timer. I think it's a really good feature. I'll be using it a lot in the future. Thanks for letting me know.

@manudeli manudeli requested a review from TkDodo March 1, 2025 06:18
Copy link
Collaborator

@TkDodo TkDodo left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Oh, I thought you would limit it to the describe('isFetching', () => { block, not the whole file 😅 . But this is great - we want to move everything to fake timers anyways, as they are faster and more reliable

@TkDodo TkDodo merged commit 5babd11 into TanStack:main Mar 1, 2025
8 of 9 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants