Use ThreeSerialization for serializing/deserializing userData in GLTFLoader2, GLTFWriter2

src/assetmanager/export/GLTFWriter2.ts

@@ -2,6 +2,7 @@ import {GLTFExporter, GLTFExporterOptions} from 'three/examples/jsm/exporters/GL
 import {BufferGeometry, Material, MeshStandardMaterial, Object3D, PixelFormat, Texture} from 'three'
 import {blobToDataURL} from 'ts-browser-helpers'
 import type {GLTFExporter2Options} from './GLTFExporter2'
+import {ThreeSerialization} from '../../utils'
 
 export class GLTFWriter2 extends GLTFExporter.Utils.GLTFWriter {
 
@@ -32,12 +33,17 @@ export class GLTFWriter2 extends GLTFExporter.Utils.GLTFWriter {
             }
         })
 
-        super.serializeUserData(object, objectDef)
-
+        const ud2 = ThreeSerialization.Serialize(userData)
         Object.entries(temp).forEach(([key, value]) => {
             userData[key] = value
             delete temp[key]
         })
+        object.userData = ud2
+        super.serializeUserData(object, objectDef)
+        object.userData = userData
+
+        super.serializeUserData(object, objectDef)
+
     }
 
     processObjects(objects: Object3D[]) {

src/assetmanager/import/GLTFLoader2.ts

@@ -16,6 +16,7 @@ import {
 } from '../gltf'
 import {RootSceneImportResult} from '../IAssetImporter'
 import {ILoader} from '../IImporter'
+import {ThreeSerialization} from '../../utils'
 
 export class GLTFLoader2 extends GLTFLoader implements ILoader<GLTF, Object3D|undefined> {
     isGLTFLoader2 = true
@@ -96,6 +97,17 @@ export class GLTFLoader2 extends GLTFLoader implements ILoader<GLTF, Object3D|un
     // loads the viewer config and handles loading the draco loader for extension
     gltfViewerParser = (viewer: ThreeViewer): (p: GLTFParser)=>GLTFLoaderPlugin => {
         return (parser: GLTFParser) => {
+            const getDependency = parser.getDependency
+            parser.getDependency = async(type: string, index: number) => {
+                const res = await getDependency.call(parser, type, index)
+                if (res.userData) {
+                    const gltfExtensions = res.userData.gltfExtensions
+                    delete res.userData.gltfExtensions
+                    res.userData = ThreeSerialization.Deserialize(res.userData, {})
+                    res.userData.gltfExtensions = gltfExtensions
+                }
+                return res
+            }
             const tempPathDrc = generateUUID() + '.drc'
             const tempPathKtx2 = generateUUID() + '.ktx2'
             const needsDrc = parser.json?.extensionsRequired?.includes?.('KHR_draco_mesh_compression')