Loading react-pixi creates conflict with react?

[mikkmartin]

Not sure if bug or doing something wrong, but when i use react-layout with latest react and try to render stage component via:

ReactLayout.render(ExampleStage)

i get an error (only when react-pixi loaded)

Uncaught TypeError: Cannot read property 'firstChild' of undefined

this works fine:

React.render(<ExampleStage />, document.body);

Also get a warning in console beforehand for both cases:

Warning: patching react to work with react-pixi

does the patching break compatibility with other versions?

[Izzimach]

The Warning: patching react to work with react-pixi is normal, so no big deal.

Glancing over react-layout I don't see anything obviously odd going on. Do you know where in the code this error happens?

[mikkmartin]

Uncaught TypeError: Cannot read property 'firstChild' of undefined appears on react-pixi.js line 12608

findComponentRoot function

firstChildren[0] = deepestAncestor.firstChild;

[mikkmartin]

apparently react-pixi cant find root element from react layout, which is #react-root. Or react layout doesn't supply that properly

either way if i hard code

firstChildren[0] = document.getElementById('react-root');

it works properly

[Izzimach]

Yeah, it looks like react-layout manually creates the root DOM object react-root itself. That may be part of the cause. Similar to what's causing kadirahq/meteor-react-layout#36 maybe?

Do you have the react-root div in the HTML or are you relying on react-layout to insert it? Is there a barebones meteor/react app I can look it? I don't use meteor so it would take a while for me to whip up an app to reproduce the bug.

[mikkmartin]

It appears it was a user error, there is a repo with meteor flow-roter using react pixi here, if anyone else runs into trouble.

[Izzimach]

Thanks for the update!