16.8.6: Invariant Violation: Expected subtree parent to be a mounted class component

[MatthewHerbst]

Do you want to request a feature or report a bug?

Reporting a bug

What is the current behavior?

We received a bug report from Rollbar (what we use to catch and report JS bugs).

Invariant Violation: Expected subtree parent to be a mounted class component. This error is likely caused by a bug in React. Please file an issue.
1 File "webpack:///./~/react-dom/cjs/react-dom.production.min.js" line 13 col 313 in r
'use strict';var aa=require("react"),n=require("object-assign"),r=require("scheduler");function b...
2 File "webpack:///./~/react-dom/cjs/react-dom.production.min.js" line 14 col 166 in o
function x(a){for(var b=arguments.length-1,c="https://reactjs.org/docs/error-decoder.html?invaria...
3 File "webpack:///./~/react-dom/cjs/react-dom.production.min.js" line 252 col 75 in Yr
function Ji(a,b,c,d,e){var f=b.current;a:if(c){c=c._reactInternalFiber;b:{2===ed(c)&&1===c.tag?vo...
4 File "webpack:///./~/react-dom/cjs/react-dom.production.min.js" line 253 col 85 in Kr
of();pf(f,e);qf(f,d);return d}function Ki(a,b,c,d){var e=b.current,f=lf();e=mf(f,e);return Ji(a,b...
5 File "webpack:///./~/react-dom/cjs/react-dom.production.min.js" line 261 col 426 in eo.legacy_renderSubtreeIntoContainer
Pi.prototype.render=function(a,b){var c=this._internalRoot,d=new Oi;b=void 0===b?null:b;null!==b&...
6 File "webpack:///./~/react-dom/cjs/react-dom.production.min.js" line 264 col 342 in [anonymous]
function Si(a,b,c,d,e){var f=c._reactRootContainer;if(f){if("function"===typeof e){var g=e;e=func...
7 File "webpack:///./~/react-dom/cjs/react-dom.production.min.js" line 251 col 66 in Ur
function Hi(a,b){if(X&&!ri){ri=!0;try{return a(b)}finally{ri=!1}}return a(b)}function Ii(a,b,c){X...
8 File "webpack:///./~/react-dom/cjs/react-dom.production.min.js" line 264 col 328 in ro
function Si(a,b,c,d,e){var f=c._reactRootContainer;if(f){if("function"===typeof e){var g=e;e=func...
9 File "webpack:///./~/react-dom/cjs/react-dom.production.min.js" line 267 col 16 in Object.unstable_renderSubtreeIntoContainer
x("38"):void 0;return Si(a,b,c,!1,d)},unmountComponentAtNode:function(a){Qi(a)?void 0:x("40");ret...
10 File "webpack:///./~/ag-grid-react/lib/legacyReactComponent.js" line 66 col 1 in t.createReactComponentLegacy
ReactDOM.unstable_renderSubtreeIntoContainer(this.parentComponent, ReactComponent, th...

If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem. Your bug will get fixed much faster if we can run your code and it doesn't have dependencies other than React. Paste the link to your JSFiddle (https://jsfiddle.net/Luktwrdm/) or CodeSandbox (https://codesandbox.io/s/new) example below:

Unfortunately we do not know the user's actions beyond which page of our website they were viewing at the time of the error.

What is the expected behavior?

There should be no bug.

Which versions of React, and which browser / OS are affected by this issue? Did this work in previous versions of React?

React: 16.8.6 OS: MacOS 10.13.6 Browser: Chrome 74.0.3729

[aweary]

@MatthewHerbst unfortunately without a reproducible example there's not much we can do here 🙁The createReactComponentLegacy line in the stack trace looks suspicious, can you share what that's doing?

One thing I would make sure of is that you don't have multiple copies of React in your bundle.

[MatthewHerbst]

Hi @aweary. Hard to produce an example since I wasn't the one who caused the error - it was just a user on our site and we don't have any easily accessible detailed session data to know exactly what they were doing unfortunately. I'll try and see if I can dig up some tomorrow, but I'm not hopeful on that.

Was just reporting because it says to :)

What's the proper way to check that we don't have multiple copies of React in our bundle?

[jddxf]

@MatthewHerbst Does this issue help?

[MatthewHerbst]

Hmm, I hadn't noticed the ag-grid part of the stacktrace at the end, thanks for finding that issue @jddxf.

Again, I don't know how to reproduce this, so while I will implement the suggested fix in the linked issue, I don't know if that solves it or not. Posted this because the error message said to.

My guess is we can close this, and I'll try that fix and it still happens again we can reopen it.

Thanks for the help!

[SandMoshi]

This could be a library mismatch. If you think you're packages are all correct. Try deleting node_modules folder and reinstalling with npm install

[MatthewHerbst]

@SandMoshi that's not an acceptable response for a package that uses a package-lock.json

[SandMoshi]

@MatthewHerbst can you explain why not? Files are known to get corrupted from time to time and I was facing the same error when I updated another package and that's what fixed the issue.

[MatthewHerbst]

What exactly do you mean by corrupted?

npm install will bump the versions of all packages. The whole point of using a lockfile is so that everyone stays on the same version, and so that if we change versions we do so intentionally and with a review of what changed in the new version of the package. It's not acceptable to blindly accept hundreds or even thousands of package changes all at once without knowing what's in them.

[ZeroDarkThirty]

@MatthewHerbst I'm experiencing the same issue with ag-Grid. Did you get around to finding a solution?

[MatthewHerbst]

@ZeroDarkThirty I never did unfortunately, and it didn't seem to ever break functionality so I didn't look into it too much more.

[ZeroDarkThirty]

@MatthewHerbst Fair enough. I've been getting this error when switching between 3 tabs, all of which load data from the server into agGrid, too fast. The issue was initially just a React warning for not unsubscribing in component unmount. Once I fixed that, it lead to this error.

[MatthewHerbst]

What's been unclear to me is if this is an actual React bug, a bug with agGrid, or a bug in our various user lands.

[wgh815600709qq]

I meet the same question when using React and agGrid, and the similar error info. But it didn‘t display the the wrong message on Debug console everytime. Sometimes, my customers met the problem and feedback us. Hoping some help, I have try to clear the node_nodules and npm install ,but it donot work.

[sethmcleod]

For those encountering this error in the context of agGrid, it seems to be a bug on their part and was resolved in version 22.1.0 so you may want to consider upgrading. Specifically, it looks like multiple invocations of showNoRowsOverlay result in multiple overlays which triggers this React error. More info can be found here: https://github.com/ag-grid/ag-grid/issues/3450