Braintree Google Pay sandbox opens live domain

Question

I'm trying to integrate Google Pay at my page, as expected doing that first at Sandbox environment but I face a problem that when I click the Google Pay button it opens the live domain and asks me to enter a real card, although I setup up all related to Sandbox environment.

Here is the code following BT documentation.

  var createGooglePaymentComponent = function(clientInstance){
    var button = document.querySelector('#google-pay-button');
    var paymentsClient = new google.payments.api.PaymentsClient({
      environment: 'TEST' // Or 'PRODUCTION'
    });

    braintree.googlePayment.create({
      client: clientInstance,
      googlePayVersion: 2,
    }, function (googlePaymentErr, googlePaymentInstance) {
      paymentsClient.isReadyToPay({
        apiVersion: 2,
        apiVersionMinor: 0,
        allowedPaymentMethods: googlePaymentInstance.createPaymentDataRequest().allowedPaymentMethods,
      }).then(function(response) {
        if (response.result) {
          button.addEventListener('click', function (event) {
            event.preventDefault();

            var paymentDataRequest = googlePaymentInstance.createPaymentDataRequest({
              transactionInfo: {
                currencyCode: 'USD',
                totalPriceStatus: 'FINAL',
                totalPrice: '100.00',
              }
            });
            var cardPaymentMethod = paymentDataRequest.allowedPaymentMethods[0];
            cardPaymentMethod.parameters.billingAddressRequired = true;

            paymentsClient.loadPaymentData(paymentDataRequest).then(function(paymentData) {
              googlePaymentInstance.parseResponse(paymentData, function (err, result) {
                if (err) {
                  // Handle parsing error
                }
                // Send result.nonce to your server
              });
            }).catch(function (err) {
            });
          });
        }
      }).catch(function (err) {
      });
    });
  };

Here is a screenshot of what I get:

Any idea why does that happen?

Answer 1

Using Google Pay in the TEST environment will return a TEST payment credential which won't actually charge the payment method that you provide. It's understandable that you don't want to be using real payment details.

If you want to be able to choose from a list of predefined test cards, follow the instructions here: https://developers.google.com/pay/api/web/guides/resources/test-card-suite

In short, you will need to join the googlepay-test-mode-stub-data Google Group which will then display a list of test accounts when accessing the Google Pay payment sheet with that user.