fix(query): make sure prefetched queries can be garbage collected (TanStack#3007)

Author: TkDodo

src/core/query.ts

@@ -163,9 +163,11 @@ export class Query<
   private observers: QueryObserver<any, any, any, any, any>[]
   private defaultOptions?: QueryOptions<TQueryFnData, TError, TData, TQueryKey>
   private abortSignalConsumed: boolean
+  private hadObservers: boolean
 
   constructor(config: QueryConfig<TQueryFnData, TError, TData, TQueryKey>) {
     this.abortSignalConsumed = false
+    this.hadObservers = false
     this.defaultOptions = config.defaultOptions
     this.setOptions(config.options)
     this.observers = []
@@ -175,6 +177,7 @@ export class Query<
     this.initialState = config.state || this.getDefaultState(this.options)
     this.state = this.initialState
     this.meta = config.meta
+    this.scheduleGc()
   }
 
   private setOptions(
@@ -215,7 +218,9 @@ export class Query<
   private optionalRemove() {
     if (!this.observers.length) {
       if (this.state.isFetching) {
-        this.scheduleGc()
+        if (this.hadObservers) {
+          this.scheduleGc()
+        }
       } else {
         this.cache.remove(this)
       }
@@ -321,6 +326,7 @@ export class Query<
   addObserver(observer: QueryObserver<any, any, any, any, any>): void {
     if (this.observers.indexOf(observer) === -1) {
       this.observers.push(observer)
+      this.hadObservers = true
 
       // Stop the query from being garbage collected
       this.clearGcTimeout()

src/core/tests/queryClient.test.tsx

@@ -544,6 +544,21 @@ describe('queryClient', () => {
 
       consoleMock.mockRestore()
     })
+
+    test('should be garbage collected after cacheTime if unused', async () => {
+      const key = queryKey()
+
+      await queryClient.prefetchQuery(
+        key,
+        async () => {
+          return 'data'
+        },
+        { cacheTime: 10 }
+      )
+      expect(queryCache.find(key)).toBeDefined()
+      await sleep(15)
+      expect(queryCache.find(key)).not.toBeDefined()
+    })
   })
 
   describe('removeQueries', () => {