fix(QueriesObserver): fix improper sorting in QueriesObserver's #find… (#8351)

* fix(QueriesObserver): fix improper sorting in QueriesObserver's #findMatchingObservers method

This commit fixes a bug in the QueriesObserver's #findMatchingObservers. The bug is present when there are duplicate unsorted queries, for example, ['A', 'B', 'A']. The bug results in #findMatchingObservers to return the queries in sorted order, or ['A', 'A', 'B'], which results in a mismatch between Array<QueryObserverOptions> and Array<QueryObserverMatch>. This bug was introduced in 5499577

* ci: apply automated fixes

---------

Co-authored-by: Dominik Dorfmeister <[email protected]>
Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>

Author: 3 people

packages/query-core/src/__tests__/queriesObserver.test.tsx

@@ -264,4 +264,72 @@ describe('queriesObserver', () => {
     // Clean-up
     unsubscribe2()
   })
+
+  test('should handle duplicate query keys in different positions', async () => {
+    const key1 = queryKey()
+    const key2 = queryKey()
+    const queryFn1 = vi.fn().mockReturnValue(1)
+    const queryFn2 = vi.fn().mockReturnValue(2)
+
+    const observer = new QueriesObserver(queryClient, [
+      { queryKey: key1, queryFn: queryFn1 },
+      { queryKey: key2, queryFn: queryFn2 },
+      { queryKey: key1, queryFn: queryFn1 },
+    ])
+
+    const results: Array<Array<QueryObserverResult>> = []
+    results.push(
+      observer.getOptimisticResult(
+        [
+          { queryKey: key1, queryFn: queryFn1 },
+          { queryKey: key2, queryFn: queryFn2 },
+          { queryKey: key1, queryFn: queryFn1 },
+        ],
+        undefined,
+      )[0],
+    )
+
+    const unsubscribe = observer.subscribe((result) => {
+      results.push(result)
+    })
+
+    await sleep(1)
+    unsubscribe()
+
+    expect(results.length).toBe(6)
+    expect(results[0]).toMatchObject([
+      { status: 'pending', fetchStatus: 'idle', data: undefined },
+      { status: 'pending', fetchStatus: 'idle', data: undefined },
+      { status: 'pending', fetchStatus: 'idle', data: undefined },
+    ])
+    expect(results[1]).toMatchObject([
+      { status: 'pending', fetchStatus: 'fetching', data: undefined },
+      { status: 'pending', fetchStatus: 'idle', data: undefined },
+      { status: 'pending', fetchStatus: 'idle', data: undefined },
+    ])
+    expect(results[2]).toMatchObject([
+      { status: 'pending', fetchStatus: 'fetching', data: undefined },
+      { status: 'pending', fetchStatus: 'fetching', data: undefined },
+      { status: 'pending', fetchStatus: 'idle', data: undefined },
+    ])
+    expect(results[3]).toMatchObject([
+      { status: 'success', fetchStatus: 'idle', data: 1 },
+      { status: 'pending', fetchStatus: 'fetching', data: undefined },
+      { status: 'pending', fetchStatus: 'idle', data: undefined },
+    ])
+    expect(results[4]).toMatchObject([
+      { status: 'success', fetchStatus: 'idle', data: 1 },
+      { status: 'pending', fetchStatus: 'fetching', data: undefined },
+      { status: 'success', fetchStatus: 'idle', data: 1 },
+    ])
+    expect(results[5]).toMatchObject([
+      { status: 'success', fetchStatus: 'idle', data: 1 },
+      { status: 'success', fetchStatus: 'idle', data: 2 },
+      { status: 'success', fetchStatus: 'idle', data: 1 },
+    ])
+
+    // Verify that queryFn1 was only called once despite being used twice
+    expect(queryFn1).toHaveBeenCalledTimes(1)
+    expect(queryFn2).toHaveBeenCalledTimes(1)
+  })
 })

packages/query-core/src/queriesObserver.ts

@@ -240,28 +240,14 @@ export class QueriesObserver<
           observer: match,
         })
       } else {
-        const existingObserver = this.#observers.find(
-          (o) => o.options.queryHash === defaultedOptions.queryHash,
-        )
         observers.push({
           defaultedQueryOptions: defaultedOptions,
-          observer:
-            existingObserver ??
-            new QueryObserver(this.#client, defaultedOptions),
+          observer: new QueryObserver(this.#client, defaultedOptions),
         })
       }
     })
 
-    return observers.sort((a, b) => {
-      return (
-        queries.findIndex(
-          (q) => q.queryHash === a.defaultedQueryOptions.queryHash,
-        ) -
-        queries.findIndex(
-          (q) => q.queryHash === b.defaultedQueryOptions.queryHash,
-        )
-      )
-    })
+    return observers
   }
 
   #onUpdate(observer: QueryObserver, result: QueryObserverResult): void {