EffectComposer.passes is not an array

[kigawa01]

When you run the code below, the following log will be output.
Originally an array should be output.
It is normal when children is undefined.

code

"use client"
import React, {useRef} from "react";
import {extend, useThree} from "@react-three/fiber";
import {EffectComposer, RenderPass, ShaderPass} from "three-stdlib";

extend({EffectComposer, RenderPass, ShaderPass})

export default function Effect(
  {}: object,
) {
  const composerRef = useRef<EffectComposer>(null)
  const {gl, scene, camera} = useThree()

  console.debug(composerRef.current?.passes)

  return (
    <effectComposer ref={composerRef} args={[gl]}>
      <renderPass attach="passes" args={[scene, camera]}/>
    </effectComposer>
  )
}

log

Download the React DevTools for a better development experience: https://reactjs.org/link/react-devtools react-dom.development.js:38560
undefined Effect.tsx:14:10
Object { enabled: true, needsSwap: false, clear: true, renderToScreen: false, scene: {…}, camera: {…}, overrideMaterial: undefined, clearColor: undefined, clearAlpha: 0, clearDepth: false, … }
Effect.tsx:14:10

version

• three: 0.170.0
• three-stdlib: 2.34.0
• @react-three/postprocessing: 2.16.3
• @react-three/drei: 9.115.0
• @react-three/fiber: 8.17.10
• @types/three: 0.170.0

sample

https://github.com/kigawa01/test-three/tree/test/effect-composer/1