Skip to content

Commit da6fa1f

Browse files
committed
test(react-query/useQueries): add test for 'isRestoring' to cover restoring period branch
1 parent 0da627b commit da6fa1f

1 file changed

Lines changed: 124 additions & 0 deletions

File tree

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

Lines changed: 124 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@ import * as React from 'react'
1212
import { ErrorBoundary } from 'react-error-boundary'
1313
import { queryKey, sleep } from '@tanstack/query-test-utils'
1414
import {
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

Comments
 (0)