THREE error when returning null in a render method
When a custom component in a scene returns null on render (i'm currently writing a Mesh component that waits for its content to be loaded before display), THREE.js fails with :
THREE.Object3D.add: <noscript data-reactid="undefined.1"></noscript> is not an instance of THREE.Object3D.
Which is right since React replaces the value with a noscript tag when null is returned by a component. react-three should check for this behaviour but I haven't found a clean way to do this. For now I just check if the string is a noscript tag but it is not reliable (and really dirty).
Could someone who knows React internals provide some hints on this subject ?
In react/lib/ReactDefaultInjection.js there is this:
ReactInjection.EmptyComponent.injectEmptyComponent('noscript');
I suppose I could override that and make the default empty component into a blank Object3D node, but then you could no longer render null DOM elements.
A more robust method is to check elements just before instantiating them and replacing null with an empty THREE Object3D. For now, you can workaround this by returning an empty Object3D instead of null.