Hacktoberfest 2026: le issue che i maintainer hanno segnato per ottobre, aperte e adatte ai principianti. Sfoglia le issue Hacktoberfest

Tree crashes on mount with `Cannot read properties of null (reading 'scrollTo')` when a node title contains an autoFocus input

Aperta
#1,068 1 commento 0 reazioni 0 assegnatari Vedi su GitHub

Nessuno ha ancora preso questa issue.

Valutazione

Difficoltà
2/5
Tempo stimato
1-3 ore
Idoneità per principianti
55/100
Tipo di issue
Bug
Chiarezza
Specificata chiaramente
Stato di attività
Attiva
Stack tecnologico
react, typescript
Ambito
frontend, testing-qa

Direzione di ricerca

Inizia in Tree.js, su Tree.scrollTo, e segui il ciclo di vita delle ref di NodeList descritto nell’issue. Usa la riproduzione di autoFocus fornita come prima verifica, poi esegui o aggiungi il test di regressione menzionato; il lavoro è completato quando il primo mount non va più in crash e il test copre questo caso.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

What happened

We render an inline editor (a text input with autoFocus) inside a tree node's title — a common inline-rename pattern. Mounting the tree crashes the entire React root:

TypeError: Cannot read properties of null (reading 'scrollTo')
    at Tree.scrollTo (Tree.js)

Because the error is thrown from React's focus event dispatch during the commit, it escapes any local error handling and unmounts the whole application root, not just the tree. We hit this in production via antd's Tree, which wraps this package; TreeSelect and Cascader share the same code path.

Reproduction
import Tree from '@rc-component/tree';

// Mounting this crashes the React root:
<Tree treeData={[{ key: 'a', title: <input autoFocus /> }]} />
  1. Render a Tree where any node's title contains an element with autoFocus (or anything that focuses inside a row during the commit).
  2. The input's focus bubbles to the tree container, the tree's focus activation runs scrollTo, and listRef.current is null at that moment → crash.
Why the ref is null

NodeList's useImperativeHandle has no dependency array, so on every commit the handle is detached during the mutation phase and re-attached in the layout phase. autoFocus focuses the input between those two, so the bubbled focus-activation dereferences a null listRef. First mount is the simplest trigger, but any re-render has the same window.

Versions
  • @rc-component/tree 1.2.4 → 1.5.0 (current) — call sites unguarded in all
  • React 19, reproduced in jsdom and real browsers
Fix

Proposed in #1067 — optional chaining on the two listRef.current.scrollTo call sites, plus a regression test that reproduces the crash on first mount.

Lingua principale
TypeScript
Stelle
1.3k
Fork
490
Merge medio
3g 17h
PR unite (30g)
5

Guida per i contributori

Nessuna guida per i contributori indicizzata per questo repository

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di react-component/tree

Tutte le issue di react-component/tree

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.