feat(core): add onMount instance callback

packages/fiber/src/core/renderer.ts

@@ -45,6 +45,8 @@ export type BaseInstance = Omit<THREE.Object3D, 'children' | 'attach' | 'add' |
   remove: (...object: Instance[]) => Instance
   add: (...object: Instance[]) => Instance
   raycast?: (raycaster: THREE.Raycaster, intersects: THREE.Intersection[]) => void
+  onUpdate?: (self: Instance) => void
+  onMount?: (self: Instance) => void
 }
 export type Instance = BaseInstance & { [key: string]: any }
 
@@ -272,6 +274,8 @@ function createRenderer<TCanvas>(roots: Map<TCanvas, Root>, getEventPriority?: (
         }
       }
     })
+
+    newInstance.onMount?.(newInstance)
   }
 
   const reconciler = Reconciler({
@@ -301,7 +305,7 @@ function createRenderer<TCanvas>(roots: Map<TCanvas, Root>, getEventPriority?: (
       const localState = (instance?.__r3f ?? {}) as LocalState
       // https://github.com/facebook/react/issues/20271
       // Returning true will trigger commitMount
-      return !!localState.handlers || !!localState.attach
+      return !!localState.handlers || !!localState.attach || !!instance.onMount
     },
     prepareUpdate(instance: Instance, type: string, oldProps: any, newProps: any) {
       // Create diff-sets
@@ -352,6 +356,8 @@ function createRenderer<TCanvas>(roots: Map<TCanvas, Root>, getEventPriority?: (
           attach(parent, instance, localState.attach)
         }
       }
+
+      instance.onMount?.(instance)
     },
     getPublicInstance: (instance: Instance) => instance,
     shouldDeprioritizeSubtree: () => false,

packages/fiber/src/three-types.ts

@@ -30,6 +30,7 @@ export interface NodeProps<T, P> {
   ref?: React.Ref<T>
   key?: React.Key
   onUpdate?: (self: T) => void
+  onMount?: (self: T) => void
 }
 
 export type ExtendedColors<T> = { [K in keyof T]: T[K] extends THREE.Color | undefined ? Color : T[K] }

packages/fiber/tests/core/renderer.test.tsx

@@ -775,4 +775,35 @@ describe('renderer', () => {
     const respectedKeys = privateKeys.filter((key) => overwrittenKeys.includes(key) || state[key] === portalState[key])
     expect(respectedKeys).toStrictEqual(privateKeys)
   })
+
+  it('should safely call onMount', async () => {
+    let safe = false
+
+    const Test = (props: any) => {
+      safe = false
+      return (
+        <group
+          {...props}
+          attach={(_, self: any) => ((self.attached = true), () => (self.attached = false))}
+          onMount={(self: any) => void (safe = self.attached)}
+        />
+      )
+    }
+
+    // Mount
+    await act(async () => root.render(<Test args={[0]} />))
+    expect(safe).toBe(true)
+
+    // Reconstruct
+    await act(async () => root.render(<Test args={[1]} />))
+    expect(safe).toBe(true)
+
+    // Update
+    await act(async () => root.render(<Test args={[1]} foo />))
+    expect(safe).toBe(false)
+
+    // Unmount
+    await act(async () => root.render(null))
+    expect(safe).toBe(false)
+  })
 })