From 1a2c3c2d77ba96ef496f4c86329b7798026511ae Mon Sep 17 00:00:00 2001
From: Evan You <yyx990803@gmail.com>
Date: Wed, 13 Jul 2022 11:01:10 +0800
Subject: [PATCH] fix(watch): fix deep watch for structures containing raw refs

fix #12652
---
 src/core/observer/traverse.ts          |  3 +++
 test/unit/features/v3/apiWatch.spec.ts | 14 ++++++++++++++
 2 files changed, 17 insertions(+)

diff --git a/src/core/observer/traverse.ts b/src/core/observer/traverse.ts
index 0fe671c06cf..5f4e378b194 100644
--- a/src/core/observer/traverse.ts
+++ b/src/core/observer/traverse.ts
@@ -1,6 +1,7 @@
 import { _Set as Set, isObject, isArray } from '../util/index'
 import type { SimpleSet } from '../util/index'
 import VNode from '../vdom/vnode'
+import { isRef } from '../../v3'
 
 const seenObjects = new Set()
 
@@ -35,6 +36,8 @@ function _traverse(val: any, seen: SimpleSet) {
   if (isA) {
     i = val.length
     while (i--) _traverse(val[i], seen)
+  } else if (isRef(val)) {
+    _traverse(val.value, seen)
   } else {
     keys = Object.keys(val)
     i = keys.length
diff --git a/test/unit/features/v3/apiWatch.spec.ts b/test/unit/features/v3/apiWatch.spec.ts
index 52025afa96a..c1b301ae9e8 100644
--- a/test/unit/features/v3/apiWatch.spec.ts
+++ b/test/unit/features/v3/apiWatch.spec.ts
@@ -144,6 +144,20 @@ describe('api: watch', () => {
     expect(dummy).toBe(1)
   })
 
+  it('deep watch w/ raw refs', async () => {
+    const count = ref(0)
+    const src = reactive({
+      arr: [count]
+    })
+    let dummy
+    watch(src, ({ arr: [{ value }] }) => {
+      dummy = value
+    })
+    count.value++
+    await nextTick()
+    expect(dummy).toBe(1)
+  })
+
   it('watching multiple sources', async () => {
     const state = reactive({ count: 1 })
     const count = ref(1)