How to detect when error is thrown by firestore

How do I detect if any error is thrown by firebase? I want to notify the user.
the err is thrown whenever a request to sent to firebase without an internet connection.

For example:

@firebase/firestore: Firestore (8.1.2): Could not reach Cloud Firestore backend. Connection failed 1 times. Most recent error: FirebaseError: [code=unavailable]: The operation could not be completed
This typically indicates that your device does not have a healthy Internet connection at the moment. The client will operate in offline mode until it is able to successfully connect to the backend.

Capture

Hi @samolex,

Could you show the code related to Firestore in your app?

Thanks!

sure, I can show you

I have two actually

export const getCollection = async ({ field, operator , value, limit = 5 } ) => {
  const items = {};

  await firestore
    .collection('products')
    .where(field, operator, value)
    .limit(limit)
    .get()
    .then(querySnapshot => {
      return querySnapshot.forEach(doc => {
        items[doc.id] = doc.data();
      });
    });

  return items;
};

 useEffect(() => {
    if (!id) return;

    const productRef = firestore.collection('products').doc(id);

    const unsubscribeFromListener = productRef.onSnapshot(doc => {
      setSelectedProduct(doc.data());

      return () => unsubscribeFromListener();
    });
  }, []);

@samolex what I was able to find: https://firebase.google.com/docs/database/web/offline-capabilities#section-connection-state.

Example with React:

const connectionRef = React.useRef(firebase.database().ref(".info/connected"))

connectionRef.current.on("value", function(snap) {
  if (snap.val() === true) {
    alert("connected");
  } else {
    alert("not connected");
  }
});
1 Like

Issue now is that I am using cloud firestore and not realtime database.

I’m not very familiar with Firebase but what about:

db.collection('cities')
  .onSnapshot((snapshot) => {
    //...
  }, (error) => {
    //...
  });

So you need to add an error handler as a callback to onSnapshot.

Thank you so far for your help!

I tried it, but didn’t work. I guess it doesn’t handle such error…

I even added a .catch(console.log) to the first code, wrapped the second with try...catch - all is the same

@samolex If you don’t find a better solution, try to handle it globally by tracking window events:

window.addEventListener('error', function(event) { ... })
1 Like

Adding error listener. I seen something like this before but I haven’t used it.

How will i know that the error was thrown by firebase script.

Try to check what error object has inside. There should be some metadata that will help you identify that this error comes from the Firebase.

1 Like

Let me try that. I will give you feedback

It’s not catching it. I think it’s a console.error statement. See what I did:

    window.addEventListener('error', console.log)
    console.error('error') // has the same kind of attribute as the firebase message
    throw 6

Sorry, I cannot help unless you can recreate the exact behavior, for example, on https://repl.it, so I can check myself.