bug: ssrServer ENOENT firestore.proto

Describe the Bug

Have previously released/deployed without any problems. Tried to release tonight and when loading a page that relies on a load function with a Firebase call, it fails. Other pages seem to work.

This is the load function:

import { fetchProducts } from "$lib/stripeutils";
export async function load({ page, fetch, session, stuff }) {
    const products = await fetchProducts();
    return {
        props: {
            products,
        },
    };
}

This is the fetchProducts function

import { firestore, functions } from "$lib/firebase/client";
import { getDocs, query, where, orderBy, doc, addDoc, collection, onSnapshot } from 'firebase/firestore';
[...]

export async function fetchProducts() {
    let products = {
        [...]
    };

    const docSnap = await getDocs(query(
        collection(firestore(), "products"),
        where("active", "==", true),
        orderBy("metadata.order")
    ));
    
    await Promise.all(docSnap.docs.map(async (doc) => {
        let product = {
            [...]
        };

        const priceSnap = await getDocs(query(
            collection(doc.ref, "prices"),
            where("active", "==", true)
        ));

        priceSnap.docs.forEach((pdoc) => {
            const price = {
                [...]
            };

            product.prices = [price, ...product.prices];
        });

        const type = product.metadata.type || "addon";
        products[type].items.push(product);
    }));

    return products;
}

The firestore function

import { initializeApp, getApps } from "firebase/app";
import { getFirestore } from 'firebase/firestore';
[...]

const config = {
    [...]
};

function firebase() {
    return getApps().length === 0 ? initializeApp(config) : getApps()[0];
}

function firestore() {
	return getFirestore(firebase());
}

---

The errors:

ssrServer

[2021-10-28T07:36:58.392Z]  @firebase/firestore: Firestore (9.0.0): INTERNAL UNHANDLED ERROR:  Error: ENOENT: no such file or directory, open '/workspace/ssrServer/src/protos/google/firestore/v1/firestore.proto' 

Error: ENOENT: no such file or directory, open '/workspace/ssrServer/src/protos/google/firestore/v1/firestore.proto'
    at Object.openSync (fs.js:498:3)
    at Object.readFileSync (fs.js:394:35)
    at fetch2 (/workspace/ssrServer/index.js:11082:30)
    at Root2.load2 [as load] (/workspace/ssrServer/index.js:11111:11)
    at Root2.loadSync (/workspace/ssrServer/index.js:11121:19)
    at Object.loadProtosWithOptionsSync (/workspace/ssrServer/index.js:14289:31)
    at Object.loadSync (/workspace/ssrServer/index.js:14440:33)
    at loadProtos (/workspace/ssrServer/index.js:106181:43)
    at newConnection (/workspace/ssrServer/index.js:106185:20)
    at OnlineComponentProvider2.createDatastore (/workspace/ssrServer/index.js:109513:26) 

Steps to Reproduce

Have previously deployed without issue, however this is my first release where I’ve used a Firestore call inside a page’s load function. Mainly looking for a place to start my debugging for something like this.

Expected Behaviour

Code should work fine?

svelte-adapter-firebase version

0.9.2

sveltejs/kit version

1.0.0.next.160

[jthegedus]

Removing that external: ['firebase'] snippet causes this locally in my Svelte terminal:

11:36:28 AM [vite] Error when evaluating SSR module /node_modules/@firebase/functions/dist/index.esm2017.js?v=82ef9ed5: ReferenceError: self is not defined at eval (/node_modules/@firebase/functions/dist/index.esm2017.js?v=82ef9ed5:674:30) at async instantiateModule (/node_modules/vite/dist/node/chunks/dep-85dbaaa7.js:66541:9)

Looks like this issue: firebase/firebase-js-sdk#4846 so I used the workaround and dynamically load the functions lib client-side only.

This is exactly what I mean when I say Firebase still has many bugs when working with Vite/Kit. I have not been pursuing resolving those bugs here for the firebase SDKs because they’re not yet worked out upstream.

The dynamic import of the lib client-side is what I do for all firebase libs, with load data coming from Kit endpoints that use firebase-admin. It is the only way I have been able to get this all to work as of ~3 months ago and I haven’t revisited since.

[jthegedus]

@jthegedus off topic in a way, but do you have a code example of importing firebase-admin in a server route?

This is what I was testing with:

// src/lib/firebase/admin.js
import admin from "firebase-admin";

const app = admin.apps.length === 0 ? admin.initializeApp() : admin.apps[0];
const firestore = admin.firestore(app);

export { firestore };

// src/routes/blog/[slug].json.js
import { firestore } from '$lib/firebase/admin';

export async function get(request) {
	const slug = request.params.slug;
	console.log(`SvelteKit Endpoint: ${request.path}`);
	const postPageSnapshot = await firestore.doc(`posts/${slug}`).get();

Importantly I was using firebase-admin@9.12.0 at the time and when v10 released did not upgrade because it had issues. v9 didn’t require anything special. While I generally do recommend updating to the latest packages, server-side code is less critical and firebase-admin@9 is very stable