From e459dd18ad7b784e0fd6e84fbb4de48beca7231c Mon Sep 17 00:00:00 2001
From: Renato Lacerda <renato.ac.lacerda@gmail.com>
Date: Fri, 23 Feb 2024 04:55:52 -0300
Subject: [PATCH] fix: bindFirestoreRef not reacting to getter (#1496)

* fix: bindFirestoreRef not reacting to getter

* fix: checking if references typeof is function

* test: list/collection can be bound to getter
---
 src/database/useDatabaseRef.ts     |  2 +-
 src/firestore/useFirestoreRef.ts   |  2 +-
 src/storage/index.ts               |  4 ++--
 tests/database/list.spec.ts        | 27 ++++++++++++++++++++++++++
 tests/firestore/collection.spec.ts | 31 +++++++++++++++++++++++++++---
 5 files changed, 59 insertions(+), 7 deletions(-)

diff --git a/src/database/useDatabaseRef.ts b/src/database/useDatabaseRef.ts
index dc42c681..d8e581d0 100644
--- a/src/database/useDatabaseRef.ts
+++ b/src/database/useDatabaseRef.ts
@@ -134,7 +134,7 @@ export function _useDatabaseRef(
   }
 
   let stopWatcher = noop
-  if (isRef(reference)) {
+  if (isRef(reference) || typeof reference === 'function') {
     stopWatcher = watch(reference, bindDatabaseRef)
   }
   bindDatabaseRef()
diff --git a/src/firestore/useFirestoreRef.ts b/src/firestore/useFirestoreRef.ts
index 6b72a8c1..885718d6 100644
--- a/src/firestore/useFirestoreRef.ts
+++ b/src/firestore/useFirestoreRef.ts
@@ -164,7 +164,7 @@ export function _useFirestoreRef(
   }
 
   let stopWatcher = noop
-  if (isRef(docOrCollectionRef)) {
+  if (isRef(docOrCollectionRef) || typeof docOrCollectionRef === 'function') {
     stopWatcher = watch(docOrCollectionRef, bindFirestoreRef)
   }
 
diff --git a/src/storage/index.ts b/src/storage/index.ts
index dd79dcdd..cf5785df 100644
--- a/src/storage/index.ts
+++ b/src/storage/index.ts
@@ -75,7 +75,7 @@ export function useStorageFileUrl(
   }
 
   refresh()
-  if (isRef(storageRef)) {
+  if (isRef(storageRef) || typeof storageRef === 'function') {
     watch(storageRef, refresh)
   }
 
@@ -255,7 +255,7 @@ export function useStorageFile(
     return Promise.all([refreshUrl(), refreshMetadata()])
   }
 
-  if (isRef(storageRef)) {
+  if (isRef(storageRef) || typeof storageRef === 'function') {
     watch(storageRef, (storageSource) => {
       if (!storageSource) {
         if (uploadTask.value) {
diff --git a/tests/database/list.spec.ts b/tests/database/list.spec.ts
index f981c1af..da5ded6e 100644
--- a/tests/database/list.spec.ts
+++ b/tests/database/list.spec.ts
@@ -287,6 +287,33 @@ describe('Database lists', () => {
     expect(data.value).toContainEqual({ text: 'task 3' })
   })
 
+  it('can be bound to a getter', async () => {
+    const listA = databaseRef()
+    const listB = databaseRef()
+    await push(listA, { text: 'task 1' })
+    await push(listA, { text: 'task 2' })
+    await push(listB, { text: 'task 3' })
+    await push(listA, { text: 'task 4' })
+    const showFinished = ref(true)
+
+    const { wrapper, data, promise } = factory({
+      ref: () => (showFinished.value ? listA : listB),
+    })
+
+    await promise.value
+    expect(data.value).toHaveLength(3)
+    expect(data.value).toContainEqual({ text: 'task 1' })
+    expect(data.value).toContainEqual({ text: 'task 2' })
+    expect(data.value).toContainEqual({ text: 'task 4' })
+
+    showFinished.value = false
+    await nextTick()
+    await promise.value
+    await nextTick()
+    expect(data.value).toHaveLength(1)
+    expect(data.value).toContainEqual({ text: 'task 3' })
+  })
+
   it('reorders items in the array', async () => {
     const listRef = databaseRef()
     const orderedListRef = query(listRef, orderByChild('n'))
diff --git a/tests/firestore/collection.spec.ts b/tests/firestore/collection.spec.ts
index c0927b0b..a1ec8292 100644
--- a/tests/firestore/collection.spec.ts
+++ b/tests/firestore/collection.spec.ts
@@ -74,7 +74,7 @@ describe(
 
     function factoryQuery<
       AppModelType = DocumentData,
-      DbModelType extends DocumentData = DocumentData
+      DbModelType extends DocumentData = DocumentData,
     >({
       options,
       ref,
@@ -358,8 +358,8 @@ describe(
         showFinished.value
           ? finishedListRef
           : showFinished.value === false
-          ? unfinishedListRef
-          : null
+            ? unfinishedListRef
+            : null
       )
       await addDoc(listRef, { text: 'task 1', finished: false })
       await addDoc(listRef, { text: 'task 2', finished: false })
@@ -398,6 +398,31 @@ describe(
       expect(data.value).toContainEqual({ text: 'task 3', finished: true })
     })
 
+    it('can be bound to a getter', async () => {
+      const listCollectionRef = collection<{ name: string }>(
+        'populatedCollection'
+      )
+      const collectionName = ref('populatedCollection')
+
+      const { wrapper, promise } = factory({
+        ref: () => collection(collectionName.value),
+      })
+
+      await promise.value
+      await addDoc(listCollectionRef, { name: 'a' })
+      await addDoc(listCollectionRef, { name: 'b' })
+
+      expect(wrapper.vm.list).toHaveLength(2)
+      expect(wrapper.vm.list).toContainEqual({ name: 'a' })
+      expect(wrapper.vm.list).toContainEqual({ name: 'b' })
+
+      collectionName.value = 'emptyCollection'
+      await nextTick()
+      await promise.value
+      await nextTick()
+      expect(wrapper.vm.list).toHaveLength(0)
+    })
+
     it('can be bound to a null ref', async () => {
       const { showFinished, listToDisplay } = await createFilteredLists()
       showFinished.value = null