|
| 1 | +/** |
| 2 | + * @vitest-environment node |
| 3 | + */ |
| 4 | +import { mount } from '@vue/test-utils' |
| 5 | +import { beforeEach, describe, it, expect, afterEach } from 'vitest' |
| 6 | +import { |
| 7 | + CollectionReference, |
| 8 | + doc as originalDoc, |
| 9 | + DocumentData, |
| 10 | + DocumentReference, |
| 11 | +} from 'firebase/firestore' |
| 12 | +import { setupFirestoreRefs, sleep, firebaseApp } from '../utils' |
| 13 | +import { onServerPrefetch, ShallowUnwrapRef, unref } from 'vue' |
| 14 | +import { _InferReferenceType, _RefFirestore } from '../../src/firestore' |
| 15 | +import { |
| 16 | + UseDocumentOptions, |
| 17 | + UseCollectionOptions, |
| 18 | + usePendingPromises, |
| 19 | + VueFirestoreQueryData, |
| 20 | + useDocument, |
| 21 | + useCollection, |
| 22 | +} from '../../src' |
| 23 | +import { _MaybeRef, _Nullable } from '../../src/shared' |
| 24 | +import { Component, createSSRApp, inject, ref, computed, customRef } from 'vue' |
| 25 | +import { renderToString, ssrInterpolate } from '@vue/server-renderer' |
| 26 | +import { clearPendingPromises, getInitialData } from '../../src/ssr/plugin' |
| 27 | + |
| 28 | +describe('Firestore refs in documents', async () => { |
| 29 | + const { collection, query, addDoc, setDoc, updateDoc, deleteDoc, doc } = |
| 30 | + setupFirestoreRefs() |
| 31 | + |
| 32 | + beforeEach(() => { |
| 33 | + clearPendingPromises(firebaseApp) |
| 34 | + }) |
| 35 | + |
| 36 | + function createMyApp<T>( |
| 37 | + setup: () => T, |
| 38 | + render: (ctx: ShallowUnwrapRef<Awaited<T>>) => unknown |
| 39 | + ) { |
| 40 | + const App = { |
| 41 | + ssrRender(ctx: any, push: any, _parent: any) { |
| 42 | + push(`<p>${ssrInterpolate(render(ctx))}</p>`) |
| 43 | + }, |
| 44 | + setup, |
| 45 | + } |
| 46 | + |
| 47 | + const app = createSSRApp(App) |
| 48 | + |
| 49 | + return { app } |
| 50 | + } |
| 51 | + |
| 52 | + function factoryCollection<T = DocumentData>({ |
| 53 | + options, |
| 54 | + ref = collection(), |
| 55 | + }: { |
| 56 | + options?: UseCollectionOptions |
| 57 | + ref?: _MaybeRef<_Nullable<CollectionReference<T>>> |
| 58 | + } = {}) { |
| 59 | + let data!: _RefFirestore<VueFirestoreQueryData<T>> |
| 60 | + |
| 61 | + const wrapper = mount({ |
| 62 | + template: 'no', |
| 63 | + setup() { |
| 64 | + // @ts-expect-error: generic forced |
| 65 | + data = |
| 66 | + // split for ts |
| 67 | + useCollection(ref, options) |
| 68 | + const { data: list, pending, error, promise, unbind } = data |
| 69 | + return { list, pending, error, promise, unbind } |
| 70 | + }, |
| 71 | + }) |
| 72 | + |
| 73 | + return { |
| 74 | + wrapper, |
| 75 | + // to simplify types |
| 76 | + listRef: unref(ref)!, |
| 77 | + // non enumerable properties cannot be spread |
| 78 | + data: data.data, |
| 79 | + pending: data.pending, |
| 80 | + error: data.error, |
| 81 | + promise: data.promise, |
| 82 | + unbind: data.unbind, |
| 83 | + } |
| 84 | + } |
| 85 | + |
| 86 | + function factoryDoc<T = DocumentData>({ |
| 87 | + options, |
| 88 | + ref, |
| 89 | + }: { |
| 90 | + options?: UseDocumentOptions |
| 91 | + ref?: _MaybeRef<DocumentReference<T>> |
| 92 | + } = {}) { |
| 93 | + let data!: _RefFirestore<VueFirestoreQueryData<T>> |
| 94 | + |
| 95 | + const wrapper = mount({ |
| 96 | + template: 'no', |
| 97 | + setup() { |
| 98 | + // @ts-expect-error: generic forced |
| 99 | + data = |
| 100 | + // split for ts |
| 101 | + useDocument(ref, options) |
| 102 | + const { data: list, pending, error, promise, unbind } = data |
| 103 | + return { list, pending, error, promise, unbind } |
| 104 | + }, |
| 105 | + }) |
| 106 | + |
| 107 | + return { |
| 108 | + wrapper, |
| 109 | + listRef: unref(ref), |
| 110 | + // non enumerable properties cannot be spread |
| 111 | + data: data.data, |
| 112 | + pending: data.pending, |
| 113 | + error: data.error, |
| 114 | + promise: data.promise, |
| 115 | + unbind: data.unbind, |
| 116 | + } |
| 117 | + } |
| 118 | + |
| 119 | + it('can await within setup', async () => { |
| 120 | + const docRef = doc<{ name: string }>() |
| 121 | + await setDoc(docRef, { name: 'a' }) |
| 122 | + const { app } = createMyApp( |
| 123 | + async () => { |
| 124 | + const { data, promise } = useDocument(docRef) |
| 125 | + await promise.value |
| 126 | + return { data } |
| 127 | + }, |
| 128 | + ({ data }) => data.name |
| 129 | + ) |
| 130 | + |
| 131 | + expect(await renderToString(app)).toBe(`<p>a</p>`) |
| 132 | + }) |
| 133 | + |
| 134 | + it('can await outside of setup', async () => { |
| 135 | + const docRef = doc<{ name: string }>() |
| 136 | + await setDoc(docRef, { name: 'hello' }) |
| 137 | + const { app } = createMyApp( |
| 138 | + () => { |
| 139 | + const data = useDocument(docRef) |
| 140 | + return { data } |
| 141 | + }, |
| 142 | + ({ data }) => data.name |
| 143 | + ) |
| 144 | + |
| 145 | + expect(await renderToString(app)).toBe(`<p>hello</p>`) |
| 146 | + }) |
| 147 | +}) |
0 commit comments