Uncaught Error: Invariant Violation: findComponentRoot(..., ...$110): Unable to find element. This probably means the DOM was unexpectedly mutated
So the problem is you're creating a virtual DOM structure like this:
<tbody>
<tr>
<div>
<td>...</td>
<td>...</td>
</div>
</tr>
</tbody>
Because <div/>
isn't a valid child of <tr>
the browser actually creates DOM representing this:
<div> </div>
<table>
<tbody>
<tr>
<td>...</td>
<td>...</td>
</tr>
</tbody>
</table>
fiddle
When react goes to update, it's looking at that <tr>
and wondering where the <div>
went. Instead it finds a <td>
so it throws an error.
I got the abovementioned error trying to do this for a test:
component = React.addons.TestUtils.renderIntoDocument(<MyTableRow />)
React.findDOMNode(component)
My fix was to wrap it before rendering:
component = React.addons.TestUtils.renderIntoDocument(<table><MyTableRow /></table>)
table = React.findDOMNode(component)
row = jQuery(table).find("tr")[0]