feat(refs): unbind nested refs when parent is unbound

src/index.js

@@ -75,7 +75,7 @@ function subscribeToDocument ({ ref, obj, key, depth, resolve }) {
   // TODO max depth param, default to 1?
   if (depth > 3) throw new Error('more than 5 nested refs')
   const subs = Object.create(null)
-  return ref.onSnapshot(doc => {
+  const unbind = ref.onSnapshot(doc => {
     if (doc.exists) {
       updateDataFromDocumentSnapshot({
         snapshot: createSnapshot(doc),
@@ -90,6 +90,14 @@ function subscribeToDocument ({ ref, obj, key, depth, resolve }) {
       resolve()
     }
   })
+
+  return () => {
+    unbind()
+    for (const subKey in subs) {
+      const sub = subs[subKey]
+      sub.unbind()
+    }
+  }
 }
 
 function bindDocument ({

test/refs.spec.js

@@ -19,11 +19,7 @@ beforeEach(async () => {
   await d.update({ ref: c })
 
   vm = new Vue({
-    render (h) {
-      return h('ul', this.items && this.items.map(
-        item => h('li', [item])
-      ))
-    },
+    render: h => h(),
     data: () => ({
       a: null,
       b: null,
@@ -186,3 +182,33 @@ test('unbinds all refs when the document is unbound', async () => {
   cSpy.mockRestore()
   dSpy.mockRestore()
 })
+
+test('unbinds nested refs when the document is unbound', async () => {
+  const c = collection.doc()
+  const d = collection.doc()
+  const aSpy = spyUnbind(a)
+  const cSpy = spyUnbind(c)
+  const dSpy = spyUnbind(d)
+
+  await a.update({ a: true })
+  await c.update({ ref: a })
+  await d.update({ ref: c })
+
+  await vm.$bind('d', d)
+  expect(vm.d).toEqual({
+    ref: {
+      ref: {
+        a: true
+      }
+    }
+  })
+  vm.$unbind('d')
+
+  expect(dSpy.mock.calls.length).toBe(1)
+  expect(cSpy.mock.calls.length).toBe(1)
+  expect(aSpy.mock.calls.length).toBe(1)
+
+  aSpy.mockRestore()
+  cSpy.mockRestore()
+  dSpy.mockRestore()
+})