fix: point React 19 users at nodeRef when it is missing

[Juice-de-Orange]

Fixes #771, following the agent brief.

On React 19 without nodeRef, DraggableCore#findDOMNode() sent its hint through log, which is a no-op unless DRAGGABLE_DEBUG is set, so the first visible sign was <DraggableCore> not mounted on DragStart! on mousedown. Now each instance warns once on mount with console.warn, naming nodeRef and linking the README section (#using-noderef; the old #noderef anchor doesn't exist). When the drag start finds no node because nodeRef is missing and ReactDOM.findDOMNode is gone, the error says so and links the same section; every other case keeps the old message. React 18 still takes the findDOMNode path, so nothing changes there.

New unit tests cover the single warning (also under StrictMode), the drag start error naming nodeRef, the old error for a nodeRef that is passed but not attached, and no warning with nodeRef; the first three fail without the change. make lint, make build and make test-all pass on Node 22 (209 unit, 23 browser tests), yarn test also on Node 24. With the built UMD bundle in headless Chrome, React 18.3.1 logs and drags the same as before, and React 19.3.0 warns once, also under StrictMode.

Summary by CodeRabbit

• Bug Fixes
  • Improved compatibility with React 19 when starting a drag without a DOM node. Clear warnings and errors now explain when a nodeRef is needed.
  • Dragging with a provided nodeRef avoids the compatibility warning.

[coderabbitai]

Navigate logical layers of code changes, visualize relationships, and explore their blast radius.

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Advanced

Run ID: d5913898-f1da-4eca-8e4c-b4c82a503da5

📥 Commits

Reviewing files that changed from the base of the PR and between 40829e3 and a69a0f5.

📒 Files selected for processing (3)

• lib/DraggableCore.tsx
• test/Draggable.test.jsx
• test/DraggableCore.test.jsx

Included review availability: This review used your included allowance. Your plan provides up to 8 included reviews per hour; 7 remain after this review.

---

📝 Walkthrough

Walkthrough

DraggableCore now checks whether ReactDOM.findDOMNode is available. It warns once per instance when neither that function nor nodeRef is available, and reports a React 19-specific error if a drag starts without a usable node. Tests cover warning and error cases.

Changes

DOM lookup compatibility

Layer / File(s)	Summary
Optional lookup and missing-ref warning lib/DraggableCore.tsx, test/Draggable.test.jsx	DraggableCore checks for the optional findDOMNode function and warns once per instance when nodeRef and the legacy lookup are unavailable. Tests cover warnings during mount and StrictMode, and verify that nodeRef prevents the warning.
Drag-start missing-node errors lib/DraggableCore.tsx, test/DraggableCore.test.jsx	Drag start throws a React 19-specific error when nodeRef and findDOMNode are unavailable. An unattached nodeRef retains the existing not-mounted error. Tests cover both cases.

Priority: ➖ Normal

Estimated code review effort: 2 (Simple) | ~10 minutes

Change: Bug fix · Severity of issue fixed: Medium

Merge Risk: ⚪ Minimal · up to a69a0

No actionable merge-blocking issue is identified in the React 19 missing-node handling; the PR is mergeable after normal checks.

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title clearly describes the main change: directing React 19 users to provide nodeRef when it is missing.
Linked Issues check	✅ Passed	Issue #771 requires preventing the React 19 ReactDOM.findDOMNode runtime error. The reviewed head already guards Draggable.findDOMNode() and returns null when the function is unavailable. This p…
Out of Scope Changes check	✅ Passed	The changes stay within issue #771. The source changes handle React 19 behavior, nodeRef guidance, and the related drag-start error. The added tests verify these cases and protect React 18 compatibi…
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check. Docstring coverage is scoped to functions touched by this diff. Analyzed 0 functions across 3…

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create a new PR

• Autopilot · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

Autopilot is currently an internal CodeRabbit preview.

Warning

Some tools did not complete. Review the errors below.

🔧 ESLint

If the error stems from missing dependencies, add them to the package.json file. For unrecoverable errors (e.g., due to private dependencies), disable the tool in the CodeRabbit configuration.

lib/DraggableCore.tsx

ESLint skipped: missing config or dependency (missing-dependency). The ESLint configuration references a package that is not available in the sandbox.

test/Draggable.test.jsx

ESLint skipped: the matched ESLint configuration already failed (missing-dependency).

test/DraggableCore.test.jsx

ESLint skipped: the matched ESLint configuration already failed (missing-dependency).

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}