test: wait option

Author: posva

src/firestore/subscribe.ts

@@ -289,8 +289,6 @@ export function bindCollection<T = unknown>(
   // TODO: remove ops
   const key = 'value'
   // with wait we delay changes to the target until all values are resolved
-  // let arrayRef = wait ? ref([]) : target
-  // FIXME:
   let arrayRef = ref(wait ? [] : target.value)
   if (!wait) ops.set(target, key, [])
   const originalResolve = resolve
@@ -384,8 +382,7 @@ export function bindCollection<T = unknown>(
             // if wait is true, finally set the array
             if (wait) {
               ops.set(target, key, unref(arrayRef))
-              // FIXME: use the proxy object
-              // arrayRef = target
+              arrayRef = target
             }
             originalResolve(unref(arrayRef))
             // reset resolve to noop
@@ -406,8 +403,7 @@ export function bindCollection<T = unknown>(
     if (!docChanges.length) {
       if (wait) {
         ops.set(target, key, unref(arrayRef))
-        // FIXME: use the proxy object
-        // arrayRef = target.value
+        arrayRef = target
       }
       resolve(unref(arrayRef))
     }

tests/database/list.spec.ts

@@ -7,7 +7,7 @@ import {
   _RefDatabase,
 } from '../../src'
 import { expectType, tds, setupDatabaseRefs, database } from '../utils'
-import { computed, nextTick, ref, unref, type Ref } from 'vue'
+import { computed, nextTick, ref, unref, watch, type Ref } from 'vue'
 import {
   DatabaseReference,
   orderByChild,
@@ -288,6 +288,40 @@ describe('Database lists', () => {
     expect(error.value).toBeUndefined()
   })
 
+  it('can provide a target ref to the composable', async () => {
+    const dataRef = databaseRef()
+    await push(dataRef, { name: 'a' })
+    await push(dataRef, { name: 'b' })
+    const target = ref([])
+    let changeCount = 0
+    watch(
+      () => target.value,
+      (newData) => {
+        changeCount++
+      },
+      { deep: true, flush: 'sync' }
+    )
+    const { promise, data } = factory({
+      ref: dataRef,
+      options: { target },
+    })
+
+    await promise.value
+
+    expect(changeCount).toBe(1)
+    expect(data.value).toHaveLength(2)
+    expect(data.value).toContainEqual({ name: 'a' })
+    expect(data.value).toContainEqual({ name: 'b' })
+    expect(data.value).toEqual(target.value)
+
+    await push(dataRef, { name: 'c' })
+    expect(data.value).toHaveLength(3)
+    expect(data.value).toContainEqual({ name: 'a' })
+    expect(data.value).toContainEqual({ name: 'b' })
+    expect(data.value).toContainEqual({ name: 'c' })
+    expect(data.value).toEqual(target.value)
+  })
+
   tds(() => {
     const db = database
     const databaseRef = _databaseRef

tests/firestore/collection.spec.ts

@@ -9,7 +9,7 @@ import {
   where,
 } from 'firebase/firestore'
 import { expectType, setupFirestoreRefs, tds, firestore } from '../utils'
-import { computed, nextTick, ref, unref, type Ref } from 'vue'
+import { computed, nextTick, ref, unref, watch, type Ref } from 'vue'
 import { _InferReferenceType, _RefFirestore } from '../../src/firestore'
 import {
   useCollection,
@@ -353,6 +353,41 @@ describe(
       expect(data.value).toHaveLength(3)
     })
 
+    it('can provide a target ref to the composable', async () => {
+      const dataRef = collection()
+      await addDoc(dataRef, { name: 'a' })
+      await addDoc(dataRef, { name: 'b' })
+      const target = ref([])
+      let changeCount = 0
+      watch(
+        () => target.value,
+        (newData) => {
+          changeCount++
+        },
+        { deep: true, flush: 'sync' }
+      )
+
+      const { promise, data } = factory({
+        ref: dataRef,
+        options: { target, wait: true },
+      })
+
+      await promise.value
+
+      expect(changeCount).toBe(1)
+      expect(data.value).toHaveLength(2)
+      expect(data.value).toContainEqual({ name: 'a' })
+      expect(data.value).toContainEqual({ name: 'b' })
+      expect(data.value).toEqual(target.value)
+
+      await addDoc(dataRef, { name: 'c' })
+      expect(data.value).toHaveLength(3)
+      expect(data.value).toContainEqual({ name: 'a' })
+      expect(data.value).toContainEqual({ name: 'b' })
+      expect(data.value).toContainEqual({ name: 'c' })
+      expect(data.value).toEqual(target.value)
+    })
+
     tds(() => {
       interface TodoI {
         text: string