fix[devtools]: gracefully handle missing nodes in TREE_OPERATION_REMOVE instead of crashing#36475
Conversation
…VE instead of crashing When React re-renders components quickly (e.g., scrolling), tree operations can arrive out of order, causing TREE_OPERATION_REMOVE to try removing a node or referencing a parent that was already removed. The previous code called _throwAndEmitError which crashes the entire DevTools extension. This fix replaces the crash with a graceful skip: - Log a warning only in debug builds - Use 'continue' instead of 'break' to process remaining operations Fixes facebook#33738, facebook#25884
|
Hi @MD-Mushfiqur123! Thank you for your pull request and welcome to our community. Action RequiredIn order to merge any pull request (code, docs, etc.), we require contributors to sign our Contributor License Agreement, and we don't seem to have one on file for you. ProcessIn order for us to review and merge your suggested changes, please sign at https://code.facebook.com/cla. If you are contributing on behalf of someone else (eg your employer), the individual CLA may not be sufficient and your employer may need to sign the corporate CLA. Once the CLA is signed, our tooling will perform checks and validations. Afterwards, the pull request will be tagged with If you have received this in error or have any questions, please contact us at cla@meta.com. Thanks! |
|
Thank you for signing our Contributor License Agreement. We can now accept your code for this (and any) Meta Open Source project. Thanks! |
|
Thank you for signing our Contributor License Agreement. We can now accept your code for this (and any) Meta Open Source project. Thanks! |
Summary
When React re-renders components quickly (e.g., during scrolling or rapid state updates), DevTools tree operations can arrive out of order. This causes
TREE_OPERATION_REMOVEto either:The previous code called
this._throwAndEmitError()which crashes the entire DevTools extension and shows an error overlay. This fix gracefully handles these race conditions by logging a warning (debug builds only) and skipping to the next operation.Changes
In
packages/react-devtools-shared/src/devtools/store.js:_throwAndEmitError(Error(...))+breakif (__DEBUG__) { console.warn(...) }+continueKey design decisions:
continueinstead ofbreak: If one node in a batch is already gone, we should still process the rest of the batch__DEBUG__guard: Warnings only in debug builds; production silently handles the race conditionRelated Issues
Fixes #33738, #25884
Test Plan