srujan-paymentelement-select | Stripe Developers | Page 1

spring gulchBOT Dec 13, 2022, 4:37 PM

#

cyan lichen Dec 13, 2022, 4:38 PM

#

Hello, huge apologies I missed your original message. Thanks for bumping your thread

#

Can you send me a screenshot of what you are seeing there?

#

Oh wait I see it

onyx brook Dec 13, 2022, 4:39 PM

#

No worries! I thought it might've been a bug or something

cyan lichen Dec 13, 2022, 4:41 PM

#

It is the proper behavior, basically the Payment Element requires that you also add a button to your webpage that makes the confirmPayment call. Once you do that, the google pay dialogue will show up and let you complete it https://stripe.com/docs/js/payment_intents/confirm_payment

#

I know we have a demo somewhere for this. One sec while I look for it

onyx brook Dec 13, 2022, 4:41 PM

#

Ohhh I see

#

So I won't see the google pay interface until I call confirmPayment

cyan lichen Dec 13, 2022, 4:42 PM

#

Correct

#

If you want a demo: https://4242.io/payment-element/

onyx brook Dec 13, 2022, 4:43 PM

#

Awesome thank you!

#

How can I check to see if user has selected card vs google vs apple pay with the Payment Element?

#

(In React/JavaScript)

brazen ridge Dec 13, 2022, 4:46 PM

#

srujan-paymentelement-select

#

@onyx brook usually you don't need this information

onyx brook Dec 13, 2022, 4:47 PM

#

Well if I have to share a Pay button in the form for both card and google pay I want to conditionally display the text based on our design teams decisions

brazen ridge Dec 13, 2022, 4:47 PM

#

You can use https://stripe.com/docs/js/element/events/on_change?type=paymentElement#element_on_change-handler-value otherwise, but it's rare that you need this

onyx brook Dec 13, 2022, 4:47 PM

#

It'll be calling confirmPayment regardless but also for analytics purposes we want to know that info

#

Like what % of our conversion is card vs google vs apple pay

brazen ridge Dec 13, 2022, 4:49 PM

#

yeah but then you can track this after the payment succeeds/fails. It's recorded on the Charge object

onyx brook Dec 13, 2022, 4:49 PM

#

Oh I see

#

Like in the dashboard?

brazen ridge Dec 13, 2022, 4:51 PM

#

no in the API

#

You have a PaymentIntent, every confirmation attempt will create a Charge, whether it succeeds or not.

#

And you can look at that Charge in the API, such as the payment_method_details property that will have all the info you need

onyx brook Dec 13, 2022, 4:52 PM

#

What method would I use on the frontend to retrieve payment_method_details?

brazen ridge Dec 13, 2022, 4:54 PM

#

You don't, it's all server-side

#

Analytics is something you usually do async, for example by listening to Events on your webhook endpoint

onyx brook Dec 13, 2022, 4:55 PM

#

Oh so you're saying I would want to setup analytics server-side

#

That makes sense

brazen ridge Dec 13, 2022, 4:56 PM

#

https://stripe.com/docs/js/element/events/on_change?type=paymentElement#element_on_change-handler-value otherwise is what I shared earlier, that's an event sent client-side based on the payment method chosen by your customer

onyx brook Dec 13, 2022, 4:56 PM

#

This is good to know though

#

I appreciate the help!

#srujan-paymentelement-select