useTreeData mutations leave stale descendants under parents keyed by 0 or an empty string

オープン
  • 何か問題がありますか？
#10,907 コメント 0 件 リアクション 0 件 担当者 0 名 GitHub で見る

メンテナーはふだん 1 日以内に返信

@raunakpandey1 がすでに取り組んでいます。

2026年11月2日 から。

  • #10908 @raunakpandey1 による — オープン

評価

難易度
2/5
見積もり時間
1〜3時間
初心者へのやさしさ
35/100
issue の種類
バグ
明瞭さ
明確に書かれている
活発さ
活発
技術スタック
react, typescript
領域
frontend

調査の方向性

The bug is in the ancestor loop of updateTree in the useTreeData hook, which uses while (node && node.parentKey) and stops at falsy keys such as 0 or ''. Read that loop and the reproduction steps, then run the hook test with a parent keyed 0 to see items diverge from getItem. Done means update, remove, insert and move keep items and getItem consistent for 0 and '' keys. A linked pull request (#10908) already exists, so check it before starting.

索引モデルが issue の本文から書いたものです。

説明

Provide a general summary of the issue here

useTreeData does not propagate mutations through a parent whose key is numeric 0 or an empty string. The returned items tree can retain an old child even though getItem reflects the mutation.

🤔 Expected Behavior?

Updating, inserting, removing, or moving descendants should update the tree for all valid string and numeric keys, including 0 and ''. The nodes reachable through items and getItem should agree.

😯 Current Behavior

With a child under a parent keyed by 0:

  • update changes the lookup entry but leaves the old value in items.
  • remove deletes the lookup entry but leaves the child in items.
  • Appending a grandchild updates the lookup entry but not the tree.
  • Moving the child to the root leaves a stale copy under its original parent.

The same behavior occurs with '', including when the parent is nested under another root.

StackBlitz Reproduction

No hosted StackBlitz is attached. This was found by source inspection and reproduced using the repository's real hook with its existing Jest/renderHook setup. A minimal component is included below so it can also be tried in an app.

🖥️ Steps to Reproduce
import {useTreeData} from 'react-stately/useTreeData';

export default function Repro() {
  let tree = useTreeData({
    initialItems: [{id: 0, children: [{id: 'child', name: 'Before'}]}]
  });

  return (
    <>
      <button onClick={() => tree.update('child', {id: 'child', name: 'After'})}>
        Update child
      </button>
      <pre>items: {tree.items[0].children[0].value.name}</pre>
      <pre>getItem: {tree.getItem('child').value.name}</pre>
    </>
  );
}

Click Update child. Expected: both outputs are After. Actual: items stays Before, while getItem becomes After. Replace 0 with '' for the string-key case.

💁 Possible Solution

The ancestor loop in updateTree uses while (node && node.parentKey), which stops at valid falsy keys. I plan to use an explicit nullish check and add regression tests for update, remove, insert, and move, checking both tree contents and lookup consistency.

🔦 Context

Discovered while auditing the public tree-data mutation API for edge cases. Numeric zero is a valid application ID; a component rendering tree.items can show stale or duplicated data after these mutations. This report is based on a local reproduction, not a claim about a production incident.

Version

Reproduced from main at 83fb30648fe0a1c463256423553d6b3a4ee2ce82 (react-stately package version 3.51.0). React 19.3.0; Jest 30 with the repository's StrictMode hook test wrapper.

What browsers are you seeing the problem on?

Other

If other, please specify.

Reproduced in Jest/jsdom; browser verification has not yet been performed.

What operating system are you using?

macOS 27.2

🧢 Your Company/Team

Independent contribution.

🕷 Tracking Issue

None.

主要言語
TypeScript
スター
16k
フォーク
1.6k
平均マージ
3日 23時間
マージ済み PR（30日）
43

環境構築

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

adobe/react-spectrum のほかの issue

adobe/react-spectrum の issue をすべて見る

似ている issue

TypeScript の issue をもっと見る

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。