Disabled useLiveQuery fails SSR hydration with error 253
メンテナーはふだん 1 日以内に返信
評価
- 難易度
- 4/5
- 見積もり時間
- 3〜5日
- 初心者へのやさしさ
- 42/100
- issue の種類
- バグ
- 明瞭さ
- 明確に書かれている
- 活発さ
- 活発
- 技術スタック
- react, typescript, vite
調査の方向性
Start in LiveQueryObserverClient.getServerSnapshot, which calls _waitForSsrLiveQuery for a disabled query's hash even though no collection exists. Then read DbClient._setSsrStreamingEnabled, where error 253 is thrown when the stream ends early. Reproduce with the DisabledQueryRoute in examples/react/start-ssr-e2e using vite build and vite preview. Done when a disabled query hydrates with status 'disabled' and the error event no longer carries error 253.
索引モデルが issue の本文から書いたものです。
説明
- I've validated the bug against the latest version of DB packages (
mainat 15d2d2d32)
Describe the bug
In a routerWithDbClient app, hydration fails when a live query is disabled, meaning its query callback returns undefined:
TanStack DB error 253 (The DB stream ended before the server-rendered query snapshot arrived.)
at DbClient._setSsrStreamingEnabled
React reports a hydration error (#422) and falls back to client rendering for the boundary. This happens in both dev and production builds.
Cause
A disabled query has no collection, so the server never captures or streams a record for it. LiveQueryObserverClient.getServerSnapshot still calls _waitForSsrLiveQuery(queryHash, true) for its hash. While the DB stream is open, the hydration read suspends. When the stream ends, it throws 253.
To Reproduce
In examples/react/start-ssr-e2e, add a route:
function DisabledQueryRoute() {
const [id] = React.useState<string | undefined>(undefined)
const { status } = useLiveQuery({
query: (q) => (id === undefined ? undefined : q.from({ todo: ssrTodoCollection })),
})
return <span>{status}</span>
}
Load the route with vite build && vite preview or with vite dev. The error event's cause chain contains error 253.
Expected behavior
A disabled query hydrates as status: 'disabled'. It should not wait for a record that the server never sends.
Additional context
Versions: @tanstack/db / @tanstack/react-db 1.0.0-rc.1.1, @tanstack/react-router-with-db 1.0.0-rc.1, React 19, Chromium.
- 主要言語
- TypeScript
- スター
- 4k
- フォーク
- 277
- 平均マージ
- 1日 7時間
- マージ済み PR(30日)
- 191
環境構築
- Dockerfile・Docker Compose ファイルなし
- プルリクエストのテンプレートあり
- コントリビューションガイドを読む
はじめの一歩
- issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
- 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
- リポジトリをフォークし、ブランチを切って変更します。
- issue 番号を参照したプルリクエストを送ります。
TanStack/db のほかの issue
-
難易度 1/5 1〜3時間 初心者へのやさしさ 88/100
メンテナーはふだん 1 日以内に返信
-
OfflineExecutor.dispose() never settles pendingTransactionPromises対応中かも @Claire-ovo が 5 日前に担当しました。 オープン
難易度 2/5 1〜3時間 初心者へのやさしさ 78/100
メンテナーはふだん 1 日以内に返信
-
難易度 2/5 1〜3時間 初心者へのやさしさ 78/100
メンテナーはふだん 1 日以内に返信
-
Two @tanstack/db tests time out under CPU load because a cold module import counts against the 5 s default timeout対応中かも @jp-knj が 4 日前に担当しました。 オープン
難易度 2/5 1〜3時間 初心者へのやさしさ 82/100
メンテナーはふだん 1 日以内に返信
-
難易度 4/5 3〜5日 初心者へのやさしさ 25/100
メンテナーはふだん 1 日以内に返信
似ている issue
-
難易度 2/5 1〜3時間 初心者へのやさしさ 72/100
メンテナーはふだん 1 日以内に返信
-
enhancement tech debt
難易度 2/5 1〜3時間 初心者へのやさしさ 78/100
メンテナーはふだん 1 日以内に返信
-
難易度 2/5 1〜3時間 初心者へのやさしさ 68/100
privatenumber/tsx#866 ·
-
難易度 2/5 1〜3時間 初心者へのやさしさ 62/100
danielmiessler/LifeOS#2533 ·
メンテナーはふだん 9 日以内に返信
-
auto:producer auto:uiux
難易度 2/5 1〜3時間 初心者へのやさしさ 78/100
fritzprix/libr-agent#2447 ·
メンテナーはふだん 1 日以内に返信