Revert "fix(vue-query): do not subscribe on server - nuxt2 memory leak fix (#5576)" (#5627)

DamianOsipiuk · web-flow · commit 3e82c581da7b · 2023-06-25T17:58:04.000+02:00
This reverts commit f16e413.
diff --git a/packages/vue-query/src/__mocks__/useQueryClient.ts b/packages/vue-query/src/__mocks__/useQueryClient.ts
@@ -1,10 +1,11 @@
 import { QueryClient } from '../queryClient'
-import { noop } from '../utils'
 
 const queryClient = new QueryClient({
   logger: {
     ...console,
-    error: noop,
+    error: () => {
+      // Noop
+    },
   },
   defaultOptions: {
     queries: { retry: false, cacheTime: Infinity },
diff --git a/packages/vue-query/src/__tests__/useQuery.test.ts b/packages/vue-query/src/__tests__/useQuery.test.ts
@@ -15,7 +15,6 @@ import {
 } from './test-utils'
 import { useQuery } from '../useQuery'
 import { parseQueryArgs, useBaseQuery } from '../useBaseQuery'
-import { noop } from '../utils'
 
 jest.mock('../useQueryClient')
 jest.mock('../useBaseQuery')
@@ -117,7 +116,9 @@ describe('useQuery', () => {
 
   test('should update query on reactive options object change', async () => {
     const spy = jest.fn()
-    const onSuccess = ref(noop)
+    const onSuccess = ref(() => {
+      // Noop
+    })
     useQuery(
       ['key6'],
       simpleFetcher,
diff --git a/packages/vue-query/src/useBaseQuery.ts b/packages/vue-query/src/useBaseQuery.ts
@@ -16,9 +16,8 @@ import type {
   QueryObserverResult,
   QueryFunction,
 } from '@tanstack/query-core'
-import { isServer } from '@tanstack/query-core'
 import { useQueryClient } from './useQueryClient'
-import { updateState, isQueryKey, cloneDeepUnref, noop } from './utils'
+import { updateState, isQueryKey, cloneDeepUnref } from './utils'
 import type { MaybeRef, WithQueryClientKey } from './types'
 import type { UseQueryOptions } from './useQuery'
 import type { UseInfiniteQueryOptions } from './useInfiniteQuery'
@@ -72,20 +71,19 @@ export function useBaseQuery<
   const observer = new Observer(queryClient, defaultedOptions.value)
   const state = reactive(observer.getCurrentResult())
 
-  const unsubscribe = ref(noop)
+  const unsubscribe = ref(() => {
+    // noop
+  })
 
   watch(
     queryClient.isRestoring,
     (isRestoring) => {
       // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
       if (!isRestoring) {
         unsubscribe.value()
-        // Nuxt2 memory leak fix - do not subscribe on server
-        if (!isServer) {
-          unsubscribe.value = observer.subscribe((result) => {
-            updateState(state, result)
-          })
-        }
+        unsubscribe.value = observer.subscribe((result) => {
+          updateState(state, result)
+        })
       }
     },
     { immediate: true },
@@ -106,7 +104,9 @@ export function useBaseQuery<
 
   const suspense = () => {
     return new Promise<QueryObserverResult<TData, TError>>((resolve) => {
-      let stopWatch = noop
+      let stopWatch = () => {
+        //noop
+      }
       const run = () => {
         if (defaultedOptions.value.enabled !== false) {
           const optimisticResult = observer.getOptimisticResult(
diff --git a/packages/vue-query/src/useIsFetching.ts b/packages/vue-query/src/useIsFetching.ts
@@ -1,10 +1,9 @@
 import { computed, unref, onScopeDispose, ref, watch } from 'vue-demi'
 import type { Ref } from 'vue-demi'
 import type { QueryKey, QueryFilters as QF } from '@tanstack/query-core'
-import { isServer } from '@tanstack/query-core'
 
 import { useQueryClient } from './useQueryClient'
-import { cloneDeepUnref, isQueryKey, noop } from './utils'
+import { cloneDeepUnref, isQueryKey } from './utils'
 import type { MaybeRef, MaybeRefDeep, WithQueryClientKey } from './types'
 
 export type QueryFilters = MaybeRefDeep<WithQueryClientKey<QF>>
@@ -24,12 +23,9 @@ export function useIsFetching(
 
   const isFetching = ref(queryClient.isFetching(filters))
 
-  // Nuxt2 memory leak fix - do not subscribe on server
-  const unsubscribe = isServer
-    ? noop
-    : queryClient.getQueryCache().subscribe(() => {
-        isFetching.value = queryClient.isFetching(filters)
-      })
+  const unsubscribe = queryClient.getQueryCache().subscribe(() => {
+    isFetching.value = queryClient.isFetching(filters)
+  })
 
   watch(
     filters,
diff --git a/packages/vue-query/src/useIsMutating.ts b/packages/vue-query/src/useIsMutating.ts
@@ -1,10 +1,9 @@
 import { computed, unref, onScopeDispose, ref, watch } from 'vue-demi'
 import type { Ref } from 'vue-demi'
 import type { MutationKey, MutationFilters as MF } from '@tanstack/query-core'
-import { isServer } from '@tanstack/query-core'
 
 import { useQueryClient } from './useQueryClient'
-import { cloneDeepUnref, isQueryKey, noop } from './utils'
+import { cloneDeepUnref, isQueryKey } from './utils'
 import type { MaybeRef, MaybeRefDeep, WithQueryClientKey } from './types'
 
 export type MutationFilters = MaybeRefDeep<WithQueryClientKey<MF>>
@@ -24,12 +23,9 @@ export function useIsMutating(
 
   const isMutating = ref(queryClient.isMutating(filters))
 
-  // Nuxt2 memory leak fix - do not subscribe on server
-  const unsubscribe = isServer
-    ? noop
-    : queryClient.getMutationCache().subscribe(() => {
-        isMutating.value = queryClient.isMutating(filters)
-      })
+  const unsubscribe = queryClient.getMutationCache().subscribe(() => {
+    isMutating.value = queryClient.isMutating(filters)
+  })
 
   watch(
     filters,
diff --git a/packages/vue-query/src/useMutation.ts b/packages/vue-query/src/useMutation.ts
@@ -16,15 +16,14 @@ import type {
   MutationObserverResult,
   MutationObserverOptions,
 } from '@tanstack/query-core'
-import { isServer } from '@tanstack/query-core'
 import type {
   WithQueryClientKey,
   MaybeRef,
   MaybeRefDeep,
   DistributiveOmit,
 } from './types'
 import { MutationObserver } from '@tanstack/query-core'
-import { cloneDeepUnref, updateState, isMutationKey, noop } from './utils'
+import { cloneDeepUnref, updateState, isMutationKey } from './utils'
 import { useQueryClient } from './useQueryClient'
 
 type MutationResult<TData, TError, TVariables, TContext> = DistributiveOmit<
@@ -155,12 +154,9 @@ export function useMutation<
   )
   const state = reactive(observer.getCurrentResult())
 
-  // Nuxt2 memory leak fix - do not subscribe on server
-  const unsubscribe = isServer
-    ? noop
-    : observer.subscribe((result) => {
-        updateState(state, result)
-      })
+  const unsubscribe = observer.subscribe((result) => {
+    updateState(state, result)
+  })
 
   const mutate = (
     variables: TVariables,
diff --git a/packages/vue-query/src/useQueries.ts b/packages/vue-query/src/useQueries.ts
@@ -1,5 +1,5 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
-import { isServer, QueriesObserver } from '@tanstack/query-core'
+import { QueriesObserver } from '@tanstack/query-core'
 import {
   computed,
   onScopeDispose,
@@ -13,7 +13,7 @@ import type { Ref } from 'vue-demi'
 import type { QueryFunction, QueryObserverResult } from '@tanstack/query-core'
 
 import { useQueryClient } from './useQueryClient'
-import { cloneDeepUnref, noop } from './utils'
+import { cloneDeepUnref } from './utils'
 import type { UseQueryOptions } from './useQuery'
 import type { QueryClient } from './queryClient'
 
@@ -175,19 +175,18 @@ export function useQueries<T extends any[]>({
   const observer = new QueriesObserver(queryClient, defaultedQueries.value)
   const state = reactive(observer.getCurrentResult())
 
-  const unsubscribe = ref(noop)
+  const unsubscribe = ref(() => {
+    // noop
+  })
 
   watch(
     queryClient.isRestoring,
     (isRestoring) => {
       if (!isRestoring) {
         unsubscribe.value()
-        // Nuxt2 memory leak fix - do not subscribe on server
-        if (!isServer) {
-          unsubscribe.value = observer.subscribe((result) => {
-            state.splice(0, result.length, ...result)
-          })
-        }
+        unsubscribe.value = observer.subscribe((result) => {
+          state.splice(0, result.length, ...result)
+        })
         // Subscription would not fire for persisted results
         state.splice(
           0,
diff --git a/packages/vue-query/src/utils.ts b/packages/vue-query/src/utils.ts
@@ -69,7 +69,3 @@ function isPlainObject(value: unknown): value is Object {
   const prototype = Object.getPrototypeOf(value)
   return prototype === null || prototype === Object.prototype
 }
-
-export function noop(): void {
-  return undefined
-}
diff --git a/packages/vue-query/src/vueQueryPlugin.ts b/packages/vue-query/src/vueQueryPlugin.ts
@@ -3,7 +3,7 @@ import { isServer } from '@tanstack/query-core'
 import type { QueryClientConfig } from '@tanstack/query-core'
 
 import { QueryClient } from './queryClient'
-import { getClientKey, noop } from './utils'
+import { getClientKey } from './utils'
 import { setupDevtools } from './devtools/devtools'
 import type { MaybeRefDeep } from './types'
 
@@ -61,7 +61,9 @@ export const VueQueryPlugin = {
       client.mount()
     }
 
-    let persisterUnmount = noop
+    let persisterUnmount = () => {
+      // noop
+    }
 
     if (options.clientPersister) {
       client.isRestoring.value = true

Original file line number	Diff line number	Diff line change
`@@ -69,7 +69,3 @@ function isPlainObject(value: unknown): value is Object {`
`69`	`69`	`const prototype = Object.getPrototypeOf(value)`
`70`	`70`	`return prototype === null \|\| prototype === Object.prototype`
`71`	`71`	`}`
`72`		`-`
`73`		`-export function noop(): void {`
`74`		`- return undefined`
`75`		`-}`