test: onWatcherCleanup in apiWatch

Author: LittleSound

packages/reactivity/src/index.ts

@@ -53,6 +53,7 @@ export {
   enableTracking,
   pauseTracking,
   resetTracking,
+  onEffectCleanup,
   ReactiveEffect,
   EffectFlags,
   type ReactiveEffectRunner,

packages/runtime-core/__tests__/apiWatch.spec.ts

@@ -5,6 +5,7 @@ import {
   defineComponent,
   getCurrentInstance,
   nextTick,
+  onWatcherCleanup,
   reactive,
   ref,
   watch,
@@ -394,6 +395,35 @@ describe('api: watch', () => {
     expect(cleanup).toHaveBeenCalledTimes(2)
   })
 
+  it('onWatcherCleanup', async () => {
+    const count = ref(0)
+    const cleanupEffect = vi.fn()
+    const cleanupWatch = vi.fn()
+
+    const stopEffect = watchEffect(() => {
+      onWatcherCleanup(cleanupEffect)
+      count.value
+    })
+    const stopWatch = watch(count, () => {
+      onWatcherCleanup(cleanupWatch)
+    })
+
+    count.value++
+    await nextTick()
+    expect(cleanupEffect).toHaveBeenCalledTimes(1)
+    expect(cleanupWatch).toHaveBeenCalledTimes(0)
+
+    count.value++
+    await nextTick()
+    expect(cleanupEffect).toHaveBeenCalledTimes(2)
+    expect(cleanupWatch).toHaveBeenCalledTimes(1)
+
+    stopEffect()
+    expect(cleanupEffect).toHaveBeenCalledTimes(3)
+    stopWatch()
+    expect(cleanupWatch).toHaveBeenCalledTimes(2)
+  })
+
   it('flush timing: pre (default)', async () => {
     const count = ref(0)
     const count2 = ref(0)

packages/runtime-core/src/index.ts

@@ -28,6 +28,7 @@ export {
   // effect
   effect,
   stop,
+  onWatcherCleanup,
   ReactiveEffect,
   // effect scope
   effectScope,