test(rtdb): add basic bind options

Author: posva

__tests__/vuefire/rtdb/index.spec.ts

@@ -1,47 +1,56 @@
-import { rtdbPlugin } from '../../src'
-import { tick, Vue, MockFirebase } from '@posva/vuefire-test-helpers'
-
-Vue.use(rtdbPlugin)
+import { mount } from '@vue/test-utils'
+import { rtdbPlugin } from '../../../src'
+import { tick, MockFirebase } from '../../src'
 
 describe('RTDB: firebase option', () => {
   async function createVm() {
     const source = new MockFirebase().child('data')
-    const vm = new Vue({
-      // purposely set items as null
-      // but it's a good practice to set it to an empty array
-      data: () => ({
-        items: [],
-        item: null,
-      }),
-      firebase: {
-        items: source,
-        item: source,
+    const wrapper = mount(
+      {
+        template: 'no',
+        data: () => ({
+          items: [],
+          item: null,
+        }),
+        firebase: {
+          items: source,
+          item: source,
+        },
       },
-    })
+      {
+        global: {
+          plugins: [rtdbPlugin],
+        },
+      }
+    )
     await tick()
 
-    return { vm, source }
+    return { vm: wrapper.vm, source, wrapper }
   }
 
   it('does nothing with no firebase', () => {
-    const vm = new Vue({
-      data: () => ({ items: null }),
-    })
-    expect(vm.items).toEqual(null)
-  })
-
-  it('setups _firebaseUnbinds', async () => {
-    const { vm } = await createVm()
-    expect(vm._firebaseUnbinds).toBeTruthy()
-    expect(Object.keys(vm._firebaseUnbinds).sort()).toEqual(['item', 'items'])
+    const wrapper = mount(
+      {
+        template: 'no',
+        data: () => ({ items: null }),
+      },
+      { global: { plugins: [rtdbPlugin] } }
+    )
+    expect(wrapper.vm.items).toEqual(null)
   })
 
-  it('setups _firebaseUnbinds with no firebase options', () => {
-    const vm = new Vue({
-      data: () => ({ items: null }),
-    })
-    expect(vm._firebaseUnbinds).toBeTruthy()
-    expect(Object.keys(vm._firebaseUnbinds)).toEqual([])
+  it('does nothing with empty firebase return', () => {
+    const wrapper = mount(
+      {
+        template: 'no',
+        data: () => ({ items: null }),
+        // @ts-ignore
+        firebase: () => {},
+      },
+      { global: { plugins: [rtdbPlugin] } }
+    )
+    // @ts-ignore
+    expect(wrapper.vm.items).toEqual(null)
   })
 
   it('setups $firebaseRefs', async () => {
@@ -52,10 +61,8 @@ describe('RTDB: firebase option', () => {
   })
 
   it('clears $firebaseRefs on $destroy', async () => {
-    const { vm } = await createVm()
-    vm.$destroy()
+    const { vm, wrapper } = await createVm()
+    wrapper.unmount()
     expect(vm.$firebaseRefs).toEqual(null)
-    expect(vm._firebaseUnbinds).toEqual(null)
-    expect(vm._firebaseSources).toEqual(null)
   })
 })

src/vuefire/rtdb.ts

@@ -15,7 +15,6 @@ import {
   getCurrentInstance,
   onBeforeUnmount,
 } from 'vue'
-import { rtdbBindAsObject } from 'src/rtdb'
 
 /**
  * Returns the original reference of a Firebase reference or query across SDK versions.
@@ -177,8 +176,7 @@ export const rtdbPlugin = function rtdbPlugin(
     reset?: RTDBOptions['reset']
   ) {
     internalUnbind(key, rtdbUnbinds.get(this), reset)
-    // TODO:
-    // delete this.$firestoreRefs[key]
+    delete this.$firebaseRefs[key]
   }
 
   // add $rtdbBind and $rtdbUnbind methods
@@ -213,19 +211,15 @@ export const rtdbPlugin = function rtdbPlugin(
     // TODO:
     // @ts-ignore
     // this._firebaseSources[key] = source
-    // @ts-ignore
-    // this.$firebaseRefs[key] = getRef(source)
+    this.$firebaseRefs[key] = getRef(source)
 
     return promise
   }
 
   // handle firebase option
   app.mixin({
     beforeCreate(this: ComponentPublicInstance) {
-      // TODO:
-      // this.$firebaseRefs = Object.create(null)
-      // this._firebaseSources = Object.create(null)
-      // this._firebaseUnbinds = Object.create(null)
+      this.$firebaseRefs = Object.create(null)
     },
     created(this: ComponentPublicInstance) {
       let bindings = this.$options.firebase
@@ -241,20 +235,15 @@ export const rtdbPlugin = function rtdbPlugin(
       }
     },
 
-    beforeDestroy(this: ComponentPublicInstance) {
+    beforeUnmount(this: ComponentPublicInstance) {
       const unbinds = rtdbUnbinds.get(this)
       if (unbinds) {
         for (const key in unbinds) {
           unbinds[key]()
         }
       }
-      // TODO:
-      // // @ts-ignore
-      // this._firebaseSources = null
-      // // @ts-ignore
-      // this._firebaseUnbinds = null
-      // // @ts-ignore
-      // this.$firebaseRefs = null
+      // @ts-ignore
+      this.$firebaseRefs = null
     },
   })
 }