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

fix(vue-query): avoid use sync for watch that cause unnecessary requests #8443

Merged
merged 3 commits into from
Jan 4, 2025

Conversation

Mini-ghost
Copy link
Contributor

@Mini-ghost Mini-ghost commented Dec 16, 2024

Linked issue

Description

In PR #7942, attempting to change watch's { flush: 'sync' } to { flush: 'post' } or removing it might lead to the same issues as #5910 and #5996.

This PR removes { flush: 'sync' } and ensures proper handling of refresh to prevent the issue in #5910 where queryKey retrieves stale data.

If there are any considerations I may have missed, please kindly let me know. Thank you!

@Mini-ghost Mini-ghost changed the title fix: ensure queryKey match the current value of ref used inside fix(vue-query): ensure queryKey match the current value of ref used inside Dec 16, 2024
Copy link

nx-cloud bot commented Dec 16, 2024

View your CI Pipeline Execution ↗ for commit 0ec37c7.

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

☁️ Nx Cloud last updated this comment at 2025-01-04 13:29:50 UTC

Copy link

pkg-pr-new bot commented Dec 16, 2024

Open in Stackblitz

More templates

@tanstack/angular-query-experimental

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

@tanstack/angular-query-devtools-experimental

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

@tanstack/query-async-storage-persister

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

@tanstack/query-broadcast-client-experimental

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

@tanstack/eslint-plugin-query

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

@tanstack/query-core

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

@tanstack/query-devtools

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

@tanstack/query-persist-client-core

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

@tanstack/query-sync-storage-persister

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

@tanstack/react-query

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

@tanstack/react-query-devtools

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

@tanstack/react-query-next-experimental

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

@tanstack/react-query-persist-client

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

@tanstack/solid-query

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

@tanstack/solid-query-devtools

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

@tanstack/solid-query-persist-client

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

@tanstack/svelte-query

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

@tanstack/svelte-query-devtools

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

@tanstack/svelte-query-persist-client

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

@tanstack/vue-query

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

@tanstack/vue-query-devtools

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

commit: 0ec37c7

@Mini-ghost Mini-ghost marked this pull request as ready for review December 17, 2024 12:37
Copy link

codecov bot commented Dec 17, 2024

Codecov Report

Attention: Patch coverage is 78.57143% with 3 lines in your changes missing coverage. Please review.

Project coverage is 71.01%. Comparing base (0503282) to head (0ec37c7).
Report is 5 commits behind head on main.

Additional details and impacted files

Impacted file tree graph

@@             Coverage Diff             @@
##             main    #8443       +/-   ##
===========================================
+ Coverage   46.26%   71.01%   +24.74%     
===========================================
  Files         199       19      -180     
  Lines        7532      483     -7049     
  Branches     1720      136     -1584     
===========================================
- Hits         3485      343     -3142     
+ Misses       3668      110     -3558     
+ Partials      379       30      -349     
Components Coverage Δ
@tanstack/angular-query-devtools-experimental ∅ <ø> (∅)
@tanstack/angular-query-experimental ∅ <ø> (∅)
@tanstack/eslint-plugin-query ∅ <ø> (∅)
@tanstack/query-async-storage-persister ∅ <ø> (∅)
@tanstack/query-broadcast-client-experimental ∅ <ø> (∅)
@tanstack/query-codemods ∅ <ø> (∅)
@tanstack/query-core ∅ <ø> (∅)
@tanstack/query-devtools ∅ <ø> (∅)
@tanstack/query-persist-client-core ∅ <ø> (∅)
@tanstack/query-sync-storage-persister ∅ <ø> (∅)
@tanstack/react-query ∅ <ø> (∅)
@tanstack/react-query-devtools ∅ <ø> (∅)
@tanstack/react-query-next-experimental ∅ <ø> (∅)
@tanstack/react-query-persist-client ∅ <ø> (∅)
@tanstack/solid-query ∅ <ø> (∅)
@tanstack/solid-query-devtools ∅ <ø> (∅)
@tanstack/solid-query-persist-client ∅ <ø> (∅)
@tanstack/svelte-query ∅ <ø> (∅)
@tanstack/svelte-query-devtools ∅ <ø> (∅)
@tanstack/svelte-query-persist-client ∅ <ø> (∅)
@tanstack/vue-query 71.01% <78.57%> (-0.45%) ⬇️
@tanstack/vue-query-devtools ∅ <ø> (∅)

@Mini-ghost Mini-ghost changed the title fix(vue-query): ensure queryKey match the current value of ref used inside fix(vue-query): avoid use sync for watch that cause unnecessary requests Dec 17, 2024
@DamianOsipiuk DamianOsipiuk merged commit 3104854 into TanStack:main Jan 4, 2025
8 checks passed
@RomainLanz
Copy link

RomainLanz commented Jan 8, 2025

It seems this change might have broken useQueries.

I'll look into it further, but for now I've noticed that when a query is marked as stale and used in useQueries, it doesn't get refetched.

@RomainLanz
Copy link

Never mind, the issue was on my side. Here's a "reproduction" that can be used later to ensure everything keeps working. 👍🏻

https://codesandbox.io/p/sandbox/issue-tanstack-query-queries-y6rlg6

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.

3 participants