Bug: Dependent Query doesn't work with solid-js SSR
メンテナーはふだん 1 日以内に返信
@ardeora がすでに取り組んでいます。
2024年6月4日 から。
評価
この issue はまだ評価されていません。
説明
Describe the bug
In the Tanstack documentation there is a section about dependent queries: https://tanstack.com/query/latest/docs/framework/react/guides/dependent-queries
The example suggest that you should use enable to create dependent queries. The problem when using enable is that when it is disabled it doesn't suspend the current context and therefore doesn't fetch on the server.
Your minimal, reproducible example
https://codesandbox.io/p/github/BierDav/temp-tanstack-query-ssr-bug/master?import=true
Steps to reproduce
- Open codesandbox
- Run ´pnpm dev`
- Open the preview
- Now the server waits for 2 seconds before responding because of the
timoutquery insrc/routs/index.tsx, but the moment it finishes it doesn't care about the second query getting enabed and returning it immediately to the browser. - This causes that the client has to fetch the remaining
statequery. You can see that in the dev tools:
Expected behavior
The expected behavior would be that both queries are beeing evaluated before the server sends its initial response. But I don't know if this is even possible with this syntax from a technical perspective.
How often does this bug happen?
Every time
Screenshots or Videos
import { createQuery } from "@tanstack/solid-query";
export default function () {
const timeout = createQuery(() => ({
queryKey: ["timeout"],
queryFn: () =>
new Promise((resolve) => setTimeout(() => resolve("test"), 2000)),
}));
const state = createQuery(() => ({
queryKey: ["realQuery"],
queryFn: async () => {
const resp = await fetch("https://api.sampleapis.com/switch/games");
console.log("fetched");
return await resp.json();
},
enabled: !!timeout.data,
}));
return <>{JSON.stringify(state.data?.[0])}</>;
}
Platform
- Windows
- Node v21.7.3
- Chrome
Tanstack Query adapter
solid-query
TanStack Query version
v5.40.0
TypeScript version
No response
Additional context
No response
- 主要言語
- TypeScript
- スター
- 50.4k
- フォーク
- 4.2k
- 平均マージ
- 13時間 33分
- マージ済み PR（30日）
- 383
環境構築
- Dockerfile・Docker Compose ファイルなし
- プルリクエストのテンプレートあり
- コントリビューションガイドを読む
はじめの一歩
- issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
- 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
- リポジトリをフォークし、ブランチを切って変更します。
- issue 番号を参照したプルリクエストを送ります。
TanStack/query のほかの issue
-
[angular-query] injectDevtoolsPanel doesn't support the 'theme' option対応中かも @benjavicente が 1 日前に担当しました。 オープンpackage: angular-query-devtools
難易度 2/5 1〜3時間 初心者へのやさしさ 76/100
TanStack/query#11680 · 担当者 1 名 ·
メンテナーはふだん 1 日以内に返信
-
solid-query: STRICT_READ_UNTRACKED on Solid 2 — client()/options() read in component body (useMutation, useBaseQuery)再び着手できるかも このイシューのプルリクエストはマージされずにクローズされました。 オープン
難易度 2/5 1〜3時間 初心者へのやさしさ 84/100
TanStack/query#11358 · コメント 2 件 · リアクション 1 件 ·
メンテナーはふだん 1 日以内に返信
-
solid-query: switching the queryClient accessor strands the new client's cache (subscription stays on the old observer)対応中かも @MaNaN1803 が 73 日前に担当しました。 オープン
難易度 2/5 1〜3時間 初心者へのやさしさ 84/100
TanStack/query#11106 · コメント 1 件 ·
メンテナーはふだん 1 日以内に返信
-
setQueryData: NoInfer loses discriminated-union members when spreading a narrowed updater valueオープン
難易度 4/5 3〜5日 初心者へのやさしさ 55/100
メンテナーはふだん 1 日以内に返信
-
難易度 4/5 3〜5日 初心者へのやさしさ 68/100
TanStack/query#11794 · コメント 1 件 ·
メンテナーはふだん 1 日以内に返信
似ている issue
-
check:passed streams:add
難易度 2/5 1〜3時間 初心者へのやさしさ 66/100
メンテナーはふだん 1 日以内に返信
-
[Bug] The shared instance selector's placeholder and no-match text ignore the display language対応中かも このイシューにリンクされたプルリクエストがオープン中、またはマージ済みです。 オープン
難易度 2/5 1〜3時間 初心者へのやさしさ 90/100
apache/rocketmq-dashboard#5561 ·
メンテナーはふだん 3 日以内に返信
-
難易度 2/5 1〜3時間 初心者へのやさしさ 68/100
CopilotKit/OpenDots#69 ·
メンテナーはふだん 1 日以内に返信
-
sendDefaultPii is reported as deprecated on ReactNativeOptions although dataCollection is hiddenオープンBug React-Native Waiting for: Product Owner
難易度 2/5 1〜3時間 初心者へのやさしさ 85/100
getsentry/sentry-react-native#6830 · コメント 1 件 ·
メンテナーはふだん 1 日以内に返信
-
OSCI'26
難易度 2/5 1〜3時間 初心者へのやさしさ 68/100
GauravKarakoti/SecureFlow#1215 ·
メンテナーはふだん 1 日以内に返信