Bug: too hard to fix "Cannot update a component from inside the function body of a different component."
Problem
Note: React 16.13.1 fixed some cases where this was overfiring. If upgrading React and ReactDOM to 16.13.1 doesn't fix the warning, read this: https://github.com/facebook/react/issues/18178#issuecomment-595846312 ---- React version: 16.13.0 Steps To Reproduce 1. Build a time machine. 2. Go to the year 2017. 3. Build a huge application of 10K lines of code. 4. Get 80 (!) dependencies at package.json file including ones that become no longer maintained. 5. Update React to the latest version at February 27, 2020. 6. Get tons of errors that you don't know how to fix. 7. Tell your client that fixes are going to take unknown time and it's going to cost $$$ + days or weeks of investigation or we're going to get stuck with the outdated version of React and related libraries forever which will cost more $$$ but later. Being serious, the business I work for isn't interested on that at all. Obviously I'd never made it happen to get such warnings to appear if I'd get them earlier. Currently that's impossibly hard to make the errors to be fixed because I get them at many different cases and with a huge stack trace. I tried to fix at least one of the appearing errors and it already took a lot of time. I tried to debug some of used libraries but got no luck. Just one example: There we can notice the use of an outdated react-router, an outdated redux-connect (which I had to put to the project source to fix errors of outdated `componentWillReceiveProps` method), some HOCs created by r
Error Output
error or provide a simpler way to find where the error is thrown 🙏
Unverified for your environment
Select your OS to check compatibility.
1 Fix
Solution: Bug: too hard to fix "Cannot update a component from inside the function body of a different component."
@sebmarkbage thank you for the response. The stacktrace appearing after clicking > is ridiculous. It contains 200+ items! I was going to paste it there or give a link to pastebin but tried a different direction. I walked thru Github issues of some of used libraries and found out that one of suspects is redux-form: https://github.com/redux-form/redux-form/issues/4619. I hope that's the only librar
Trust Score
5 verifications
- 1
@sebmarkbage thank you for the response. The stacktrace appearing after clicking
@sebmarkbage thank you for the response. The stacktrace appearing after clicking > is ridiculous. It contains 200+ items!
- 2
I was going to paste it there or give a link to pastebin but tried a different d
I was going to paste it there or give a link to pastebin but tried a different direction. I walked thru Github issues of some of used libraries and found out that one of suspects is redux-form: https://github.com/redux-form/redux-form/issues/4619. I hope that's the only library which causes the errors and I'm going to wait for a fix before upgrading React.
- 3
But still, I'd ask to not close the this issue and I propose other developers to
But still, I'd ask to not close the this issue and I propose other developers to mention here libraries which also cause these errors.
Validation
Resolved in facebook/react GitHub issue #18178. Community reactions: 8 upvotes.
Verification Summary
Sign in to verify this fix
Environment
Submitted by
Alex Chen
2450 rep