🔥 🧪 Insight: Attempted Universal Firebase Utility to Mimic Web SDK in RNFB — Sharing for Feedback & Reference

[Froredion]

Hey RNFirebase team! I know you’re working hard on making React Native Firebase behave more like the Firebase Web JS SDK — and I appreciate that.

In the meantime, I tried building a universal utility to let me write Firebase code as if I was using the Web SDK, but I’m running into several issues that make it unusable right now.

Here’s the general idea:

const s = firestore();
let collec = s.collection('organization_invites');
collec = collec.where('organizationId', '==', organizationId);
collec = collec.where('status', '==', 'pending');

But RNFB throws a bunch of errors and internally treats it like collec with an unknown path. I'm using Expo, and I'm just trying to make my app stable through a firestoreCompat.ts file that works both on Web and Mobile. Yes, collec prints unknown path.

Honestly, I gave up debugging after a while 😅 — just too many weird bugs I couldn’t trace down. I suspect the underlying RNFB query chain behavior is different from the Web SDK. Happy to share my code if that helps, although it’s messy.

---

Project Files

firestoreCompat.ts

firebase.json:

{
  "emulators": {
    "auth": {
      "port": 9099,
      "host": "0.0.0.0"
    },
    "firestore": {
      "port": 8080,
      "host": "0.0.0.0"
    },
    "storage": {
      "port": 9199,
      "host": "0.0.0.0"
    },
    "ui": {
      "enabled": true,
      "port": 4000,
      "host": "0.0.0.0"
    },
    "singleProjectMode": true
  },
  "storage": {
    "rules": "firebase/storage.rules"
  },
  "firestore": {
    "rules": "firestore.rules"
  }
}

---

Android

Click To Expand

• my application is an AndroidX application?

• I am using jetifier?

• I am using the NPM package jetifier?

• Platform you're seeing the issue on:

  • iOS
  • Android
  • Both

• react-native-firebase version:

  • Using the latest available version

• Firebase module(s) used:

  • Firestore

• Are you using TypeScript?

  • Yes

---

Additional Notes

I’m just hoping for some compatibility fixes or tips on how to better mimic Firebase JS SDK syntax in RNFB without breaking things.

I thought maybe it's more smarter that way but I've been debugging for 2 whole day straight now so no thanks 😅
Gave the code for reference, hoping maybe it'd help the developers.

Thanks for all the hard work! 🙏

[mikehardy]

Hey there - what would help is not the general idea but specific code that works with firebase-js-sdk but fails in react-native-firebase - I'm not aware of many cases like that with firestore (or...any at the moment?) but either way it'll need to be a self-contained example that demonstrates the issue - https://en.wikipedia.org/wiki/Minimal_reproducible_example

Ideally an App.js that can just drop into an existing demonstrator and run

[Froredion]

Hey, appreciate your response! 🙏

Just to clarify, I wasn’t using firebase-js-sdk directly — I built a firebase-js-sdk-like utility on top of react-native-firebase, so when v22 drops, I’d only have to tweak one script instead of editing stuff all over the place 😅

That said, I’ve decided to give up on maintaining it and just open-source the code in case it helps anyone or gives some insight 🔓. I’ll still try my best to make a minimal reproducible example. Thanks again!

[MichaelVerdon]

Hey there @Froredion let me know as soon as you have an example and I will be happy to investigate 😄