Apple pay button missing

[ghost]

Apple pay button does not display on some of the devices. Paypal and credit card are shown well, but some devices do not display the apple.

Before dropin creation i check for some apple settings:

       if(!window.ApplePaySession) {
          this.paymentError = true
          this.paymentErrorMessage = "This device does not support Apple Pay"
        } else if(!ApplePaySession.supportsVersion(3)) {
          this.paymentError = true
          this.paymentErrorMessage = "This device doesn't suport Apple Pay v.3"
        } else if(!ApplePaySession.canMakePayments()){
          this.paymentError = true
          this.paymentErrorMessage = "This device can't make Apple Pay payments"
        }

But they all pass well and later the button is not displayed. Here's my dropin creation code:

    await dropin.create({
          authorization: this.paymentToken,
          container: '#dropin-container',
          paymentOptionPriority: ['card', 'applePay', 'paypal'],
          applePay: {
            displayName: 'Register to Park',
            paymentRequest: {
              total: {
                label: 'Register to Park',
                amount: this.paymentAmount
              },
              currencyCode: 'USD',
              requiredBillingContactFields: ["postalAddress"]
            }
          },
          paypal: {
            flow: 'vault',
            amount: this.paymentAmount,
            currency: 'USD'
          }
        }, (createErr, instance) => {
          if (createErr) {
            this.paymentError = true;
            console.log("Error in instance", createErr);
            toast.show('error', 'Can not proceed with payment!');
            return;
          }

          this.paymentInstance = instance;
          var options = document.querySelectorAll(".braintree-option")
          var paypal
          var applepay

          options.forEach(option => {
            for(var key in option.classList) {
              var _class = option.classList[key]
              if(typeof _class === "string") {
                if(_class.toLowerCase() === "braintree-option__paypal") {
                  paypal = option
                } else if(_class.toLowerCase() === "braintree-option__applepay") {
                  applepay = option
                }
              }
            }

            option.addEventListener('click', () => {
              this.paymentError = false;
              const selected = document.getElementsByClassName('selected--option');
              if (selected[0]) {
                selected[0].classList.remove('selected--option')
              }
              option.classList.add('selected--option')
            })
          });
          if(applepay) {
            paypal.parentNode.insertBefore(applepay, paypal)
          }
        })

[crookedneighbor]

Are you running some of your sites without an ssl certificate? Drop-in checks that the site is running over https before showing the Apple Pay option: https://github.com/braintree/braintree-web-drop-in/blob/0310f412d7ea8808768c61a305721ce588435032/src/views/payment-sheet-views/apple-pay-view.js#L99

[ghost]

Yes i am on valid https on both development and production and on both it doesn't show the button. It only doesn't show it on some devices not on all of them, but they are able to use apple pay on other sites from their devices since most of them are latest OSs

[ghost]

My certificate is issued by R3 and using TLS 1.3

[crookedneighbor]

Do you have examples of devices that do not work?

The only other thing I can think of is if the specific merchant account you are using is not enabled for ApplePay https://github.com/braintree/braintree-web-drop-in/blob/0310f412d7ea8808768c61a305721ce588435032/src/views/payment-sheet-views/apple-pay-view.js#L89

[ghost]

I am not specifying anywhere in the code a merchant since i didn't see any in the configuration docs. Should i specify merchant for apple pay in the code ?

[crookedneighbor]

It would be specified in the Braintree control panel. Please reach out to our support team and reference this issue so we can get to the bottom of this, I don't think it has anything to do with the SDK.

https://help.braintreepayments.com/