diff --git a/packages/solid-query/package.json b/packages/solid-query/package.json index c8b3acd820..4b53b69970 100644 --- a/packages/solid-query/package.json +++ b/packages/solid-query/package.json @@ -70,6 +70,7 @@ }, "devDependencies": { "@solidjs/testing-library": "^0.8.10", + "@solidjs/router": "^0.15.3", "npm-run-all2": "^5.0.0", "solid-js": "^1.9.5", "tsup-preset-solid": "^2.2.0", diff --git a/packages/solid-query/src/__tests__/useQuery.test.tsx b/packages/solid-query/src/__tests__/useQuery.test.tsx index 7a1547bf45..4dd99e221c 100644 --- a/packages/solid-query/src/__tests__/useQuery.test.tsx +++ b/packages/solid-query/src/__tests__/useQuery.test.tsx @@ -2,6 +2,7 @@ import { describe, expect, expectTypeOf, it, vi } from 'vitest' import { ErrorBoundary, Match, + Suspense, Switch, createEffect, createMemo, @@ -11,6 +12,7 @@ import { } from 'solid-js' import { fireEvent, render, waitFor } from '@solidjs/testing-library' import { reconcile } from 'solid-js/store' +import { MemoryRouter, Route, createMemoryHistory } from '@solidjs/router' import { QueryCache, QueryClientProvider, keepPreviousData, useQuery } from '..' import { Blink, @@ -6045,4 +6047,79 @@ describe('useQuery', () => { await waitFor(() => rendered.getByText('Status: custom client')) }) + + // See https://github.com/tannerlinsley/react-query/issues/8469 + it('should correctly manage dependent queries', async () => { + const queryCache = new QueryCache() + const queryClient = createQueryClient({ queryCache }) + + const history = createMemoryHistory() + + const errorHandler = vi.fn<(err: unknown) => void>() + + function App() { + return ( + { + errorHandler(err) + return err.message + }} + > + + + + + + + + ) + } + + queryClient.setQueryData(['parent'], { id: 123 }) + + function Index() { + return 'Index' + } + + function Sub() { + const parent = useQuery(() => ({ + queryKey: ['parent'], + async queryFn() { + await new Promise((r) => setTimeout(r, 100)) + return { + id: 123, + } + }, + })) + + const childQuery = useQuery(() => ({ + queryKey: ['sub', parent.data?.id], + async queryFn() { + await new Promise((r) => setTimeout(r, 200)) + return Promise.resolve('child' + parent.data?.id) + }, + })) + return
{childQuery.data}
+ } + + const rendered = render(() => ( + + + + )) + + await waitFor(() => rendered.getByText('Index')) + + history.set({ + value: '/sub', + }) + + await sleep(200) + + expect(errorHandler).not.toHaveBeenCalled() + + await waitFor(() => { + expect(rendered.getByText('child123')).toBeInTheDocument() + }) + }) }) diff --git a/packages/solid-query/src/useBaseQuery.ts b/packages/solid-query/src/useBaseQuery.ts index 0b504ed0a7..d6b967831c 100644 --- a/packages/solid-query/src/useBaseQuery.ts +++ b/packages/solid-query/src/useBaseQuery.ts @@ -116,7 +116,11 @@ export function useBaseQuery< ) { type ResourceData = QueryObserverResult - const client = createMemo(() => useQueryClient(queryClient?.())) + const client = createMemo( + () => useQueryClient(queryClient?.()), + useQueryClient(queryClient?.()), + ) + const isRestoring = useIsRestoring() // There are times when we run a query on the server but the resource is never read // This could lead to times when the queryObserver is unsubscribed before the resource has loaded diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 9bd065902c..861017f6b1 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -2604,6 +2604,9 @@ importers: specifier: workspace:* version: link:../query-core devDependencies: + '@solidjs/router': + specifier: ^0.15.3 + version: 0.15.3(solid-js@1.9.5) '@solidjs/testing-library': specifier: ^0.8.10 version: 0.8.10(@solidjs/router@0.15.3(solid-js@1.9.5))(solid-js@1.9.5)