[vue-query] `Devtools is not mounted` with `@vue/server-renderer@3.5.31` while SSR

[n0099]

Describe the bug

Due to renderToString() of @vue/server-renderer now will invoke cleanupContext(): https://github.com/vuejs/core/blame/fa23116437250b3fdec41112f276211cb284136e/packages/server-renderer/src/renderToString.ts#L98 that introduced in vuejs/core#14548,

query/packages/query-devtools/src/TanstackQueryDevtools.tsx

Line 153 in 67b12ae

throw new Error('Devtools is not mounted')

will always get thrown.

Your minimal, reproducible example

https://stackblitz.com/edit/tanstack-query-vodk6pjy?file=src%2FApp.vue

Steps to reproduce

1. Open the preview of port 3000.
2. Checkout the console of browser's devtools.

3. Uncaught (in promise) Error: Devtools is not mounted
     unmount @tanstack_vue-query-devtools.js:157
     setup @tanstack_vue-query-devtools.js:350
     stop chunk-6BD2MEKE.js:483
     cleanupContext @vue_server-renderer.js:598
     renderToString @vue_server-renderer.js:949
     setup App.vue:13
     createHook chunk-6BD2MEKE.js:5324
     callWithErrorHandling chunk-6BD2MEKE.js:2412
     callWithAsyncErrorHandling chunk-6BD2MEKE.js:2419
     __weh chunk-6BD2MEKE.js:5304
     flushPostFlushCbs chunk-6BD2MEKE.js:2597
     render2 chunk-6BD2MEKE.js:9042
     mount chunk-6BD2MEKE.js:6466
     mount chunk-6BD2MEKE.js:12725
     <anonymous> main.ts:5

Expected behavior

Not throwing.

How often does this bug happen?

Every time

Screenshots or Videos

No response

Platform

• OS: NixOS
• Browser: Firefox
• Version: 148

Tanstack Query adapter

vue-query

TanStack Query version

5.96.1

TypeScript version

5.8.3

Additional context

No response

[n0099]

A workaround in Nuxt is wrapping <VueQueryDevtools> inside <ClientOnly> so skipping render it while SSR.

[n0099]

Upstream has been reverted: vuejs/core#14674 due to vuejs/core#14548 (comment), so updating @vue/server-renderer also fixes this.