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

[vue-query] Computed property used as queryKey is not captured by onErrorCaptured #7899

Closed
Jak-Ch-ll opened this issue Aug 14, 2024 · 2 comments

Comments

@Jak-Ch-ll
Copy link

Jak-Ch-ll commented Aug 14, 2024

Describe the bug

When using a computed property as a queryKey and then throw an error inside of the computed property getter, the error is not caught by Vue's onErrorCaptured

Your minimal, reproducible example

https://stackblitz.com/edit/vitejs-vite-jdsdzk?file=src%2Fcomponents%2FWithQuery.vue

Steps to reproduce

  1. Open the browser console
  2. Click 'Throw with Query'
  3. The UI will not change and the error is visible in the console

Expected behavior

The error should be handled by the onErrorCaptured hook in App.vue. This happens when 'Throw without Query' is clicked.

How often does this bug happen?

Every time

Platform

  • OS: Windows, Linux
  • Browsers: Firefox Dev 130.0b4, Edge Dev 129.0.2766.0

Tanstack Query adapter

vue-query

TanStack Query version

5.51.21

Additional context

In our Nuxt application I was able to produce the error without Tanstack (similar to the 'Without Query' example), but only with a Vue version prior to 3.4.32. It could be the change vuejs/core@ee0248a that fixed that, but sadly the issue with TanStack/query remains. For some reason, I am not able to reproduce the Vue only issue in a fresh project (with a downgraded Vue version).

I did debug a bit into the whole issue and what I could find out is that different code paths happen in Vue's Runtime handleError function, because there is no instance in the TanStack version. This fits with the changes to Vues Runtime Scheduler flushJobs function made in the change vuejs/core@ee0248a mentioned above. Basically TanStack seems to be doing something different which makes it so, created jobs are missing the instance. But why is above my capabilities.

@Jak-Ch-ll Jak-Ch-ll changed the title [vue-query] Computed property does not trigger onErrorCaptured [vue-query] Computed property used as queryKey is not captured by onErrorCaptured Aug 14, 2024
@Jak-Ch-ll
Copy link
Author

Since opening the ticket, I had the idea to test the behavior with Vue's watch, because that is what is used under the hood by TanStack, and lo and behold, with that one I am able to reproduce the same error. I will open a ticket with Vue and close this one with a reference

@Jak-Ch-ll
Copy link
Author

Jak-Ch-ll commented Aug 15, 2024

Opened vuejs/core#11624 instead

@Jak-Ch-ll Jak-Ch-ll closed this as not planned Won't fix, can't repro, duplicate, stale Aug 15, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant