Crashing on signInAndRetrieveDataWithCredential()

[0paIescent]

Target Platform: Android
OS: Solus 3.9999

Build Tools: 27.0.3
RN: 0.55.4
RNFirebase: 4.2.0

Issue:

When running firebase.auth().signInAndRetrieveDataWithCredential(), the app crashes. But it only crashes when I pass in a credential from firebase.auth.TwitterAuthProvider.credential(). It works just fine when I run it with a Facebook or Google credential, but it doesn't like the one from Twitter.

Code:

import { NativeModules } from 'react-native';
const { RNTwitterSignIn } = NativeModules;
import firebase from 'react-native-firebase';

async function signInWithTwitter() {
    try {
        RNTwitterSignIn.init(<key>, <secret>);
        const { authToken, authTokenSecret } = await RNTwitterSignIn.logIn();
        const credential = firebase.auth.TwitterAuthProvider.credential(authToken, authTokenSecret);
        const resp = await firebase.auth().signInAndRetrieveDataWithCredential(credential);
        // ^^^ crashes here ^^^ //
    } catch (err) {
        console.log(err)
    }
}

Both the token and secret are coming back from twitter just fine, and the credential is created properly too, so I'm not quite sure what else the issue could be. I can post any other files if needed to identify the problem, just let me know and I'll add them as soon as I can.

[Salakar]

@0paIescent could you check the android adb logs output to retrieve the native error and let us know what it says?

Thanks

[0paIescent]

@Salakar I'm actually looking into it right now coincidentally, it's throwing an IllegalArgumentException in promiseWithAuthResult() in RNFirebaseAuth.java. It can't convert org.json.JSONObject. It calls mapPutValue(), this then calls makeNativeMap(). Here it calls addEntry() on each of the items in the map, and inside addEntry() is where the error is thrown.

react-native-firebase/androidsrc/main/java/io/invertase/firebase/auth/RNFirebaseAuth.java:
Line: 1349

...
if (authResult.getAdditionalUserInfo().getProfile() != null) {
  Utils.mapPutValue("profile", authResult.getAdditionalUserInfo().getProfile(), additionalUserInfoMap);
  // ^^^^^ Error here ^^^^^
}
...

The getProfile() calls properly as I can log the data from it, so everything gets passed in properly.

react-native-firebase/androidsrc/main/java/io/invertase/firebase/Utils.java:
Line: 45

...
else if (Map.class.isAssignableFrom(value.getClass())) {
  map.putMap(key, Arguments.makeNativeMap((Map<String, Object>) value));
  // ^^^^^ Error here ^^^^^
}
...

react-native/ReactAndroid/src/main/java/com/facebook/react/bridge/Arguments.java:
Line: 127

...
for (Map.Entry<String, Object> entry : objects.entrySet()) {
  addEntry(nativeMap, entry.getKey(), entry.getValue());
  // ^^^^^ Error here ^^^^^
}
...

Hopefully that was everything you needed, let me know if you want anything else. Thanks for responding so promptly too by the way!

[Salakar]

@0paIescent thanks for the extra information, helpful! Are you able to log out / inspect authResult.getAdditionalUserInfo().getProfile() from your first code block - obscure any sensitive info if need be, just trying to get a picture of the data types

[0paIescent]

