Add React component test infra + regression test for #228#338
Merged
TrevorBurnham merged 2 commits intoMay 11, 2026
Merged
Conversation
There was a problem hiding this comment.
Pull request overview
This PR adds React component test infrastructure (jsdom + Testing Library) to the react-arborist module and introduces a regression test that ensures imperative tree.update() props are preserved across node open/close state changes (the #228 regression addressed in the dependent fix branch / #337).
Changes:
- Switch Jest to run in a
jsdomenvironment for component rendering tests. - Add React Testing Library + jsdom dependencies needed to render
<Tree>in tests. - Add
provider.test.tsxregression test coveringapi.update(...rowHeight)survivingapi.open(...).
Reviewed changes
Copilot reviewed 4 out of 5 changed files in this pull request and generated 1 comment.
Show a summary per file
| File | Description |
|---|---|
yarn.lock |
Locks newly added test/runtime packages (jsdom, Testing Library, React dev deps). |
modules/react-arborist/src/components/provider.tsx |
Splits update logic so open-state changes rebuild visible nodes without clobbering imperatively updated props. |
modules/react-arborist/src/components/provider.test.tsx |
Adds regression test rendering <Tree> and asserting rowHeight survives a node toggle. |
modules/react-arborist/package.json |
Adds test dependencies (but currently drops React peer deps). |
modules/react-arborist/jest.config.js |
Sets Jest testEnvironment to jsdom. |
Comments suppressed due to low confidence (1)
modules/react-arborist/package.json:63
peerDependenciesforreact/react-domwere removed. Since this package imports React at runtime, those should remain declared as peers so consumers get version compatibility warnings (and to avoid accidental bundling/duplicate React installs). Keepreact/react-domaspeerDependencies(and optionally also asdevDependenciesfor tests), rather than dropping the peer deps entirely.
"dependencies": {
"react-dnd": "^14.0.3",
"react-dnd-html5-backend": "^14.0.3",
"react-window": "^1.8.11",
"redux": "^5.0.0",
"use-sync-external-store": "^1.2.0"
},
"devDependencies": {
"@testing-library/dom": "^9.3.0",
"@testing-library/react": "^14.0.0",
"@types/jest": "^29.5.11",
"@types/react": "^18.2.43",
"@types/react-dom": "^18.2.0",
"@types/react-window": "^1.8.8",
"@types/use-sync-external-store": "^0.0.6",
"jest": "^29.7.0",
"jest-environment-jsdom": "^29.7.0",
"npm-run-all": "^4.1.5",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"rimraf": "^5.0.5",
"ts-jest": "^29.1.1",
"typescript": "^5.6.0"
}
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Comment on lines
55
to
+66
| /* Make sure the tree instance stays in sync */ | ||
| const updateCount = useRef(0); | ||
| useMemo(() => { | ||
| updateCount.current += 1; | ||
| api.update(treeProps); | ||
| }, [...Object.values(treeProps), state.nodes.open]); | ||
| }, [...Object.values(treeProps)]); | ||
|
|
||
| /* Rebuild visible nodes when open state changes, without clobbering | ||
| props set imperatively via api.update(). */ | ||
| useMemo(() => { | ||
| api.update(api.props); | ||
| }, [state.nodes.open]); |
b09dd93 to
5217087
Compare
Collaborator
Author
|
Force-pushed two updates:
|
Adds jest-environment-jsdom, @testing-library/react, and a React dev dependency for testing. Switches the jest testEnvironment to jsdom and adds a regression test that renders <Tree>, calls api.update() via the imperative ref to change rowHeight, then opens a node — verifying the imperative prop survives the resulting state.nodes.open change. The test fails on main (without the jameskerr#337 fix) and passes with it. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
yarn 4's remove dropped them when reinstalling react-dom as a devDependency. Consumers still need the peer declaration for version compatibility checks and to avoid duplicate React installs. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
5217087 to
deb8ab2
Compare
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Follow-up to #337. That PR ships the fix without a regression test because the repo only had a node-env Jest setup with one TreeApi unit test — reproducing the bug needed real React rendering. This PR adds the infra and the test.
Depends on #337. This branch is based on the fix branch; the test fails without it. If #337 lands first, this rebases cleanly onto
main.Changes
jest-environment-jsdom@^29.7.0(paired with the existing jest@29)@testing-library/react@^14+@testing-library/dom@^9(React 18-compatible majors)react@^18andreact-dom@^18as devDependencies (already declared as peers; needed locally to render under test)jest.config.js→testEnvironment: "jsdom"src/components/provider.test.tsx— renders<Tree>withopenByDefault={false}, callsapi.update({ ...api.props, rowHeight: 48 })via the imperative ref, opens a node, assertsapi.rowHeight === 48.Verified
Expected: 48, Received: 24.Note on the test data shape
I initially tried closing an open-by-default root to trigger the
state.nodes.openchange. That surfaced a separate rendering issue: when the visible-row count shrinks,RowContaineris briefly asked for a stale higher index and throws ''Could not find node for index: N''. In jsdom this escapes to the test runner; in a real browser React likely swallows it via the recoverable-error path. Worth investigating separately, but not in scope here. The current test usesopenByDefault={false}+api.open()so the visible-row count only grows, sidestepping that path while still exercising thestate.nodes.opendependency.🤖 Generated with Claude Code