Multi-App Setup seems to fall back to the default app regardless of app entry point.

[Ayiga]

Issue

Environment

1. Application Target Platform: Both

2. Development Operating System: macOS High Sierra 10.13.3 (17D47)

3. Build Tools: N/A

4. React Native version: 0.53.3

5. RNFirebase Version: 3.2.5

6. Firebase Module: auth (likely affects all modules)

Greetings,

I'm attempting to use multiple Apps using the initializeApp method as outlined in the documentation on rnfirebase.io, but I'm getting stuck on Authentication. It seems as though, regardless of which App I am using it still falls back to the [DEFAULT] app.

I've looked through the source to try and pin-point why this is occurring, and I believe the issue is caused by attempting to index the APP_MODULES by the App object itself. Since Javascript object's are only able to have string or Symbols as their keys, this forces the App to be converted to a string. With no implementation of the toString method this falls back to the default Object toString method, of '[object Object]'. Because of this, all created App Modules will be referencing the same app.

The easiest way to detect this is to create a project with react-native-firebase, have a native app setup, and sign in to it. Now create a new app using initializeApp, and then call the onAuthStateChanged. You should get a result that returns the user for the '[DEFAULT_APP]' instead of null or a user for the second app.

It seems that the simplest solution to this issue is to add a toString method to the App class so that it returns the app's name.

  /**
   * toString returns the name of the app.
   *
   * @return {string}
   */
  toString() {
    return this._name;
  }

This is what I've done currently to fix the issue. Another possible solution would be to switch out the Javascript Object Literal for a Map. Although that may cause issues with the javascript Environment, and could require the runtime to have a polyfill. I'm not sure if it has this polyfill by default.

const APP_MODULES: Map<App, FirebaseModule> = new Map();

The last option that would work would be to modify the Javascript Object Literal so that it uses a string as a key, and modify the modules so that they use the app's name.
Lines to Modify 1

Lines to Modify 1

Lines to Modify 2

  /**
   *
   * @param statics
   * @param InstanceClass
   * @return {function()}
   * @private
   */
  appModule<M: FirebaseModule>(
    app: App,
    namespace: FirebaseNamespace,
    InstanceClass: Class<M>
  ): () => FirebaseModule {
    return (): M => {
      if (!APP_MODULES[app.name]) {
        APP_MODULES[app.name] = {};
      }

      if (
        isAndroid &&
        namespace !== 'utils' &&
        !INTERNALS.FLAGS.checkedPlayServices
      ) {
        INTERNALS.FLAGS.checkedPlayServices = true;
        app.utils().checkPlayServicesAvailability();
      }

      if (!APP_MODULES[app.name][namespace]) {
        APP_MODULES[app.name][namespace] = new InstanceClass(app, app.options);
      }

      return APP_MODULES[app.name][namespace];
    };
  },

There may be more ways to address this issue as well, but these seem like fairly simple changes.

As I said, I used the first method, but it's all personal preference. I can open a Pull Request with the method that best suits your style.

Please let me know,

Thanks,

~ Ayiga

[Salakar]

Thanks for this well written issue report 💯

Have just pushed a fix for this, went with the toString() approach - thanks for all the suggested fixes.

Will publish a patch version to npm shortly.