React-native-firebase: Returning Reference instance from async await method causes an exception.

[keshavkaul]

Issue

Below code writes 'Failure' to the console:

const fetchRef = async (todoId) => {
    const ref = database()
        .ref('todos')
        .child(todoId);

    await ref.onDisconnect().cancel();
    await ref.onDisconnect().remove();
    return ref;
};

fetchRef('123')
    .then(ref => console.log('Success', ref))
    .catch(err => console.log('Failure', err));

Environment

1. Application Target Platform:

Both (iOS, Android)

1. Development Operating System:

macOS High Sierra

1. Build Tools:

Xcode

1. React Native version:

0.56.0

1. React Native Firebase Version:

4.3.8

1. Firebase Module:

database

1. Are you using typescript?

no

1. Stacktrace

Error: Cannot read property 'then' of undefined.
    at Reference.then (Reference.js:465)
    at tryCallTwo (core.js:45)
    at doResolve (core.js:200)
    at new Promise (core.js:66)
    at Function.Promise.resolve (es6-extensions.js:38)
    at invoke (runtime.js:168)
    at runtime.js:162
    at tryCallOne (core.js:37)
    at core.js:123
    at JSTimers.js:294

---

Loving react-native-firebase? Please consider supporting them with any of the below:

• 👉 Back financially via Open Collective
• 👉 Follow React Native Firebase and Invertase on Twitter
• 👉 Star this repo on GitHub ⭐️

[keshavkaul]

The issue occurs because the Reference instance has a then method and returning the reference from an async method causes the javascript environment to call the reference's then method. Inside the then method of Reference is implemented logic to throw an error if no promise is currently active.

A quick fix for this issue is to return the reference wrapped in an object.

[keshavkaul]

@salakar @Ehesp Do let me know if I can help in fixing this.

[reimertz]

I just ran intio this issue in combination with react-redux-firebase while uploading files. I assumed the issue was on my side of things but then found this issue.

[iggyfisk]

Ran into the same problem, but while creating a promise like

return new Promise((resolve, reject) => {
  resolve(firebase.database().ref());
});

results in the same Cannot read property 'then' of undefined stack trace.

[Salakar]

Related to https://github.com/invertase/react-native-firebase/issues/893

Will look at getting support for this in. The issue is with Database Reference not being a real ThenableReference like the web sdk does - so needs a small bit of rework to match the web sdk.

Let's close this issue and track this on the other issue as both will be fixed after the rework and both are caused by the same underlying issue (ThenableReference).

---

Loving react-native-firebase and the support we provide? Please consider supporting us with any of the below:

• 👉 Back financially via Open Collective
• 👉 Follow React Native Firebase and Invertase on Twitter
• 👉 Star this repo on GitHub ⭐️

[secobarbital]

Actually this is a different problem: the issue here is that a simple ref has a .then method even though it has no future value, whereas #893 seems to be the opposite problem of not having .then when it should.

If you look at the Firebase JS SDK, the .then and .catch methods are only attached if there is a future value, so if we are reworking to match the JS SDK exactly, then we should be fine tracking it in the other issue.

I just tested with the latest JS SDK and confirmed it does not have this problem.

In the meantime, as a workaround, I am setting .then to null on references manually before passing it to .then-sensitive containers, like redux-saga in my case.

[Salakar]

@secobarbital I don't mean they're the same problems - I mean it's the same underlying cause - ThenableReference implementation needs a rework.

You're correct though, we'd match the JS SDK.

[Salakar]

Have just pushed a re-write of the push() logic to match the Web SDK.

Have added test cases from this issue and others which can be seen working here: https://github.com/invertase/react-native-firebase/blob/database-fixes/tests/e2e/database/ref/push.js#L73

This will land in v5.1.0, apologies for the delay on this one.

---

Loving react-native-firebase and the support we provide? Please consider supporting us with any of the below:

• 👉 Back financially via Open Collective
• 👉 Follow React Native Firebase and Invertase on Twitter
• 👉 Star this repo on GitHub ⭐️