0beqz/screen-space-reflections

TransformControls in scene causes crash when SSR is enabled

Opened this issue · 9 comments

Continuing from here #4 (comment)
I've been having these error which could not track down

So i've tried running from the examples folder of this lib, and these is no crash but the behavior seems a stuttery and there's extra reflection from the control plane ?

2022-07-25.17-49-00_Trim.mp4

code i added in main.js

tCon = new TransformControls(camera, document.querySelector("#orbitControlsDomElem"))

tCon.addEventListener('dragging-changed', function (event) {

	controls.enabled = !event.value;


});
console.log(tCon)
window.tCon = tCon
scene.add(tCon)
const box = new THREE.Mesh(
	new THREE.BoxBufferGeometry(1, 1, 1),
	new THREE.MeshStandardMaterial({
		color: 0xff0000,
		metalness: 1,
		roughness: 0
	})

)
box.position.set(1, 1, 1)
box.updateMatrixWorld()
scene.add(box)

tCon.attach(box)

and then i tried with a basic cube and a plane

2022-07-25.17-59-19.mp4

the code i used https://gist.github.com/optimus007/56b49fc4a61a0f31dfcda36dc6a9deea

one big difference is i'm switching between renderer.render and composer.render in this example to toggle the postprocessing

0beqz commented

Ah okay I see. Well it looks like the control plane's transparency is causing issues which makes it reflect as well. So if you don't want to have reflections for the control plane at all, use the SSREffect's selection set to add only the meshes which should reflect.

I'll try to look into what's causing your crash. Could you maybe create a demo repo please so that I can replicate the crash quickly?

here's the demo
page https://optimus007.github.io/SSRTest/ (using '/docs' folder to build and host)
repo https://github.com/optimus007/SSRTest

added "selection" but still crashes
and adding hdri seems to printing warning messages

in firefox the error message is different
err

0beqz commented

Thanks, I'll try to look into that in the next few days to see what's causing the issue.

updated to latest , looks great , fewer reflection glitches

transform controls issue still persists

page https://optimus007.github.io/SSRTest/
repo https://github.com/optimus007/SSRTest

Same issue in orbitControls! If i span or rotate whole scene,the crash will exitst and persist until reload the page。 If you can give me some feedback, i will so appreciate it. Thanks!

Same issue in orbitControls! If i span or rotate whole scene,the crash will exitst and persist until reload the page。 If you can give me some feedback, i will so appreciate it. Thanks!

can you post a video ?
This error is about the existence of transform controls in the scene causing a crash
Your error might be different , orbitcontrols never caused an issue in my case

I'm also trying to use TransformControls. Instead of a crash, I get this error...

Unhandled Runtime Error
TypeError: Cannot read properties of undefined (reading 'clone')

Call Stack
TransformControlsGizmo.eval [as updateMatrixWorld]
node_modules\three-stdlib\controls\TransformControls.js (909:0)
TransformControls.updateMatrixWorld
node_modules\three\build\three.module.js (7998:0)
TransformControls.eval [as updateMatrixWorld]
node_modules\three-stdlib\controls\TransformControls.js (189:0)
Scene.updateMatrixWorld
node_modules\three\build\three.module.js (7998:0)
WebGLRenderer.render
node_modules\three\build\three.module.js (27439:0)
RenderPass.render
node_modules\postprocessing\build\postprocessing.esm.js (3092:0)
EffectComposer.render
node_modules\postprocessing\build\postprocessing.esm.js (4377:0)
Object.eval [as current]
node_modules@react-three\postprocessing\dist\index.js (143:0)
render$1
node_modules@react-three\fiber\dist\index-80784ca9.esm.js (1516:0)
eval
node_modules@react-three\fiber\dist\index-80784ca9.esm.js (1545:0)
Map.forEach

loop
node_modules@react-three\fiber\dist\index-80784ca9.esm.js (1539:0)

@skrichten that's same as the original error

While testing vanilla js version of Accumulative shadows from R3F Drei
I encountered this same error

basically transformControl's updateMatrixWorld function updates it's own materials and it's mesh.visible and its running on every frame rendered

If any other code replaces this material with a temporary shader material or hides any transform control mesh ,it's updateMatrixWorld will try to do some clone operation and stuff & will make the mesh visible again. and when it happens on a shader material it leads to crash + artifacts

Easy way to skip it was to find any "isTransformControls" objects and hide them before rendering and prevent material edits from happening on it (works in my case since i traverse the scene to find all the shadow casting meshes anyway)