stripe-react-native icon indicating copy to clipboard operation
stripe-react-native copied to clipboard

In a customFlow payment flow, the selected payment option image is always blank or a placeholder

Open mgouault opened this issue 1 year ago • 0 comments

Describe the bug On iOS and Android, starting from 0.36.0, in a payment flow with customFlow: true, the return payload of presentPaymentSheet().paymentOption.image is either a placeholder or a blank image instead of being the corresponding card's brand's icon.

To Reproduce

  1. To make it easier to identify the issue I have created a repository from my reproducible example : https://github.com/mgouault/expo-test-stripe, it just needs a publishableKey and a paymentIntentClientSecret to work.
  2. Otherwise, steps to reproduce the behavior:
  3. Start from a boilerplate of "create-expo-app" in bare workflow with "@stripe/[email protected]"
  4. Build and run on iOS
  5. Setup a two-step payment flow (aka customFlow) using <StripeProvider>, useStripe(), initPaymentSheet(), and presentPaymentSheet().
  6. Call initPaymentSheet with customFlow: true then use presentPaymentSheet()
  7. The payment sheet opens, add a simple Visa test card (4242 4242 4242 4242 03/99 999), then tap "Continue"
  8. The return of presentPaymentSheet() contains "paymentOption" but "paymentOption.image" is a placeholder instead of being the Visa icon
  9. On Android the image is not a placeholder but a blank rectangle (instead of being the Visa icon).

Expected behavior The return payload of presentPaymentSheet() "paymentOption.image" should be a base64 image of the corresponding card brand icon.

Screenshots

screenshot 1 screenshot 2
Screenshot 2024-05-06 at 17 34 57 Screenshot 2024-05-06 at 17 36 29

Desktop :

  • OS: macOS Sonoma 14.4.1

Smartphone :

  • Device: iPhone 15 Pro
  • OS: iOS 17.0.1

Additional context The bug was not present on the version 0.35.0 but present in the version 0.36.0 and 0.37.3. It happens on all Stripe test cards no matter the brand.

mgouault avatar May 06 '24 16:05 mgouault