Android CardField getting invalid card details

[142hitesh]

Describe the bug
While adding card details in CardField in android getting Invalid card details even it's correct on onCardChanged. Also not getting last4 it's returning null.

Note : Same things working in iOS.

CardFieldInputDetails(complete: true, last4: null, expiryMonth: 5, expiryYear: 23, postalCode: null, brand: null, number: null, cvc: null, validExpiryDate: CardValidationState.Valid, validCVC: CardValidationState.Valid, validNumber: CardValidationState.Valid)

To Reproduce
Steps to reproduce the behavior:

1. Entering card number 4242424242424242 into the cardfield.
2. Entering expiry date and cvc.
3. It's getting error symbol on card icon.

Expected behavior
It should allow the card when all details are correct.

Smartphone / tablet

• Device: Android Emulator
• OS: Android 11
• Package version: flutter_stripe: ^3.2.0
• Flutter version 3.0.2

[remonh87]

I can reproduce this. @jonasbark you have a bit more knowledge about the cardfield internals. It looks like last4 is not updated the first time but when I put the focus back on the cardnumber remove one number and add it again last4 is filled.

I did print from android CardChangedEvent.serializeEventData and got:

And got: ``` E/details (24573): details!!! {brand=null, last4=null, expiryMonth=2, expiryYear=25, postalCode=, validNumber=Valid, validCVC=Valid, validExpiryDate=Valid}

Before I file an issue on react native can you double check if we did do something wrong?

[romatallinn]

Same issue. Well, yeah, it's quite critical. The whole android user base seems to be affected.

Is it something that was brought in by new releases? What is the latest workable version then?

@remonh87:

when I put the focus back on the cardnumber remove one number and add it again last4 is filled

This workaround doesn't work for me.

[DavidI7]

As a temporary workaround, I was able to get the widget into a working state by setting the 'enablePostalCode' variable to true. It's not ideal but at least it's functional now.

[romatallinn]

As a temporary workaround, I was able to get the widget into a working state by setting the 'enablePostalCode' variable to true. It's not ideal but at least it's functional now.

Thanks will know. I downgraded the plugin to 3.1.0. It seems to work there. Right now uploading my build to Google Play to have the fix asap.

[jonasbark]

Opened a ticket accordingly stripe/stripe-react-native#1041

[jonasbark]

@romatallinn @DavidI7 @142hitesh can you confirm that it works if you have enablePostalCode to false and no countryCode?
e.g.

  CardField(
    enablePostalCode: false,
    onCardChanged: (card) {
      setState(() {
        _card = card;
      });
    },
  ),

seems to work for me that way.

@remonh87 let's remove sending the countryCode from the dart side, if enablePostalCode is false

[romatallinn]

@romatallinn @DavidI7 @142hitesh can you confirm that it works if you have enablePostalCode to false and no countryCode?

Hm, no, I cannot confirm it. The example you provided doesn't work for me. But setting enablePostalCode to true does work.

[jonasbark]

device-2022-07-15-153005.mp4

This is what I'm seeing with the example app, flutter_stripe 3.3.0, and the snippet from above. Looks fine to me.

[raulSusanj]

Hi, facing the same issue. The only workaround is what @DavidI7 posted (setting enablePostalCode to true). @jonasbark we use flutter_stripe 3.3.0 and the issue still exists. I am trying to figure out how to temporarily avoid the enablePostalCode workaround until the package gets a fix or if I find something useful I'll share it here.

[DavidI7]

@jonasbark Same for me, as @romatallinn already said, that potential fix you provided didn't work for me either. We're on flutter_stripe 3.3.0 too, for the record.

[jonasbark]

Can you post a video with the example app, using the code from my snippet?
I'm trying to reproduce it but can't.

[jonasbark]

A fix will be released with the next version that should arrive within the next few days

[joknjokn]

Can anyone confirm this is fixed with 4.0.0? Thanks!

[romatallinn]

Can anyone confirm this is fixed with 4.0.0? Thanks!

Well, just wanted to drop a message that for my production app, it become even worse. Even enablePostalCodenow doesn’t help. 😅

But it’s just me… I didn’t have a chance to test it on basic setup, coz right now downgrading the plugin to 3.3.0 and deploying to Google Play, so to have at least some working version of it.

Will try to test it on basic app later today, but if anyone is experiencing same issue or can test it earlier, please do it.

[joknjokn]

@romatallinn Thanks for the reply! We're aiming for an urgent hotfix.

Can you describe how 4.0.0 is worse?

[romatallinn]

@romatallinn Thanks for the reply! We're aiming for an urgent hotfix.

Can you describe how 4.0.0 is worse?

The card field accepts the card just fine now. Previously, the icon was becoming a ❗️. But instead, it now fails on card submission. Same error, card details not completed. And as said, enablePostalCode doesn’t solve it anymore.

worth mentioning though, we are working with setup intents. So it might be different for other strategies.

[joknjokn]

@romatallinn Thank you! Sounds like 4.0.0 is not our solution.

@jonasbark Could you prioritize this? It's a very, very problematic bug.

[romatallinn]

Thank you! Sounds like 4.0.0 is not our solution.

Do you have an opportunity to test it now as well? Maybe it’s just me.

[joknjokn]

@romatallinn We could potentially do that, yes. It's a little late before the weekend, so no promises, but I'll get back to you if our QA'ers find time to test 4.0.0. But I'm currently leaning towards trying to downgrade to 3.1.0.

[romatallinn]

@joknjokn okay, don't rely on anything I am saying. I downgraded to 3.3.0 and it also doesn't work for me the same. Probably I am having some other issue.

[romatallinn]

Yeah, it's a completely different issue that was uncovered for me and resulted in a similar error and Android only (related to #382; an issue in my implementation, not a general one). So, @joknjokn, sorry for the confusion. Release 4.0.0 does seem to resolve this thread's issue.

[joknjokn]

@romatallinn Yep - our QA'er tested with 4.0.0 and it does seem to be fixed 👍

[sleewok]

@romatallinn Yep - our QA'er tested with 4.0.0 and it does seem to be fixed 👍

Correct, it is NOT fixed in 4.0.0. I am using the CardFormField. The only way it works is if I enable postalCode.

[jonasbark]

@sleewok I can't confirm that. Please provide an example project where I can see that it does not work. Looks like you still use the old version, so better double-check.

[sleewok]

@sleewok I can't confirm that. Please provide an example project where I can see that it does not work. Looks like you still use the old version, so better double-check.

@jonasbark
Definitely running the latest version:
C:\flutter.pub-cache\hosted\pub.dartlang.org\flutter_stripe-4.0.0\lib\flutter_stripe.dart

I think I need to clarify something. My error may be different.
First, No error is showing on the widget GUI for the CardFormField.

However, the form is never marked as completed UNLESS I set postalCode = true and a postalCode is entered along with the other information (CC, CVC, EXP). This is the case even if I have set postalCode = false. It will never complete because there is no way to enter the postalCode. If there is a way programmatically please let me know and I will gladly use that.

This is what the formDetails are with the postalCode = false and the CC, CVC, EXP all entered correctly:
CardFieldInputDetails(complete: false, last4: null, expiryMonth: null, expiryYear: null, postalCode: null, brand: null, number: null, cvc: null, validExpiryDate: CardValidationState.Unknown, validCVC: CardValidationState.Unknown, validNumber: CardValidationState.Unknown)

If I set postalCode = true, and enter the postal code the result changes (once all information is entered) and is marked as complete as soon as I complete all the fields. It will set complete to false if I delete the CVC, etc, just as expected:
CardFieldInputDetails(complete: true, last4: 4242, expiryMonth: 4, expiryYear: 2024, postalCode: 24982, brand: Visa, number: null, cvc: null, validExpiryDate: CardValidationState.Unknown, validCVC: CardValidationState.Unknown, validNumber: CardValidationState.Unknown)

I'd rather not have the user enter the postal in the form, since I collect address information prior to the CC entry.

[mars3142]

It seems to be different depending on the device. I testet the package v3.3.0 on a Redmi Note 11 (Android 11 - working) and on Samsung M33 5G (Android 12 - not working).