test(watch): watching a reactive array (#10848)

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

@@ -96,6 +96,30 @@ describe('api: watch', () => {
  expect(spy).toBeCalledWith([1], [1], expect.anything())
  })
 
+ it('should not call functions inside a reactive source array', () => {
+ const spy1 = vi.fn()
+ const array = reactive([spy1])
+ const spy2 = vi.fn()
+ watch(array, spy2, { immediate: true })
+ expect(spy1).toBeCalledTimes(0)
+ expect(spy2).toBeCalledWith([spy1], undefined, expect.anything())
+ })
+
+ it('should not unwrap refs in a reactive source array', async () => {
+ const val = ref({ foo: 1 })
+ const array = reactive([val])
+ const spy = vi.fn()
+ watch(array, spy, { immediate: true })
+ expect(spy).toBeCalledTimes(1)
+ expect(spy).toBeCalledWith([val], undefined, expect.anything())
+
+ // deep by default
+ val.value.foo++
+ await nextTick()
+ expect(spy).toBeCalledTimes(2)
+ expect(spy).toBeCalledWith([val], [val], expect.anything())
+ })
+
  it('should not fire if watched getter result did not change', async () => {
  const spy = vi.fn()
  const n = ref(0)
@@ -186,6 +210,24 @@ describe('api: watch', () => {
  expect(dummy).toBe(1)
  })
 
+ it('directly watching reactive array with explicit deep: false', async () => {
+ const val = ref(1)
+ const array: any[] = reactive([val])
+ const spy = vi.fn()
+ watch(array, spy, { immediate: true, deep: false })
+ expect(spy).toBeCalledTimes(1)
+ expect(spy).toBeCalledWith([val], undefined, expect.anything())
+
+ val.value++
+ await nextTick()
+ expect(spy).toBeCalledTimes(1)
+
+ array[1] = 2
+ await nextTick()
+ expect(spy).toBeCalledTimes(2)
+ expect(spy).toBeCalledWith([val, 2], [val, 2], expect.anything())
+ })
+
  // #9916
  it('watching shallow reactive array with deep: false', async () => {
  class foo {