mrdoob / three.js

JavaScript 3D Library.
https://threejs.org/
MIT License
101.77k stars 35.3k forks source link

WebGPURenderer: Setting `receiveShadow` to `true` produces shader error with flat shaded objects. #29325

Open Mugen87 opened 2 weeks ago

Mugen87 commented 2 weeks ago

Description

While working on ShadowMapViewer I have noticed that flat shaded objects that receive shadow produce a WGSL error which is logged in the browser console as a warning.

Error while parsing WGSL: :87:33 error: built-in cannot be used by vertex pipeline stage normalFlat = normalize( cross( dpdx( varyings.v_positionView ), - dpdy( varyings.v_positionView ) ) ); ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

The screen also gets white so nothing is rendered.

Commenting out mesh.receiveShadow = true; or disable flat shading fixes the issue.

Reproduction steps

  1. Open https://jsfiddle.net/fcxk984g/
  2. Check browser console.

Live example

Version

r168

Device

Desktop, Mobile, Headset

Browser

Chrome

OS

MacOS

Mugen87 commented 1 week ago

According to the WGSL spec, derivative functions can only be used in a fragment shader stage.

https://www.w3.org/TR/WGSL/#derivative-builtin-functions

So it seems the TSL must avoid to use dFdx() and dFdy() in code assigned to vertex node.