From: Jakob <jak-ch-ll@mailbox.org>
Date: Fri, 16 Aug 2024 08:14:08 +0000 (+0200)
Subject: fix(watch): handle errors in computed used as watch source (#11626)
X-Git-Tag: v3.5.0-beta.3~18
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=8bcaad4a32cf0f1f89e0259f6a53036620b7fe9f;p=thirdparty%2Fvuejs%2Fcore.git

fix(watch): handle errors in computed used as watch source (#11626)

close #11624
---

diff --git a/packages/runtime-core/__tests__/errorHandling.spec.ts b/packages/runtime-core/__tests__/errorHandling.spec.ts
index 4cf4ffe312..0cd3efa588 100644
--- a/packages/runtime-core/__tests__/errorHandling.spec.ts
+++ b/packages/runtime-core/__tests__/errorHandling.spec.ts
@@ -670,5 +670,42 @@ describe('error handling', () => {
     )
   })
 
+  // #11624
+  test('in computed that is used as key for watch', async () => {
+    const err = new Error('foo')
+    const fn = vi.fn()
+    const trigger = ref(false)
+
+    const Comp = {
+      setup() {
+        onErrorCaptured((err, instance, info) => {
+          fn(err, info)
+          return false
+        })
+        return () => h(Child)
+      },
+    }
+
+    const Child = {
+      setup() {
+        const foo = computed(() => {
+          if (trigger.value) throw err
+          return 1
+        })
+        watch(foo, () => {})
+        return () => null
+      },
+    }
+
+    render(h(Comp), nodeOps.createElement('div'))
+
+    trigger.value = true
+    await nextTick()
+    expect(fn).toHaveBeenCalledWith(
+      err,
+      ErrorTypeStrings[ErrorCodes.COMPONENT_UPDATE],
+    )
+  })
+
   // native event handler handling should be tested in respective renderers
 })
diff --git a/packages/runtime-core/src/apiWatch.ts b/packages/runtime-core/src/apiWatch.ts
index 479a263b39..35b488052f 100644
--- a/packages/runtime-core/src/apiWatch.ts
+++ b/packages/runtime-core/src/apiWatch.ts
@@ -400,7 +400,10 @@ function doWatch(
   } else {
     // default: 'pre'
     job.flags! |= SchedulerJobFlags.PRE
-    if (instance) job.id = instance.uid
+    if (instance) {
+      job.id = instance.uid
+      job.i = instance
+    }
     scheduler = () => queueJob(job)
   }
   effect.scheduler = scheduler