fix: make sure all options of a query are reactive

packages/query-core/src/query.ts

@@ -169,7 +169,7 @@ export class Query<
 
     this.#abortSignalConsumed = false
     this.#defaultOptions = config.defaultOptions
-    this.#setOptions(config.options)
+    this.setOptions(config.options)
     this.#observers = []
     this.#cache = config.cache
     this.queryKey = config.queryKey
@@ -182,7 +182,7 @@ export class Query<
     return this.options.meta
   }
 
-  #setOptions(
+  setOptions(
     options?: QueryOptions<TQueryFnData, TError, TData, TQueryKey>,
   ): void {
     this.options = { ...this.#defaultOptions, ...options }
@@ -342,15 +342,15 @@ export class Query<
 
     // Update config if passed, otherwise the config from the last execution is used
     if (options) {
-      this.#setOptions(options)
+      this.setOptions(options)
     }
 
     // Use the options from the first observer with a query function if no function is found.
     // This can happen when the query is hydrated or created with setQueryData.
     if (!this.options.queryFn) {
       const observer = this.#observers.find((x) => x.options.queryFn)
       if (observer) {
-        this.#setOptions(observer.options)
+        this.setOptions(observer.options)
       }
     }
 

packages/query-core/src/queryObserver.ts

@@ -154,6 +154,7 @@ export class QueryObserver<
     }
 
     this.#updateQuery()
+    this.#currentQuery.setOptions(this.options)
 
     if (!shallowEqualObjects(this.options, prevOptions)) {
       this.#client.getQueryCache().notify({

packages/query-core/src/tests/queryClient.test.tsx

@@ -941,11 +941,13 @@ describe('queryClient', () => {
       await queryClient.fetchQuery({ queryKey: key2, queryFn: queryFn2 })
       const observer1 = new QueryObserver(queryClient, {
         queryKey: key1,
+        queryFn: queryFn1,
         staleTime: Infinity,
         initialData: 'initial',
       })
       const observer2 = new QueryObserver(queryClient, {
         queryKey: key1,
+        queryFn: queryFn1,
         staleTime: Infinity,
         initialData: 'initial',
       })

packages/react-query/src/__tests__/useQuery.test.tsx

@@ -2435,28 +2435,23 @@ describe('useQuery', () => {
     rendered.getByText('Second Status: success')
   })
 
-  it('should not override query configuration on render', async () => {
+  it('should update query options', async () => {
     const key = queryKey()
 
-    const queryFn1 = async () => {
+    const queryFn = async () => {
       await sleep(10)
       return 'data1'
     }
 
-    const queryFn2 = async () => {
-      await sleep(10)
-      return 'data2'
-    }
-
     function Page() {
-      useQuery({ queryKey: key, queryFn: queryFn1 })
-      useQuery({ queryKey: key, queryFn: queryFn2 })
+      useQuery({ queryKey: key, queryFn, retryDelay: 10 })
+      useQuery({ queryKey: key, queryFn, retryDelay: 20 })
       return null
     }
 
     renderWithClient(queryClient, <Page />)
 
-    expect(queryCache.find({ queryKey: key })!.options.queryFn).toBe(queryFn1)
+    expect(queryCache.find({ queryKey: key })!.options.retryDelay).toBe(20)
   })
 
   it('should batch re-renders', async () => {
@@ -3685,10 +3680,10 @@ describe('useQuery', () => {
   it('should reset failureCount on successful fetch', async () => {
     const key = queryKey()
 
-    function Page() {
-      let counter = 0
+    let counter = 0
 
-      const query = useQuery<string, Error>({
+    function Page() {
+      const query = useQuery({
         queryKey: key,
         queryFn: async () => {
           if (counter < 2) {

packages/solid-query/src/__tests__/createQuery.test.tsx

@@ -1890,22 +1890,17 @@ describe('createQuery', () => {
     rendered.getByText('Second Status: success')
   })
 
-  it('should not override query configuration on render', async () => {
+  it('should update query options', async () => {
     const key = queryKey()
 
-    const queryFn1 = async () => {
+    const queryFn = async () => {
       await sleep(10)
       return 'data1'
     }
 
-    const queryFn2 = async () => {
-      await sleep(10)
-      return 'data2'
-    }
-
     function Page() {
-      createQuery(() => ({ queryKey: key, queryFn: queryFn1 }))
-      createQuery(() => ({ queryKey: key, queryFn: queryFn2 }))
+      createQuery(() => ({ queryKey: key, queryFn, retryDelay: 10 }))
+      createQuery(() => ({ queryKey: key, queryFn, retryDelay: 20 }))
       return null
     }
 
@@ -1915,7 +1910,7 @@ describe('createQuery', () => {
       </QueryClientProvider>
     ))
 
-    expect(queryCache.find({ queryKey: key })!.options.queryFn).toBe(queryFn1)
+    expect(queryCache.find({ queryKey: key })!.options.retryDelay).toBe(20)
   })
 
   it('should batch re-renders', async () => {