fix(runtime-core): fix effectscope instance null

linghaoSu · linghaoSu · commit dabb3979d6d1 · 2023-05-23T23:51:27.000+08:00
diff --git a/packages/runtime-core/__tests__/apiWatch.spec.ts b/packages/runtime-core/__tests__/apiWatch.spec.ts
@@ -8,7 +8,8 @@ import {
   defineComponent,
   getCurrentInstance,
   ComponentInternalInstance,
-  ComponentPublicInstance
+  ComponentPublicInstance,
+  onErrorCaptured
 } from '../src/index'
 import {
   render,
@@ -1205,4 +1206,62 @@ describe('api: watch', () => {
     expect(countWE).toBe(3)
     expect(countW).toBe(2)
   })
+
+  test('watch immediate error in effect scope should be catched by onErrorCaptured', async () => {
+    const warn = vi.spyOn(console, 'warn')
+    warn.mockImplementation(() => {})
+    const ERROR_IN_SCOPE = 'ERROR_IN_SCOPE'
+    const ERROR_OUT_SCOPE = 'ERROR_OUT_SCOPE'
+
+    const errors = ref<string[]>([])
+    const Comp = {
+      setup() {
+        const trigger = ref(0)
+
+        effectScope(true).run(() => {
+          watch(
+            trigger,
+            () => {
+              throw new Error(ERROR_IN_SCOPE)
+            },
+            { immediate: true }
+          )
+        })
+
+        watchEffect(() => {
+          throw new Error(ERROR_OUT_SCOPE)
+        })
+
+        return () => ''
+      }
+    }
+
+    // const ErrorCapture =
+
+    const root = nodeOps.createElement('div')
+    render(
+      h(
+        {
+          setup(_, { slots }) {
+            onErrorCaptured(e => {
+              errors.value.push(e.message)
+              return false
+            })
+
+            return () => h('div', slots.default && slots.default())
+          }
+        },
+        null,
+        () => [h(Comp)]
+      ),
+      root
+    )
+    await nextTick()
+    // only watchEffect as ran so far
+    expect(errors.value).toHaveLength(2)
+    expect(errors.value[0]).toBe(ERROR_IN_SCOPE)
+    expect(errors.value[1]).toBe(ERROR_OUT_SCOPE)
+
+    warn.mockRestore()
+  })
 })
diff --git a/packages/runtime-core/src/apiWatch.ts b/packages/runtime-core/src/apiWatch.ts
@@ -200,6 +200,8 @@ function doWatch(
 
   const instance =
     getCurrentScope() === currentInstance?.scope ? currentInstance : null
+  const detachedInstance = () =>
+    !currentInstance || currentInstance?.isUnmounted ? null : currentInstance
   // const instance = currentInstance
   let getter: () => any
   let forceTrigger = false
@@ -230,7 +232,11 @@ function doWatch(
     if (cb) {
       // getter with cb
       getter = () =>
-        callWithErrorHandling(source, instance, ErrorCodes.WATCH_GETTER)
+        callWithErrorHandling(
+          source,
+          instance || detachedInstance(),
+          ErrorCodes.WATCH_GETTER
+        )
     } else {
       // no cb -> simple effect
       getter = () => {
@@ -242,7 +248,7 @@ function doWatch(
         }
         return callWithAsyncErrorHandling(
           source,
-          instance,
+          instance || detachedInstance(),
           ErrorCodes.WATCH_CALLBACK,
           [onCleanup]
         )
@@ -276,7 +282,11 @@ function doWatch(
   let cleanup: () => void
   let onCleanup: OnCleanup = (fn: () => void) => {
     cleanup = effect.onStop = () => {
-      callWithErrorHandling(fn, instance, ErrorCodes.WATCH_CLEANUP)
+      callWithErrorHandling(
+        fn,
+        instance || detachedInstance(),
+        ErrorCodes.WATCH_CLEANUP
+      )
     }
   }
 
@@ -289,11 +299,12 @@ function doWatch(
     if (!cb) {
       getter()
     } else if (immediate) {
-      callWithAsyncErrorHandling(cb, instance, ErrorCodes.WATCH_CALLBACK, [
-        getter(),
-        isMultiSource ? [] : undefined,
-        onCleanup
-      ])
+      callWithAsyncErrorHandling(
+        cb,
+        instance || detachedInstance(),
+        ErrorCodes.WATCH_CALLBACK,
+        [getter(), isMultiSource ? [] : undefined, onCleanup]
+      )
     }
     if (flush === 'sync') {
       const ctx = useSSRContext()!
@@ -327,16 +338,21 @@ function doWatch(
         if (cleanup) {
           cleanup()
         }
-        callWithAsyncErrorHandling(cb, instance, ErrorCodes.WATCH_CALLBACK, [
-          newValue,
-          // pass undefined as the old value when it's changed for the first time
-          oldValue === INITIAL_WATCHER_VALUE
-            ? undefined
-            : isMultiSource && oldValue[0] === INITIAL_WATCHER_VALUE
-            ? []
-            : oldValue,
-          onCleanup
-        ])
+        callWithAsyncErrorHandling(
+          cb,
+          instance || detachedInstance(),
+          ErrorCodes.WATCH_CALLBACK,
+          [
+            newValue,
+            // pass undefined as the old value when it's changed for the first time
+            oldValue === INITIAL_WATCHER_VALUE
+              ? undefined
+              : isMultiSource && oldValue[0] === INITIAL_WATCHER_VALUE
+              ? []
+              : oldValue,
+            onCleanup
+          ]
+        )
         oldValue = newValue
       }
     } else {
