Upgrading to Latest ThreeJS adds an extra plane like geometry

[sabinayakc]

 "@react-three/drei": "9.108.1",
    "@react-three/fiber": "8.16.8",
    "@types/three": "0.166.0",
    "react": "18.2.0",
    "react-dom": "18.2.0",
    "react-scripts": "5.0.1",
    "three": "0.166.0"

Problem description:

I upgraded to the latest three and I see a weird plane geometry. It happens in other cases as well.

Relevant code: Update this codesandbox to the latest versions.

https://codesandbox.io/s/57iefg

[rndexe]

I'm assuming this is using <AccumulativeShadows>.

Steps to fix:

1. Multiply intensity of RandomizedLight by Math.PI if set to 1
2. Reduce alphaTest on AccumulativeShadows just enough that the plane disappears