edgarsantiago93_code

[jolly hinge]

👋 Welcome to your new thread!

⏲️ We'll be here soon! Typically we respond in a few minutes, but sometimes we might take a bit longer if the server is busy or if you have a particularly tricky question.

⏱️ We close idle threads, which makes them read-only. Once a thread is closed it won't be reopened, but you can always start a new thread if you have another question.

🔗 This thread will always be available, even after it's closed. You can find it again using Discord's search, or you can save this link: https://discord.com/channels/841573134531821608/1215738268273082459

📝 Have more to share? Add more details, code, screenshots, videos, etc. below.

[true pendant]

this is the response on the network tab

[true pendant]

and this is the content of the error object

[wild hinge]

When in your flow is this occurring?

[true pendant]

user select cashapp as payment method, clicks pay, the request goes to our server, then it returns the payment it for us to confirm it on the client, at that point i destructure the error,if any, and handle it on the ui

i was trying to create sth to parse the error based on the "param" returned on the error object until i noticed that the actual api call on the network tab returns a really useful message but i cant seem to find it on the error object itself

[wild hinge]

Okay so you are wondering why the error object your server receives does not match the one in the network tab?

[true pendant]

well everything is received on the client at that point, but yes, i would guess this error should match the one on the network tab

result = await stripe.confirmPayment({
...stripeParams,
clientSecret: subscription.latestInvoice.paymentIntent.clientSecret,
});
const { error } = result;

[wild hinge]

Can you share one of the API reques IDs?

[true pendant]

sure, one sec

https://api.stripe.com/v1/payment_intents/pi_3Os8brCOZVEiJ8yn0MMogd2P/confirm

sorry im not sure if thats the right id

[wild hinge]

Sorry, could you just copy the Payment Intent ID into the chat? pi_

[true pendant]

yes, here you go. pi_3Os8brCOZVEiJ8yn0MMogd2P

[wild hinge]

Thanks, looking

Okay and the error object that doesn't contain the string details you are looking for, where is that being received?

[true pendant]

on the client right after we call stripe.confirmPayment

[wild hinge]

Okay that's confusing because the error you see in the networks tab is what we are sending back.

Can you share your code where you are logging this?

[true pendant]

yes one sec

const handlePurchase = useCallback(
    async ({
      subscription,
      trackingProps,
      returnUrl,
    }: {
      subscription: StripeSubscription;
      trackingProps: TrackingProps;
      returnUrl?: string;
    }) => {
      if (!stripe) {
        return handleError(new Error('stripe is required'), { trackingProps });
      }
      if (!returnUrl) {
        return handleError(new Error('returnUrl is required'), { trackingProps });
      }
      if (!elements) {
        return handleError(new Error('elements are required'), { trackingProps });
      }

      // todo: append google client id (and any others) in case the return url is on a separate device
      const stripeParams: ConfirmPaymentOrSetupData = {
        elements: elements || undefined,
        redirect: REDIRECT_IF_REQUIRED,
        confirmParams: {
          return_url: returnUrl,
        },
      };

      let result: PaymentIntentResult | SetupIntentResult;

      if (subscription.latestInvoice?.paymentIntent?.clientSecret) {
        result = await stripe.confirmPayment({
          ...stripeParams,
          clientSecret: subscription.latestInvoice.paymentIntent.clientSecret,
        });
      } else {
        return handleError(new Error('Unexpected error: no intent found'), {
          trackingProps,
        });
      }

      const { error } = result;
      console.log('errror',error)
...

the stripe.confirmPayment part is where the api call is being made, we just destructure the error from that result

[wild hinge]

Hmmm.... 🤔

Can you just log the full result?

[true pendant]

yes, this is the full result object actually

its an object that only contains error

[lilac hatch]

Hi yeah in the error object we do provide the param that's incorrect under param. You could surface a message saying that the country isn't supported if you get a payment_method_invalid error type with billing_details[address][country] as the offending param

[true pendant]

hmm, that seems hacky tbh, bc the api error specifies that cashapp is not supported, how would it work for other payment methods that maybe support canada or mexico but not the US? or any combination really. While the param field does in fact specify that address and country are not correct, it does not say that a specific country for a payment method is supported or not

i only ask because a really useful error message is already in there, and presenting that one would be a better user experience i believe

[lilac hatch]

Yeah not sure off-hand why we don't surface the same error in stripe-js that's on the network call

Let me ask a colleague if there's a specific reason behind this

[true pendant]

awesome, thnks!

[lilac hatch]

Ok so my colleague looked into this. Looks like we map the payment_method_invalid_parameter error code slightly differently in stripe.js. We're goint to report this as feedback though, so hopefully the team decides to change this down the line. In the mean time, I recommend just writing a conditional check on the address being passed in before adding cashapp as a supported payment method. It's only supported in the US.

Not fully aware of all the reasons they map that error code differently, so they may have a valid reason for doing it that way. That's why I recommend writing this check yourself for now