@@ -12,6 +12,7 @@ import * as React from 'react'
1212import { ErrorBoundary } from 'react-error-boundary'
1313import { queryKey , sleep } from '@tanstack/query-test-utils'
1414import {
15+ IsRestoringProvider ,
1516 QueryCache ,
1617 QueryClient ,
1718 queryOptions ,
@@ -1863,4 +1864,127 @@ describe('useQueries', () => {
18631864 expect ( result . length ) . toBe ( result . n )
18641865 } )
18651866 } )
1867+
1868+ it ( 'should not fetch for the duration of the restoring period when isRestoring is true' , async ( ) => {
1869+ const key1 = queryKey ( )
1870+ const key2 = queryKey ( )
1871+ const queryFn1 = vi . fn ( ( ) => sleep ( 10 ) . then ( ( ) => 'data1' ) )
1872+ const queryFn2 = vi . fn ( ( ) => sleep ( 10 ) . then ( ( ) => 'data2' ) )
1873+
1874+ function Page ( ) {
1875+ const results = useQueries ( {
1876+ queries : [
1877+ { queryKey : key1 , queryFn : queryFn1 } ,
1878+ { queryKey : key2 , queryFn : queryFn2 } ,
1879+ ] ,
1880+ } )
1881+
1882+ return (
1883+ < div >
1884+ < div data-testid = "status1" > { results [ 0 ] ?. status } </ div >
1885+ < div data-testid = "status2" > { results [ 1 ] ?. status } </ div >
1886+ < div data-testid = "fetchStatus1" > { results [ 0 ] ?. fetchStatus } </ div >
1887+ < div data-testid = "fetchStatus2" > { results [ 1 ] ?. fetchStatus } </ div >
1888+ < div data-testid = "data1" > { results [ 0 ] ?. data ?? 'undefined' } </ div >
1889+ < div data-testid = "data2" > { results [ 1 ] ?. data ?? 'undefined' } </ div >
1890+ </ div >
1891+ )
1892+ }
1893+
1894+ const rendered = renderWithClient (
1895+ queryClient ,
1896+ < IsRestoringProvider value = { true } >
1897+ < Page />
1898+ </ IsRestoringProvider > ,
1899+ )
1900+
1901+ await vi . advanceTimersByTimeAsync ( 0 )
1902+
1903+ expect ( rendered . getByTestId ( 'status1' ) ) . toHaveTextContent ( 'pending' )
1904+ expect ( rendered . getByTestId ( 'status2' ) ) . toHaveTextContent ( 'pending' )
1905+ expect ( rendered . getByTestId ( 'fetchStatus1' ) ) . toHaveTextContent ( 'idle' )
1906+ expect ( rendered . getByTestId ( 'fetchStatus2' ) ) . toHaveTextContent ( 'idle' )
1907+ expect ( rendered . getByTestId ( 'data1' ) ) . toHaveTextContent ( 'undefined' )
1908+ expect ( rendered . getByTestId ( 'data2' ) ) . toHaveTextContent ( 'undefined' )
1909+ expect ( queryFn1 ) . toHaveBeenCalledTimes ( 0 )
1910+ expect ( queryFn2 ) . toHaveBeenCalledTimes ( 0 )
1911+
1912+ await vi . advanceTimersByTimeAsync ( 11 )
1913+
1914+ expect ( rendered . getByTestId ( 'status1' ) ) . toHaveTextContent ( 'pending' )
1915+ expect ( rendered . getByTestId ( 'status2' ) ) . toHaveTextContent ( 'pending' )
1916+ expect ( rendered . getByTestId ( 'fetchStatus1' ) ) . toHaveTextContent ( 'idle' )
1917+ expect ( rendered . getByTestId ( 'fetchStatus2' ) ) . toHaveTextContent ( 'idle' )
1918+ expect ( rendered . getByTestId ( 'data1' ) ) . toHaveTextContent ( 'undefined' )
1919+ expect ( rendered . getByTestId ( 'data2' ) ) . toHaveTextContent ( 'undefined' )
1920+ expect ( queryFn1 ) . toHaveBeenCalledTimes ( 0 )
1921+ expect ( queryFn2 ) . toHaveBeenCalledTimes ( 0 )
1922+ } )
1923+
1924+ it ( 'should not fetch queries with different durations for the duration of the restoring period when isRestoring is true' , async ( ) => {
1925+ const key1 = queryKey ( )
1926+ const key2 = queryKey ( )
1927+ const queryFn1 = vi . fn ( ( ) => sleep ( 10 ) . then ( ( ) => 'data1' ) )
1928+ const queryFn2 = vi . fn ( ( ) => sleep ( 20 ) . then ( ( ) => 'data2' ) )
1929+
1930+ function Page ( ) {
1931+ const results = useQueries ( {
1932+ queries : [
1933+ { queryKey : key1 , queryFn : queryFn1 } ,
1934+ { queryKey : key2 , queryFn : queryFn2 } ,
1935+ ] ,
1936+ } )
1937+
1938+ return (
1939+ < div >
1940+ < div data-testid = "status1" > { results [ 0 ] ?. status } </ div >
1941+ < div data-testid = "status2" > { results [ 1 ] ?. status } </ div >
1942+ < div data-testid = "fetchStatus1" > { results [ 0 ] ?. fetchStatus } </ div >
1943+ < div data-testid = "fetchStatus2" > { results [ 1 ] ?. fetchStatus } </ div >
1944+ < div data-testid = "data1" > { results [ 0 ] ?. data ?? 'undefined' } </ div >
1945+ < div data-testid = "data2" > { results [ 1 ] ?. data ?? 'undefined' } </ div >
1946+ </ div >
1947+ )
1948+ }
1949+
1950+ const rendered = renderWithClient (
1951+ queryClient ,
1952+ < IsRestoringProvider value = { true } >
1953+ < Page />
1954+ </ IsRestoringProvider > ,
1955+ )
1956+
1957+ await vi . advanceTimersByTimeAsync ( 0 )
1958+
1959+ expect ( rendered . getByTestId ( 'status1' ) ) . toHaveTextContent ( 'pending' )
1960+ expect ( rendered . getByTestId ( 'status2' ) ) . toHaveTextContent ( 'pending' )
1961+ expect ( rendered . getByTestId ( 'fetchStatus1' ) ) . toHaveTextContent ( 'idle' )
1962+ expect ( rendered . getByTestId ( 'fetchStatus2' ) ) . toHaveTextContent ( 'idle' )
1963+ expect ( rendered . getByTestId ( 'data1' ) ) . toHaveTextContent ( 'undefined' )
1964+ expect ( rendered . getByTestId ( 'data2' ) ) . toHaveTextContent ( 'undefined' )
1965+ expect ( queryFn1 ) . toHaveBeenCalledTimes ( 0 )
1966+ expect ( queryFn2 ) . toHaveBeenCalledTimes ( 0 )
1967+
1968+ await vi . advanceTimersByTimeAsync ( 11 )
1969+
1970+ expect ( rendered . getByTestId ( 'status1' ) ) . toHaveTextContent ( 'pending' )
1971+ expect ( rendered . getByTestId ( 'status2' ) ) . toHaveTextContent ( 'pending' )
1972+ expect ( rendered . getByTestId ( 'fetchStatus1' ) ) . toHaveTextContent ( 'idle' )
1973+ expect ( rendered . getByTestId ( 'fetchStatus2' ) ) . toHaveTextContent ( 'idle' )
1974+ expect ( rendered . getByTestId ( 'data1' ) ) . toHaveTextContent ( 'undefined' )
1975+ expect ( rendered . getByTestId ( 'data2' ) ) . toHaveTextContent ( 'undefined' )
1976+ expect ( queryFn1 ) . toHaveBeenCalledTimes ( 0 )
1977+ expect ( queryFn2 ) . toHaveBeenCalledTimes ( 0 )
1978+
1979+ await vi . advanceTimersByTimeAsync ( 10 )
1980+
1981+ expect ( rendered . getByTestId ( 'status1' ) ) . toHaveTextContent ( 'pending' )
1982+ expect ( rendered . getByTestId ( 'status2' ) ) . toHaveTextContent ( 'pending' )
1983+ expect ( rendered . getByTestId ( 'fetchStatus1' ) ) . toHaveTextContent ( 'idle' )
1984+ expect ( rendered . getByTestId ( 'fetchStatus2' ) ) . toHaveTextContent ( 'idle' )
1985+ expect ( rendered . getByTestId ( 'data1' ) ) . toHaveTextContent ( 'undefined' )
1986+ expect ( rendered . getByTestId ( 'data2' ) ) . toHaveTextContent ( 'undefined' )
1987+ expect ( queryFn1 ) . toHaveBeenCalledTimes ( 0 )
1988+ expect ( queryFn2 ) . toHaveBeenCalledTimes ( 0 )
1989+ } )
18661990} )
0 commit comments