R3F AccumulativeShadows with ThreeJS >=155 darkens the whole shadow map

Questions
,
1

New versions of R3F AccumulativeShadows darkens the whole shadow map.

Docs:

Original Sandbox:
https://codesandbox.io/p/sandbox/19uq2u

Same sandbox but with React 19 and RC versions of R3F and drei.
https://codesandbox.io/p/sandbox/njlrqf

I have tried downgrading the THREE.js version to r160 but to no avail.
I am using NextJS 15 (React 19), therefore I had to use the Release Candidates.

image
image1560×1555 249 KB

image
image1548×804 45.1 KB

Versus how it should look like (mostly transparent BG with a bit of dark areas):

image
image1639×1292 141 KB

1 Like
2

Reducing the alphaTest from 0.9 to 0.75 seems to fix this issue.

1 Like
3

Thanks for reporting back. Glad you figured it out! Future users will thank you. :slight_smile:

1 Like
4

This issue with shadows started from ThreeJS r155, and occurs with most version combinations of React & R3F.

ThreeJS r155 had introduced several lighting changes, but I haven’t dug further to see what exactly changed in the ThreeJS library to cause this issue.

1 Like