#cryokinesisss_
tired escarpBOT
Hello! We'll be with you shortly. Below are links to other discussions we've had with you in the past week in case you want to review that information. If your question is related to one of these previous discussions, please provide a comprehensive summary of the current state and what you need help with now. We help many users simultaneously, so a summary allows us to resolve your issue as soon as possible.
- cryokinesisss_, 2 hours ago, 4 messages
livid ore
👋 happy to help
would you mind sharing your account ID?
livid ore
yes please
midnight raptor
acct_1O560dKnnCzZTWpN
To be clear, I want to create a similar checkout where the paypal and applepay buttons are called using ExpressCheckoutElement or PaymentRequestButton
And the card block is rendered by CardCvcElement, CardExpiryElement, CardNumberElement components.
Is it possible?
At the moment there is a difficulty with displaying paypal - it does not appear in any way and it is not very clear how exactly it is determined which payment methods will be rendered inside ExpressCheckoutElement and PaymentRequestButton.
Also, if I understand correctly, they can not be changed much, for example, to make the width different, so that on the phone fit two buttons in one line?
livid ore
where are you testing and it's not showing up?
midnight raptor
im testing it localy with ngrok on crhome desktop
livid ore
are you on https?
midnight raptor
yes
livid ore
self-signed?
livid ore
have you gone through this https://stripe.com/docs/payments/paypal/connect-your-paypal-account
midnight raptor
yep
livid ore
would you mind contacting https://support.stripe.com/?contact=true
make sure that your Paypal account is validated
midnight raptor
Ok, il try
in prod env we see everything is ok
Maybe something with payment intent, I still don't fully understand how it works, how come sepa-debit appears in payment methods and we see paypal there as well, yet it doesn't show up
The logic is not completely transparent
topaz charm
Hi! I'm taking over from my colleague. Please, give me a moment to catch up.
Could you paste the PaymentIntent ID please?
midnight raptor
Here take a look
pi_3OFFuWKnnCzZTWpN1PtXLOig
I think something wrong with auto-generated intent
cause if i replace client_secret from that intent with hard-code options value like this
i can see paypal button because i point pmc_1OADeUKnnCzZTWpN3zoypwag from dashboard manualy
but this isnt quite a solution, becase data is hardcoded this way - i should get the corrrect data from server
topaz charm
I think something wrong with auto-generated intent
cause if i replace client_sec...
Is this your default PMC?
midnight raptor
yes
this is default PMC in test env
topaz charm
I think something wrong with auto-generated intent
cause if i replace client_sec...
Are you planning to create PaymentIntent after displaying the Elements? Or vice versa? I see you attempted both ways in the code.
midnight raptor
we using this type of integration
https://stripe.com/docs/billing/subscriptions/build-subscriptions?ui=elements#create-subscription
payment intent created on createsubscription
i call createsubscription method before showing Elements
topaz charm
I see, I don't think you can specify the payment_method_configuration when creating a Subscription: https://stripe.com/docs/api/subscriptions/create#create_subscription-payment_settings
Can you please share an example Subscription ID?
midnight raptor
So where the payment methods come from inside the automatically generated payment intent when creating a subscription ?
Yes, one moment
SubscriptionID
sub_1OFG6yKnnCzZTWpNvrpR3RiB
topaz charm
So where the payment methods come from inside the automatically generated paymen...
You can either specify it with payment_settings.payment_method_types: https://stripe.com/docs/api/subscriptions/create#create_subscription-payment_settings-payment_method_types
Otherwise it's automatic.
topaz charm
SubscriptionID
sub_1OFG6yKnnCzZTWpNvrpR3RiB
I see here:
payment_method_types: [
"card",
"paypal",
"sepa_debit",
],
What do you see on the Payment Element?
midnight raptor
I don't really use PaymentElement
but if so - paypal card and sepa
Can it be because paypal doesn't support subscriptions inside ExpressCheckoutElement?
topaz charm
I don't really use PaymentElement
but if so - paypal card and sepa
This looks like a Payment Element.
midnight raptor
I render it because you ask to show PaymentElement
I wont to combine ExpressCheckoutElement and Card Element
so it looks like so
topaz charm
Ok, so there's something in the Express Checkout Element that doesn't display PayPal.
Why does it say "Buy with GPay"? Are you configuring this somehow?
midnight raptor
nope
as you can see i didn't apply any options on ExpressCheckoutElement only onConfirm prop
topaz charm
Yes, I see that, and it looks strange...
midnight raptor
isn't it default ?
topaz charm
Alright, yes, I am just trying to think of any possible reasons PayPal doesn't work...
topaz charm
I render it because you ask to show PaymentElement
I wont to combine ExpressChe...
Is it on mobile actually?
midnight raptor
no chrome devtools
if i go desktop userAgent
ExpressCheckoutElement render nothing
topaz charm
I render it because you ask to show PaymentElement
I wont to combine ExpressChe...
What if you show this not in a modal?
I know PayPal has issues with displaying confirmation window on mobile so we hide the button in webview. This might also be the case with modals.
tired escarpBOT
midnight raptor
Not in this case, paypal is displaying then i replace clientSecret options to this const options = useMemo( () => ({ // clientSecret: clientSecret, mode: 'payment', amount: 1000, currency: 'eur', payment_method_configuration: 'pmc_1OADeUKnnCzZTWpN3zoypwag', appearance: ELEMENTS_APPEARANCE, }), [clientSecret], );
But as you can see 'mode' is set to 'payment' if i switch it to 'subscription' paypal disappears
so something with paypal and subsriptions
surreal current
Hello 👋
Give me a few minutes to catch up as things are running a bit busy
also this seems like a long running thread, can you give me a quick summary of your latest question?
midnight raptor
We are trying to create a custom checkout using a combination of ExpressCheckoutElement and CardElement
CardElement is fine, but ExpressCheckoutElement does not display the paypal button
Also we are using https://stripe.com/docs/billing/subscriptions/build-subscriptions?ui=elements#create-subscription way of integration through subscription creation where intents are created automatically.
What I also noticed, there is a dependence on the type of payment, if it is a subscription - then paypal does not appear, if a one-time payment - it appears
surreal current
Gotcha. Thinking..
Have you enabled paypal under invoice settings?
https://dashboard.stripe.com/settings/billing/invoice
if you click on manage, you should be able to see an option to activate paypal for billing
surreal current
I see. hmm I wonder if there's some configuration you're missing.
Recurring payment support for paypal requires approval from Stripe before you can use it. Even though you seem to have the approval, I wonder there's something else our support team missed
Can you try one more thing
try setting paymentMethodTypes array when you create elements and pass in paypal
surreal current
I thought you were using defer intent flow
() => ({
mode: 'subscription',
amount: 1000,
currency: 'eur',
payment_method_configuration: 'pmc_1OADeUKnnCzZTWpN3zoypwag',
appearance: ELEMENTS_APPEARANCE,
paymentMethodTypes: ['paypal', 'card']
}),
[],
);```does that work?
surreal current
ah yeah take out payment_method_configuration parameter
midnight raptor
if so - still only gpay
surreal current
Are you seeing any errors in your console?
midnight raptor
no
clear
paypal shows up only if mode is 'payment'
like so
const options = useMemo( () => ({ mode: 'payment', amount: 1000, currency: 'eur', // payment_method_configuration: 'pmc_1OADeUKnnCzZTWpN3zoypwag', appearance: ELEMENTS_APPEARANCE, paymentMethodTypes: ['paypal', 'card'], }), [], );
surreal current
Gotcha. Is this page live? Can I access it?
midnight raptor
i can setup sandbox link if you wait a bit
surreal current
sure
midnight raptor
which option should i keep
with clientSecreet or with mode and etc. ?
surreal current
keep the defer intent flow (the one on top) as that's what we recommend with express checkout element
surreal current
it stays greyed out
surreal current
US
midnight raptor
try again pls
surreal current
still greyed out
midnight raptor
letme fix
~5min
surreal current
👍
midnight raptor
Done
Try again, to be sure start new session ( open in guest mode or open the same link again reset parameter will clear the cashe )
https://pr-459.d1l36b8gqr8jmk.amplifyapp.com/quiz?reset=1&variant=variant16
tired escarpBOT
cursive python
Thanks for the link. hanzo is stepping out so I am catching up on this thread, will get back to you shortly
From my colleagues' understanding, the Express Checkout Element does not currently support the deferred subscriptions flow with PayPal (though we are working on it). For now, you'll need to use the Payment Element for starting your subscriptions
midnight raptor
But Payment Element doesn't meet our business requirements
We need to have multiple payment methods available in one click and on one screen
like so
Is there anything you can recommend
cursive python
Can you tell me more about that need? Unfortunately, we don't have another Element that show payment methods like that at the moment.
If you really need and Apple/GPay button and a PayPal button you may be able to use our payment request button and then your own PayPal button that uses our non-elements Stripe.js integration paths, but that would get pretty complex especially considering the complexity of coupon interactions with your subscriptions. I would honestly recommend against doing that if possible
https://stripe.com/docs/payments/paypal/accept-a-payment?platform=web&ui=API#confirm-paypal-payment
https://stripe.com/docs/payments/paypal/set-up-future-payments?platform=web#confirm-paypal-setup