#jean-baptiste-r_code

1 messages · Page 1 of 1 (latest)

tropic orchidBOT
#

👋 Welcome to your new thread!

⏲️ We'll be here soon! We typically respond in a few minutes, but in some cases we might need a bit more time (e.g., server's busy, you've got a complex question, etc.).

⏱️ We close idle threads, which makes them read-only. Once a thread is closed it won't be reopened, but you can 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/1260608367697858704

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

zealous hinge
#

@real lark is one of the other developpers with me, just in case 🙂

bitter scaffold
#

Hello, thanks for the info. That is very interesting. So visiting the same webpage from an Android browser causes this? Do you have a public site that I can see this behavior on?

zealous hinge
#

If you try to book something, you'll see that you will have a *100 only using google pay

bitter scaffold
#

Thank you, checking this out now and will get back to you with what I can find

zealous hinge
#

Thank you 🙏
Don't hesitate if you need more information about our implementation 🙂

bitter scaffold
#

Did you also write the Stripe Elements code here yourself? Or is this from stripe-vue? That library is actually a third party library so you may have to go ask the developers of that library about this

zealous hinge
#

To be honest, I'm not the one who coded this so ...
The only packages we have who has anything to do with Stripe are stripe (obviously) and @stripe/stripe-js

#

So I guess we don't

real lark
bitter scaffold
#

Can you send me your code that initializes Elements and instantiates the PaymentElement?

real lark
# 
const props = defineProps({
  amount: {
    type: Number,
    default: 0
  },
  companyProfile: {
    type: String as PropType<EStripePublicKeyEnv>,
    required: true
  }
})

const paymentElementDOM = ref<HTMLElement>()

 async function mountCardElem() {
  if (!paymentElementDOM.value) return
  emit(
    'submitFunctionLoaded',
    await usePayment().mountPaymentInput(paymentElementDOM.value, props.amount, props.companyProfile)
  )
}

mountPaymentInput: async (
      elementWrapper: HTMLElement,
      amount: number,
      companyProfile: EStripePublicKeyEnv
    ): Promise<TPaymentSubmitFunction> => {
      const stripeJs = await StripeHelper.getStripeJs(companyProfile)
      const elements: StripeElements = stripeJs.elements({
        mode: 'payment',
        currency: 'eur',
        payment_method_types: ['card'],
        amount: amount * 100,
        setup_future_usage: 'on_session'
      })
      const paymentElement: StripePaymentElement = elements.create('payment')
      paymentElement.mount(elementWrapper)

      //This function need to be called to validate and submit card informations
      return StripeHelper.getPaymentSubmitFunction(elements, stripeJs)
    }
bitter scaffold
#

Does the code from the original message in this thread feed in to this code? It looks like you are multiplying amount by 100 there as well. I am not sure why that would change between platforms but that does stand out to me.

#

I would recommend printing out the amount from your elements.create code in your console and then double check that you are passing us the same number on both platforms

real lark
#

It seems to me that when using google pay, the amount is calculated in euro not in cent, only for the google pay case, if I stop multiply the amount by 100, this will make all other ways of paying incorrect

bitter scaffold
#

Elements should stay consistent there. For example if you check out this demo page we pass an amount of 4200 and that gets translated to $42.00 on the google pay sheet https://4242.io/test/payment-element/

#

Euros are also handled in cents across Stripe, I can double check in my own payment element now, but before this has worked properly for me with Euros specifically

real lark
#

It looks like we're multiplying the amount one too many times. I was able to test this by removing the multiplication by 100, but this doesn't explain why the amount is still correct for the other payment methods 🤔

bitter scaffold
#

Is this on the page for, say, the PayPal sandbox site or is this a number on the same page as the Payment Element?

real lark
#

I'm not sure to understand your question sorry

bitter scaffold
#

When you say the amount is correct for other payment methods, where specifically are you seeing that amount?

real lark
#

ohh sorry

#

I run some test and I can see that in the stripe dashboard (the test part)

bitter scaffold
#

Ah, that is because the PaymentIntent amount can differ from what Google Pay shows specifically. We should do validation between Elements and the PaymentIntent, so we should have errored if the amount passed on the frontend didn't match the actual payment intent amount. I am not sure why it would not have here

#

Can you double check that we are erroring properly by setting that amount to a completely incorrect one like 1234 and then trying to confirm it with a card?

real lark
#

but that's only to "mount" the element in the code I send you. Even if I make a different amount, it won't change the actual payment

real lark
bitter scaffold
#

Right, Elements should be able to display a different amount for Google Pay, but we should error out when you try to confirm a PaymentIntent with an amount that does not match

real lark
#

yes, I'm having trouble understanding what exactly is going on, I need to look at the code implementation in more detail.

Unfortunately I can't test google pay, and the developer I work with isn't here.
I'm going to continue testing on my own and I'll get back to you tomorrow when I'm clearer about what's going on in our implementation, if that's ok for you?

bitter scaffold
#

Sounds good, if you ask again in the main channel either I or the colleague that is online should be able to help look in to this.

tropic orchidBOT
bitter scaffold