Reflector looks black when added within a Group

Hi all. I’m replacing a Mesh with a Reflector, but the Reflector appears black. I’ve tried adding the Reflector individually and it just works fine. Here is how I do it.

const addMirrorLook = ( object, node ) => {

  if ( === 'Espejo' ) {
    const nodeGeo = node.geometry.clone();

    const options = {
      textureWidth: window.innerWidth * window.devicePixelRatio,
      textureHeight: window.innerHeight * window.devicePixelRatio

    const mirror = new Reflector( nodeGeo, options );

    object.children[ 0 ].children[ 3 ] = mirror;



This is no the correct way of adding an object to a scene/object hierarchy. Always use Object3D.add().

object.children[ 0 ].children[ 3 ].removeFromParent();
object.children[ 0 ].add( mirror );

Hi @mugen87. Thanks for pointing this out to me. I’ve fixed the code to the correct way. Though the mirror is still black.

Do you mind demonstrating the issue with a live example somehow?

It is very hard for me to demonstrate this with a live example, this takes belongs on a big project :frowning:

I don’t see this approach as being viable. What would be the best way to make a flat mirror with Three.js?

Any chances to modify the official example to demonstrate the issue?