fix: make sure queries with only inactive observers are also invalidated (#949)

Author: boschni

src/core/query.ts

@@ -133,7 +133,11 @@ export class Query<TResult, TError> {
 
   private dispatch(action: Action<TResult, TError>): void {
     this.state = queryReducer(this.state, action)
-    this.observers.forEach(d => d.onQueryUpdate(this.state, action))
+
+    this.observers.forEach(observer => {
+      observer.onQueryUpdate(this.state, action)
+    })
+
     this.notifyGlobalListeners(this)
   }
 

src/core/queryCache.ts

@@ -92,7 +92,9 @@ export class QueryCache {
       0
     )
 
-    this.globalListeners.forEach(d => d(this, query))
+    this.globalListeners.forEach(listener => {
+      listener(this, query)
+    })
   }
 
   getDefaultConfig() {
@@ -193,14 +195,10 @@ export class QueryCache {
     try {
       await Promise.all(
         this.getQueries(predicate, options).map(query => {
-          if (query.observers.length) {
-            if (refetchActive && query.isEnabled()) {
-              return query.fetch()
-            }
-          } else {
-            if (refetchInactive) {
-              return query.fetch()
-            }
+          const enabled = query.isEnabled()
+
+          if ((enabled && refetchActive) || (!enabled && refetchInactive)) {
+            return query.fetch()
           }
 
           return undefined

src/react/tests/useQuery.test.tsx

@@ -356,6 +356,56 @@ describe('useQuery', () => {
     return null
   })
 
+  it.only('should update disabled query when updated with invalidateQueries', async () => {
+    const key = queryKey()
+    const states: QueryResult<number>[] = []
+    let count = 0
+
+    function Page() {
+      const state = useQuery(
+        key,
+        async () => {
+          await sleep(10)
+          count++
+          return count
+        },
+        { enabled: false }
+      )
+
+      states.push(state)
+
+      React.useEffect(() => {
+        setTimeout(() => {
+          queryCache.invalidateQueries(key, { refetchInactive: true })
+        }, 20)
+      }, [])
+
+      return null
+    }
+
+    render(<Page />)
+
+    await waitFor(() => expect(states.length).toBe(3))
+
+    expect(states).toMatchObject([
+      {
+        data: undefined,
+        isFetching: false,
+        isSuccess: false,
+      },
+      {
+        data: undefined,
+        isFetching: true,
+        isSuccess: false,
+      },
+      {
+        data: 1,
+        isFetching: false,
+        isSuccess: true,
+      },
+    ])
+  })
+
   it('should keep the previous data when keepPreviousData is set', async () => {
     const key = queryKey()
     const states: QueryResult<number>[] = []