search

lukasbach / react-complex-tree

Unopinionated Accessible Tree Component with Multi-Select and Drag-And-Drop
https://rct.lukasbach.com
MIT License
952 stars 77 forks source link

Search input renderer for Blueprints.js broke #197

Closed dlech closed 1 year ago

dlech commented 1 year ago

Typing to trigger the search crashes at runtime with:

Uncaught TypeError: el.focus is not a function
    at ref (SearchInput.js:72:1)
    at commitAttachRef (react-dom.development.js:20023:1)
    at commitLayoutEffects (react-dom.development.js:22808:1)
    at HTMLUnknownElement.callCallback (react-dom.development.js:188:1)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:237:1)
    at invokeGuardedCallback (react-dom.development.js:292:1)
    at commitRootImpl (react-dom.development.js:22541:1)
    at unstable_runWithPriority (scheduler.development.js:653:1)
    at runWithPriority$1 (react-dom.development.js:11039:1)
    at commitRoot (react-dom.development.js:22381:1)

So I suppose this could just be a bug and may not be a React version compatibility issue.

Originally posted by @dlech in https://github.com/lukasbach/react-complex-tree/issues/196#issuecomment-1356330898

dlech commented 1 year ago

This happens because the SearchInput rendered now provides a ref property in inputProps. This is passed to the Blueprints.js InputGroup component. However, the ref property of the InputGroup component is for the React component, not the underlying HTML element. Since the InputGroup component doesn't have a focus method, it triggers the crash.

lukasbach commented 1 year ago

Thanks a lot for your contribution! The fix is deployed as of 2.0.1.