danilkinkin_code

[native cedar]

👋 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/1255223206336532503

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

[thick heron]

Hello! Express Checkout Element will automatically show or hide Apple Pay if it can be used or not, you don't need to do anything manually on your end.

[arctic prawn]

Hi Yep, but it's not applied for my design. I have an own custom payment method switcher and different pages for payment methods. And I need to understand available Apple Pay or not for understand can I display this payment method in list

I use ExpressCheckoutElement as a split buttons. I limited methods to only one in paymentMethods

[thick heron]

I'm not sure I understand. The Express Checkout Element handles displaying the Apple Pay button or not.

That's not recommended.

You can listen for the ready event from the Express Checkout Element, though: https://docs.stripe.com/js/element/events/on_ready

[arctic prawn]

Yes, but is the logic of my product. I have switcher of payment method on top of page, later customer fields and in the end of page payment button. It's because I have other method methods that stripe not support, like a pay by bonus

[thick heron]

Will the ready event work for what you want to do?

[arctic prawn]

onready not good for me, because it's fired only after render the button, but I want to know will is available or not before render page with list of payments, not after choose method

[thick heron]

That's not how the Express Checkout Element works.

You might want to use the Payment Request Button instead. It's deprecated and not recommended, but it sounds like it's a better fit for you than using the Express Checkout Element in a way we also don't recommend: https://docs.stripe.com/stripe-js/elements/payment-request-button

[arctic prawn]

Yep, I know, but can you recommend other solution? I tried PayementRequestButton, but it's work not how excepted.

PayementRequestButton for me this button never render Google Pay and Apple Pay, ExpressCehckout render

I take example from docs

const pr = stripe.paymentRequest({
        country: 'US',
        currency: 'usd',
        total: {
          label: 'Demo total',
          amount: 1099,
        },
        requestPayerName: true,
        requestPayerEmail: true,
        disableWallets: ['link']
      });

      // Check the availability of the Payment Request API.
      pr.canMakePayment().then(result => {
        console.log('Payment Request API is available', result);
        if (result) {
          setPaymentRequest(pr);
        }

And in this case I got an error No UI will be shown. CanMakePayment and hasEnrolledInstrument will always return false. Show will be rejected with NotSupportedError.

In this case, ExpressCheckout render Google Pay & Apple Pay both

[thick heron]

My recommendation then is to use Express Checkout Element as it was designed to be used: create a single instance of it and let it handle rendering the supported buttons automatically.

[arctic prawn]

I want, but can't) Because I have other one payment methods and i have to print all's near

How I told already via bonuses for example

Ok, can you help with PayementRequestButton, why it's work another?

This code

const pr = stripe.paymentRequest({
        country: 'US',
        currency: 'usd',
        total: {
          label: 'Demo total',
          amount: 1099,
        },
        requestPayerName: true,
        requestPayerEmail: true,
      });

return to me in method pr.canMakePayment() next result
{
"applePay": false,
"googlePay": false,
"link": true
}

If I disable link wallet with disableWallets, then pr.canMakePayment() return null

In same time, ExpressCheckout render Apple Pay & Google Pay without problems

[thick heron]

I can't tell you why without seeing the page.

It's likely because the domain isn't properly set up, or you're not in Safari with a valid card in your wallet.

[arctic prawn]

Ok, I prepare sandbox later and create new thread about PaymentRequestButtonElement

Now I think we can close this, I understand that is not great use ExpressCheckout in this case, but for me PaymentRequestButtonElement works wrong, and maybe the problem is it

Thank you anyway

[thick heron]

Happy to help!