MeshReflectorMaterial normalMap causes offset. And rotated meshes cause sharding on camera motion

[pdkn]

• three version: 0.153.0
• @react-three/fiber version: 8.13.4
• @react-three/drei version: 9.78.0
• node version: n/a
• npm (or yarn) version: n/a

Problem description:

Expected Behaviour:

1. When normalMaps are added the reflection should not become offset on the x axis.
2. When Panning / rotating the scene with OrbitControls, the reflection should stay vertically aligned to the camera rather than become shard'ed ( irrespective of mesh rotation )

Actual Behaviour:

1. When normalMaps are added the reflection has an offset on the x axis.
2. When Panning / rotating the scene with OrbitControls, the reflection is not vertically aligned to the camera. the effect looks shard'ed. I wonder if the mesh rotation is not being taken into consideration?

Relevant code:

Please see this folk of the MeshReflectorMaterial image-gallery demo. It has OrbitControls and normalMap/roughnessMap added. https://codesandbox.io/s/image-gallery-forked-rxlh55

Suggested solution:

I'm going through the MeshReflectorMaterial props to see if I can counter act these glitches but no joy so far. Any Thoughts?

[pdkn]

The storybook demo also exhibits the same offsetting issue https://drei.pmnd.rs/?path=/story/shaders-meshreflectormaterial--reflector-st

[Felixcodet]

I've encountered the same problem. I'm on

• three version: 0.157.0
• @react-three/fiber version: 8.14.4
• @react-three/drei version: 9.86.3