createSourceWithParams - threeDSecure Android Source not fires

Before I have submitted the issue

[x] I have read an installation guide
[x] I know that for an iOS I need to install pods because I’ve read the installation guide
[x] I have read a linking guide and checked that everything is OK like in manual linking guide
[x] I know that before using tipsi-stripe I need to set options for my app as described in usage guide

The problem

I would like to use createSourceWithParams with “threeDSecure” type, and on iOS works fine, but on android when I am returning to the app from browser, there is no promise fires, and have no Source object.

Environment

• tipsi-stripe version: 7.4.0
• iOS or Android: Android
• React-Native version: 0.56.0

For Android, please provide the following sections from android/app/build.gradle:

• android.compileSdkVersion: 26
• android.buildToolsVersion: 26.0.3
• android.defaultConfig.minSdkVersion: 16
• android.defaultConfig.targetSdkVersion: 26

Code To Reproduce Issue (Good To Have)

pay = async (mutation, deal) => {
    let paymentRequest;
    try {
      paymentRequest = await stripe.paymentRequestWithCardForm({
        ...options,
        createCardSource: true
      });
      const threeDSecure = Platform.OS === "android"
        ? paymentRequest.card.three_d_secure
        : paymentRequest.details.three_d_secure;
      if (threeDSecure === "recommended" || threeDSecure === "required") {
        let prefix = Platform.OS === "android"
          ? `my-app://my-app/stripe-redirect`
          : `my-app://stripe-redirect`;
        let secure3dSourceResponse = null;
        try {
          const { dealFeeUSD } = this.state;
          secure3dSourceResponse = await stripe.createSourceWithParams({
            type: "threeDSecure",
            amount: dealFeeUSD || 3000,
            currency: "USD",
            flow: "redirect",
            returnURL: prefix,
            card: paymentRequest.sourceId
          });
         //  iOS works fine at this point
          // When returning from stripe page, the promise should fires here!!!
          console.log('secure3dSourceResponse', secure3dSourceResponse)
        } catch (error) {
          console.log('secure3dSourceResponse', secure3dSourceResponse);
        }
      } else {
        if (paymentRequest && paymentRequest.tokenId) {
          this.handlePayDeal(mutation, deal, paymentRequest.tokenId);
        }
      }
    } catch (error) {
      console.log(`Error is: ${error}`);
    }
  };

[lukebrandonfarrell]

@fabicsp solved it this morning. You need to use a second scheme on Android if you are already using custom schemes (e.g. deeplinks), for example my.custom.scheme.tipsi, and use the full class name on the activity com.gettipsi.stripe.RedirectUriReceiver. Here is our working code:

<activity android:name="com.gettipsi.stripe.RedirectUriReceiver">
        <intent-filter>
          <action android:name="android.intent.action.VIEW" />
          <category android:name="android.intent.category.DEFAULT" />
          <category android:name="android.intent.category.BROWSABLE" />
          <data android:scheme="my.custom.scheme.tipsi" tools:replace="android:scheme" />
        </intent-filter>
  </activity>

Then in JS we are using com.redu.ashleigh.tipsi://stripe-redirect as the return URL.

[scaralfred]

@lukebrandonfarrell Thanks for you answers. Your library is great, it does not support third party payement though (like Alipay in my case). I understand you no longer have access to the cose, but if you remember (in terms of UX) the answer at question number 1, that would be super useful… but if you dont remember it I would understand too. Thanks for your help anyway 👍