RNFirebaseAuth: signInWithCredential:onComplete:success
RNFirebaseAuth: entities:{description={urls=[]}} Type: android.support.v4.util.ArrayMap
RNFirebaseAuth: verified:false Type: java.lang.Boolean
RNFirebaseAuth: listed_count:xxx Type: java.lang.Integer
RNFirebaseAuth: statuses_count:xxx Type: java.lang.Integer
RNFirebaseAuth: profile_text_color:333333 Type: java.lang.String
RNFirebaseAuth: description: Type: java.lang.String
RNFirebaseAuth: friends_count:xxx Type: java.lang.Integer
RNFirebaseAuth: suspended:false Type: java.lang.Boolean
RNFirebaseAuth: profile_sidebar_border_color:C0DEED Type: java.lang.String
RNFirebaseAuth: id_str:xxx Type: java.lang.String
RNFirebaseAuth: profile_background_image_url:null Type: org.json.JSONObject$1
RNFirebaseAuth: geo_enabled:true Type: java.lang.Boolean
RNFirebaseAuth: status:{entities={symbols=[], user_mentions=[{id_str=xxx, screen_name=xxx, id=xxx, name=xxx, indices=xxx}], urls=[], hashtags=[]}, favorited=true, favorite_count=xxx, in_reply_to_user_id_str=null, id_str=xxx, is_quote_status=false, source=xxx, retweeted=true, in_reply_to_screen_name=null, id=xxx, geo=null, lang=en, text=xxx, place=null, retweeted_status={entities={symbols=[], user_mentions=[], urls=[], hashtags=[]}, favorited=true, favorite_count=xxx, in_reply_to_user_id_str=null, id_str=xxx, is_quote_status=false, source=xxx, retweeted=true, in_reply_to_screen_name=null, id=xxx, geo=null, lang=en, text=xxx, place=null, created_at=xxx, contributors=null, in_reply_to_status_id_str=null, truncated=false, retweet_count=xxx, coordinates=null, in_reply_to_status_id=null, in_reply_to_user_id=null}, created_at=xxx, contributors=null, in_reply_to_status_id_str=null, truncated=false, retweet_count=xxx, coordinates=null, in_reply_to_status_id=null, in_reply_to_user_id=null} Type: android.support.v4.util.ArrayMap
RNFirebaseAuth: profile_image_url_https:xxx Type: java.lang.String
RNFirebaseAuth: protected:false Type: java.lang.Boolean
RNFirebaseAuth: translator_type:none Type: java.lang.String
RNFirebaseAuth: followers_count:xxx Type: java.lang.Integer
RNFirebaseAuth: default_profile:true Type: java.lang.Boolean
RNFirebaseAuth: profile_image_url:xxx Type: java.lang.String
RNFirebaseAuth: profile_use_background_image:true Type: java.lang.Boolean
RNFirebaseAuth: screen_name:xxx Type: java.lang.String
RNFirebaseAuth: id:xxx Type: java.lang.Long
RNFirebaseAuth: url:null Type: org.json.JSONObject$1
RNFirebaseAuth: lang:en Type: java.lang.String
RNFirebaseAuth: name:xxx Type: java.lang.String
RNFirebaseAuth: time_zone:null Type: org.json.JSONObject$1
RNFirebaseAuth: email: Type: java.lang.String
RNFirebaseAuth: favourites_count:xxx Type: java.lang.Integer
RNFirebaseAuth: has_extended_profile:true Type: java.lang.Boolean
RNFirebaseAuth: profile_sidebar_fill_color:DDEEF6 Type: java.lang.String
RNFirebaseAuth: default_profile_image:false Type: java.lang.Boolean
RNFirebaseAuth: is_translator:false Type: java.lang.Boolean
RNFirebaseAuth: follow_request_sent:false Type: java.lang.Boolean
RNFirebaseAuth: profile_background_image_url_https:null Type: org.json.JSONObject$1
RNFirebaseAuth: contributors_enabled:false Type: java.lang.Boolean
RNFirebaseAuth: following:false Type: java.lang.Boolean
RNFirebaseAuth: profile_background_tile:false Type: java.lang.Boolean
RNFirebaseAuth: notifications:false Type: java.lang.Boolean
RNFirebaseAuth: created_at:Sat Feb 25 02:28:59 +0000 2017 Type: java.lang.String
RNFirebaseAuth: profile_link_color:1DA1F2 Type: java.lang.String
RNFirebaseAuth: profile_background_color:F5F8FA Type: java.lang.String
RNFirebaseAuth: needs_phone_verification:false Type: java.lang.Boolean
RNFirebaseAuth: is_translation_enabled:false Type: java.lang.Boolean
RNFirebaseAuth: utc_offset:null Type: org.json.JSONObject$1
RNFirebaseAuth: location:xxx Type: java.lang.String

I believe the issue is just that addEntry() doesn't support JSONObjects, but JSON packages don't seem to be available in React Native's code

[Salakar]

@0paIescent thought it might be random data types causing it to crash, you're right it is the JSONObjects, RN's Arguments class doesn't handle these 🙈

Not sure the best way to approach a fix for this, might be worth adding in a custom util to handle profile conversion to a Map<String, Object>, will have a think through this, it might be worth just sending any JSONObjects back as their string representation (.toString()) and letting JS land handle this in user code, or we internally do something to parse it.

Thanks for helping debug

[0paIescent]

@Salakar Yeah, as anti-pattern as it is, I think I'll just end up using toString() and dealing with it in js, the silly part is, I don't really even need any of the additionalUserInfo. I was thinking of going in and import JSONObject to check for instanceof on that, and then convert from there, but I couldn't for the life of me get anything to do with JSON imported into Java. I'm much less versed in Java than I'd like to admit haha. And thank's for the suggestions, hopefully that fixes everything.

[0paIescent]

Sadly, I think the only way to modify the source files for React Native would be to build it from source. I'll test that out later and let you know what I find out.

[Salakar]

@0paIescent your best bet would be to make a local change to support it in your node_modules for this library and rebuild your android app to test

[itome]

I had exactly same issue and forked this repository to make workaround in native code, But I hope I can fix it with only javascript code. Any ideas can be helpfull.

[0paIescent]

The way I fixed it was by adding an else if to the addEntry function in com.facebook.react.bridge.Arguments.java like this: else if (value.getClass().getName() == "org.json.JSONObject$1") { nativeMap.putString(key, (String) value.toString()); } This resolves the issue entirely since JS automatically converts stringified JSON into a JS Object. You will need to build React Native from source, but it's a lot easier than the docs make it out to be. I can explain it to you more in depth tomorrow, it's getting late here.

[itome]

@0paIescent Thank you for your answer!! It is better way to fix this issue.
And I have one additional question, did you fork react native project or download source to your project to fix the code? I don't manage react-native source code under git, so my local change won't be applied to other project members.

[0paIescent]

l just used the source code from node_modules and built the archives from that.

[itome]

@0paIescent Thanks.

[Salakar]

@0paIescent @itome have pushed a fix for this as part of React Native Firebase, could you try af43576 locally and let me know how you get on, thanks - no modifications to RN needed.

If all is well this will be part of Tuesday's v4.3.0 release.

Side thought as well, not sure how this will look on iOS and if it's also an issue there?

---

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 ⭐️

[itome]

@Salakar Thank you for fixing. I downloaded the commit and every thing works well in my local computer!!

[0paIescent]

@Salakar I'll give it a try here in a bit, thanks for making that by the way. If I had the time I would've tried to push something up but oh well.

[0paIescent]

Fixed it! Thanks for all the help! @Salakar

[Salakar]

@0paIescent @itome no worries! 4.3.0 will be released later today. Thanks for testing 👌

---

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 ⭐️

[Salakar]

@0paIescent @itome thanks for your help on this, the fix is now live in the v4.3.0 release.

---

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 ⭐️