Scene breaks when cast-shadow enabled and navigating back to a previously initialized scene

[lnvglr]

Describe the bug

I have a Nuxt 3 app and in it a page with a Tres.js scene. The scene contains <TresDirectionalLight cast-shadow /> which casts a shadow. When navigating away from the page with the scene and navigating back to the scene (using NuxtLink), I get the error below.

When I remove the cast-shadow prop, the bug disappears.

three.js?v=f17f74c8:17801 Uncaught TypeError: Cannot read properties of null (reading 'state')
    at setProgram (three.js?v=f17f74c8:17801:41)
    at WebGLRenderer.renderBufferDirect (three.js?v=f17f74c8:17292:23)
    at renderObject (three.js?v=f17f74c8:13624:21)
    at renderObject (three.js?v=f17f74c8:13631:7)
    at WebGLShadowMap.render (three.js?v=f17f74c8:13519:9)
    at WebGLRenderer.render (three.js?v=f17f74c8:17493:17)
    at tres.js:387:33
    at index.mjs:71:52
    at Array.map (<anonymous>)
    at Object.trigger (index.mjs:71:40)

complete error log

setProgram				@	three.js?v=f17f74c8:17801
WebGLRenderer.renderBufferDirect	@	three.js?v=f17f74c8:17292
renderObject				@	three.js?v=f17f74c8:13624
renderObject				@	three.js?v=f17f74c8:13631
WebGLShadowMap.render			@	three.js?v=f17f74c8:13519
WebGLRenderer.render			@	three.js?v=f17f74c8:17493
(anonymous)				@	tres.js:387
(anonymous)				@	index.mjs:71
trigger					@	index.mjs:71
we.immediate				@	tres.js:160
loop					@	index.mjs:617
requestAnimationFrame		
resume					@	index.mjs:624
or					@	tres.js:388
cr					@	tres.js:593
(anonymous)				@	tres.js:1086
(anonymous)				@	runtime-core.esm-bundler.js:2757
callWithErrorHandling			@	runtime-core.esm-bundler.js:199
callWithAsyncErrorHandling		@	runtime-core.esm-bundler.js:206
hook.__weh.hook.__weh			@	runtime-core.esm-bundler.js:2737
flushPostFlushCbs			@	runtime-core.esm-bundler.js:385
flushJobs				@	runtime-core.esm-bundler.js:427
Promise.then		
queueFlush				@	runtime-core.esm-bundler.js:322
queuePostFlushCb			@	runtime-core.esm-bundler.js:336
queueEffectWithSuspense			@	runtime-core.esm-bundler.js:7256
baseWatchOptions.scheduler		@	runtime-core.esm-bundler.js:6138
effect2.scheduler			@	reactivity.esm-bundler.js:1892
trigger					@	reactivity.esm-bundler.js:250
endBatch				@	reactivity.esm-bundler.js:308
notify					@	reactivity.esm-bundler.js:594
trigger					@	reactivity.esm-bundler.js:568
set value				@	reactivity.esm-bundler.js:1510
finalizeNavigation			@	vue-router.mjs:3478
(anonymous)				@	vue-router.mjs:3343
Promise.then		
pushWithRedirect			@	vue-router.mjs:3310
push					@	vue-router.mjs:3235
navigate				@	vue-router.mjs:2300
callWithErrorHandling			@	runtime-core.esm-bundler.js:199
callWithAsyncErrorHandling		@	runtime-core.esm-bundler.js:206
invoker					@	runtime-dom.esm-bundler.js:722

Reproduction

https://stackblitz.com/edit/nuxt-starter-w3neca?file=pages%2Findex.vue

Steps to reproduce

No response

System Info

System:
    OS: macOS 14.6.1
    CPU: (10) arm64 Apple M1 Pro
    Memory: 79.77 MB / 32.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 20.9.0 - ~/.nvm/versions/node/v20.9.0/bin/node
    Yarn: 1.22.19 - /opt/homebrew/bin/yarn
    npm: 10.1.0 - ~/.nvm/versions/node/v20.9.0/bin/npm
    pnpm: 9.4.0 - ~/Library/pnpm/pnpm
    bun: 1.0.3 - ~/.bun/bin/bun
  Browsers:
    Chrome: 129.0.6668.100
    Safari: 17.6
  npmPackages:
    @tresjs/cientos: ^4.0.3 => 4.0.2 
    @tresjs/core: ^4.2.10 => 4.2.10 
    @tresjs/nuxt: ^3.0.7 => 3.0.7

Used Package Manager

npm

Code of Conduct

• I agree to follow this project's Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• The provided reproduction is a minimal reproducible example of the bug.

[lnvglr]

I have managed to narrow it down more (and work around the issue this way).

On my <TresCanvas /> I had the preset="realistic" prop. I removed it and in an onMounted hook within the TresContext, I added all the props the realistic preset adds to the renderer except for shadows and physicallyCorrectLights.

Now, navigating away and back to the scene works and there is virtually no visual difference.

Note: I added the shadows prop to the <TresCanvas />.