`SvelthreeGLTF.ts` + x : dynamically generated components are not being destroyed (at all? / properly?), reactive statements bound to `$svelthreeStores[sti]` cause errors

[vatro]

e.g. in the Mesh component: https://github.com/vatro/svelthree/blob/d98605278ec144997a1632ccc61b5c3bac8fd3f6/src/components/Mesh.svelte#L785

I've stumbled upon this when changing test-scenes (pages) in the SvelteKit test-app. The error was thrown only when switching from the gltf-to-comp-1 test-scene to any other. gltf-to-comp-1 test-scene generates svelthree-components from a loaded GLTF file.

If we e.g. change the line above to $: currentSceneActive = $svelthreeStores[sti]?.scenes[scene.userData.index_in_scenes]?.isActive the error is not being thrown.

Why? It seems like that somewhere during the destruction process, the svelthreeStores store is gone / nullified?, but generated components are still alive and react to that change by triggering corresponding reactive statements. Adding ? to all $svelthreeStores[sti] related statements doesn't feel like a real fix.

TODO:

• [ ] examine destruction of dynamically generated components (SvelthreeGLTF.ts + X)

[vatro]

I just stumbled upon this issue: https://github.com/sveltejs/svelte/issues/7488 which should be fixed in Svelte 3.49.0 and which may also solve the problem with dynamically generated components described above, see: https://github.com/sveltejs/svelte/blob/master/CHANGELOG.md#3490

Fix DOM-less components not being properly destroyed (https://github.com/sveltejs/svelte/issues/7488)

TODO: check if + eventually close ... EDIT: -> nope, problem still there.

[vatro]

Ok, I think that's the issue:

see https://stackoverflow.com/questions/68335375/ondestroy-not-working-when-component-target-is-removed?rq=1

If you create the component by hand, you also need to destroy it by hand. You need to call $destroy on its instance before removing the Dom element

component_reference.$destroy()

TODO:

• [x] Refactor onDestroy in all components which generate shadow DOM elements: add ability to iterate over manually user-created / svelthree-generated children and $destroy() them.
• [x] Refactor SvelthreeGLTF.ts accordingly