feat(database): add databasePlugin

src/core.ts

@@ -1,3 +1,4 @@
+// TODO: remove this file (used to be @vuefire/core)
 export { walkSet } from './shared'
 export type { OperationsType, ResetOption } from './shared'
 export * from './database/subscribe'

src/database/optionsApi.ts

@@ -18,15 +18,12 @@ function getRef(refOrQuery: DatabaseReference | Query): DatabaseReference {
   return refOrQuery.ref
 }
 
-interface PluginOptions {
+export interface DatabasePluginOptions extends RTDBOptions {
   bindName?: string
   unbindName?: string
-  serialize?: RTDBOptions['serialize']
-  reset?: RTDBOptions['reset']
-  wait?: RTDBOptions['wait']
 }
 
-const defaultOptions: Readonly<Required<PluginOptions>> = {
+const defaultOptions: Readonly<Required<DatabasePluginOptions>> = {
   bindName: '$rtdbBind',
   unbindName: '$rtdbUnbind',
   serialize: rtdbOptions.serialize,
@@ -94,7 +91,7 @@ export const rtdbUnbinds = new WeakMap<
  */
 export function rtdbPlugin(
   app: App,
-  pluginOptions: PluginOptions = defaultOptions
+  pluginOptions: DatabasePluginOptions = defaultOptions
 ) {
   // TODO: implement
   // const strategies = Vue.config.optionMergeStrategies

src/database/subscribe.ts

@@ -15,6 +15,7 @@ import {
   onChildRemoved,
 } from 'firebase/database'
 
+// TODO: rename to match where it's used
 export interface RTDBOptions {
   reset?: ResetOption
   serialize?: RTDBSerializer

src/firestore/optionsApi.ts

@@ -79,15 +79,15 @@ export const firestoreUnbinds = new WeakMap<
   Record<string, ReturnType<typeof bindCollection | typeof bindDocument>>
 >()
 
-export interface PluginOptions {
+export interface FirestorePluginOptions {
   bindName?: string
   unbindName?: string
   converter?: FirestoreOptions['converter']
   reset?: FirestoreOptions['reset']
   wait?: FirestoreOptions['wait']
 }
 
-const defaultOptions: Readonly<Required<PluginOptions>> = {
+const defaultOptions: Readonly<Required<FirestorePluginOptions>> = {
   bindName: '$bind',
   unbindName: '$unbind',
   converter: firestoreOptions.converter,
@@ -104,7 +104,7 @@ const defaultOptions: Readonly<Required<PluginOptions>> = {
  */
 export const firestorePlugin = function firestorePlugin(
   app: App,
-  pluginOptions: PluginOptions = defaultOptions
+  pluginOptions: FirestorePluginOptions = defaultOptions
 ) {
   // const strategies = app.config.optionMergeStrategies
   // TODO: implement

src/index.ts

@@ -1,10 +1,16 @@
 export {
-  rtdbPlugin,
   bind as rtdbBind,
   unbind as rtdbUnbind,
   useList,
   useObject,
 } from './database'
+
+export { rtdbPlugin } from './database/optionsApi'
+export type { DatabasePluginOptions } from './database/optionsApi'
+
+// TODO: rename and move to database
+export type { RTDBOptions } from './core'
+
 export {
   bind as firestoreBind,
   unbind as firestoreUnbind,
@@ -20,7 +26,7 @@ export type {
 
 export { firestorePlugin } from './firestore/optionsApi'
 export type {
-  PluginOptions,
+  FirestorePluginOptions,
   VueFirestoreObject,
   FirestoreOption,
 } from './firestore/optionsApi'

tests/database/options.spec.ts

@@ -0,0 +1,91 @@
+import { defineComponent } from 'vue'
+import { mount } from '@vue/test-utils'
+import { describe, expect, it, vi } from 'vitest'
+import { rtdbPlugin, DatabasePluginOptions } from '../../src'
+import { setupDatabaseRefs } from '../utils'
+import { push } from 'firebase/database'
+
+const component = defineComponent({ template: 'no' })
+
+describe('RTDB: plugin options', () => {
+  const { databaseRef } = setupDatabaseRefs()
+
+  it('allows customizing $rtdbBind', () => {
+    const wrapper = mount(component, {
+      global: {
+        plugins: [
+          [
+            rtdbPlugin,
+            {
+              bindName: '$myBind',
+              unbindName: '$myUnbind',
+            },
+          ],
+        ],
+      },
+    })
+    expect(typeof (wrapper.vm as any).$myBind).toBe('function')
+    expect(typeof (wrapper.vm as any).$myUnbind).toBe('function')
+  })
+
+  it('calls custom serialize function with a ref', async () => {
+    const pluginOptions: DatabasePluginOptions = {
+      serialize: vi.fn(() => ({ foo: 'bar' })),
+    }
+    const { vm } = mount(
+      {
+        template: 'no',
+        data: () => ({ items: [] }),
+      },
+      {
+        global: {
+          plugins: [[rtdbPlugin, pluginOptions]],
+        },
+      }
+    )
+
+    const itemListRef = databaseRef()
+
+    const p = vm.$rtdbBind('items', itemListRef)
+    push(itemListRef, { text: 'foo' })
+
+    await p
+
+    expect(pluginOptions.serialize).toHaveBeenCalledTimes(1)
+    expect(pluginOptions.serialize).toHaveBeenCalledWith(
+      expect.objectContaining({ val: expect.any(Function) })
+    )
+    expect(vm.items).toEqual([{ foo: 'bar' }])
+  })
+
+  it('can override serialize with local option', async () => {
+    const pluginOptions = {
+      serialize: vi.fn(() => ({ foo: 'bar' })),
+    }
+
+    const items = databaseRef()
+    const { vm } = mount(
+      {
+        template: 'no',
+        data: () => ({ items: [] }),
+      },
+      {
+        global: {
+          plugins: [[rtdbPlugin, pluginOptions]],
+        },
+      }
+    )
+
+    const spy = vi.fn(() => ({ bar: 'bar' }))
+
+    vm.$rtdbBind('items', items, { serialize: spy })
+    await push(items, { text: 'foo' })
+
+    expect(pluginOptions.serialize).not.toHaveBeenCalled()
+    expect(spy).toHaveBeenCalledTimes(1)
+    expect(spy).toHaveBeenCalledWith(
+      expect.objectContaining({ val: expect.any(Function) })
+    )
+    expect(vm.items).toEqual([{ bar: 'bar' }])
+  })
+})

tests/firestore/options.spec.ts

@@ -1,11 +1,9 @@
 import { defineComponent } from 'vue'
 import { mount } from '@vue/test-utils'
 import { describe, expect, it, vi } from 'vitest'
-import { firestorePlugin, PluginOptions, useCollection } from '../../src'
+import { firestorePlugin, FirestorePluginOptions } from '../../src'
 import { addDoc, DocumentData } from 'firebase/firestore'
-import { expectType, setupFirestoreRefs, tds, firestore } from '../utils'
-import { usePendingPromises } from '../../src/firestore'
-import { type Ref } from 'vue'
+import { setupFirestoreRefs } from '../utils'
 
 const component = defineComponent({ template: 'no' })
 
@@ -34,7 +32,7 @@ describe('Firestore: Options API', () => {
   })
 
   it('calls custom serialize function with collection', async () => {
-    const pluginOptions: PluginOptions = {
+    const pluginOptions: FirestorePluginOptions = {
       converter: {
         fromFirestore: vi.fn((snapshot, options?) => ({
           foo: 'bar',
@@ -70,7 +68,7 @@ describe('Firestore: Options API', () => {
   })
 
   it('can be overridden by local option', async () => {
-    const pluginOptions: PluginOptions = {
+    const pluginOptions: FirestorePluginOptions = {
       converter: {
         fromFirestore: vi.fn((snapshot, options?) => ({
           foo: 'bar',

tests/utils.ts

@@ -6,6 +6,7 @@ import {
   query as databaseQuery,
   orderByChild,
   remove,
+  push as databaseAdd,
 } from 'firebase/database'
 import {
   getFirestore,
@@ -132,8 +133,9 @@ export function setupDatabaseRefs() {
     await remove(testsCollection)
   })
 
-  function databaseRef(path: string) {
-    return ref(database, testsCollection.key + '/' + path)
+  function databaseRef(path?: string) {
+    const data = databaseAdd(testsCollection, path)
+    return data.ref
   }
 
   return { itemRef, listRef, orderedListRef, testId, databaseRef }