Apple and Google Pay payment methods

#7 does not apply on version 1.4

Update to align with the latest dev version of the module—increased library version to match other implementations.

We need to switch fetching order to be route based, and we need to wait for #3345876 to align with merchant id logic

Synced with last dev version

Hi @valic

After applied patches (#7), google pay and Apple pay checkbox showing in checkout but when i try to make payment its giving an error like please try again.

here is error log:

We encountered an unexpected error processing your payment method. Please try again later.

LOG: https://i.imgur.com/C4YnbBQ.png

Thanks
Ahir

Last commit removed some rows from PaymentMethodAddForm.php without which Apple Pay button does not even display.

Hi

Does this patches will work with version 1.4 ?

Thanks
Ahir

This patch needs to be applied on dev version

@alexku which rows have been removed? We do run this patch on last dev version, seems without problem.

Do you use it on dev version or?

I was testing latest code from https://git.drupalcode.org/project/commerce_braintree/-/merge_requests/4...

The patch #9 itself is working because it includes css/commerce_braintree.apple_pay.css file which styles #braintree-apple-pay-button element as an apple pay button.

The latest code in the merge request does not have this css file and it also doesn't have the #suffix part of the following code which I found in earlier commits.

    $element['apple_pay'] = [
      '#type' => 'container',
      '#id' => 'braintree-apple-pay-button',
      '#suffix' => Markup::create('<apple-pay-button buttonstyle="black" type="plain" locale="' . $lang . '"></apple-pay-button>'),
    ];

Apple supports both css style and markup approach. But the latest code in the MR does not use either.

There is another issue I've noticed. Code below hardcodes merchantCapabilities and supportedNetworks. Braintree docs recommend leaving it to Braintree to figure this out. Not all merchants support this exact list of networks (visa, mastercard, amex, discover)

        paymentButton.addEventListener('click', function (event) {
          var paymentRequest = applePayInstance.createPaymentRequest({
            countryCode: settings.countryCode,
            currencyCode: settings.currencyCode,
            merchantCapabilities: ['supports3DS', 'supportsEMV', 'supportsCredit', 'supportsDebit'],
            supportedNetworks: [
              "visa",
              "masterCard",
              "amex",
              "discover"
            ],
            total: {
              label: 'Order' + settings.orderId,
              type: 'final',
              amount: settings.totalPrice
            }
          })

Looks like this pull request has fallen behind, can we rebase?

updated, (the failing tests are coding standards for payment definition)

I was struggling to get a patch file from the PR, its out of date and does not contain the latest commits.

I tried merging the latest changes into 8.x-1.x on the fork hoping that might mean Gitlab updates the patch file but no luck.

Created manually locally if anyone else needs a copy its here file:///home/chris/Projects/websites/crossover-minirigs/google-apple-pay.patch

I will test Google and Apple pay on our dev account next week.

@chrisscrumping the last patch is always at the same URL when Gitlab is used. It is up to date with 8.x branch

https://git.drupalcode.org/project/commerce_braintree/-/merge_requests/4...
(plain diff URL next to merge request link above)

Oh I see it now, thanks valic :)

I will try and setup a test for this asap.

We have to prefix the payment method types defined by "braintree_". This isn't done for PayPal, but Braintree is PayPal (sort of), but don't want to be blocked in the future if Commerce ever defines an Apple Pay and a Google Pay payment method type.
Braintree cannot "own" those.

Does that mean once we add apple_pay and google_pay in Commerce core, those from Braintree would stay defined as braintree_apple_pay, , not as apple_pay method even if it is?

Adding a patch with renaming methods with the prefix braintree_

Did not commit in MR, because maybe some folks ran a patch from the URL above, which would crash because of the plugin name change.

For anyone who would need to migrate apple_pay and google_pay payment methods to use new plugin names, you can update them like this

  $payment_method_tables = [
    'commerce_payment_method',
    'commerce_payment_method__card_exp_month',
    'commerce_payment_method__card_exp_year',
    'commerce_payment_method__card_number',
    'commerce_payment_method__card_type',
  ];

  foreach ($payment_method_tables as $payment_method_table) {
    $property = $payment_method_table === 'commerce_payment_method' ? 'type' : 'bundle';
    \Drupal::database()->update($payment_method_table)->fields([$property => 'braintree_apple_pay'])->condition($property, 'apple_pay')->execute();
    \Drupal::database()->update($payment_method_table)->fields([$property => 'braintree_google_pay'])->condition($property, 'google_pay')->execute();
  }

Does that mean once we add apple_pay and google_pay in Commerce core, those from Braintree would stay defined as braintree_apple_pay, , not as apple_pay method even if it is?

Well not really, we could write an update hook to migrate to those... Challenge is figuring out the fields needed for each gateway in advance in core... But I guess modules could also add their fields on top of the ones defined by core? That'd require implementing both a hook_entity_field_storage_info() and hook_entity_bundle_field_info() though... Perhaps we should make it easier to extend bundle plugin field definitions.

Or we could declare `wallet` payment method in Commerce Core with additional field for wallet type (google pay, apple pay, etc..)

Now when I look at added code, ApplePay and GooglePay payment method definitions are credit cards, just with different (branded) labels.

With Wallet payment method type we would not need definitions across contribs. And with additional field, we can still see the provider of payment

<?php

namespace Drupal\commerce_payment\Plugin\Commerce\PaymentMethodType;

use Drupal\commerce_payment\Entity\PaymentMethodInterface;
use Drupal\entity\BundleFieldDefinition;

/**
 * Provides the generic wallet payment.
 *
 * @CommercePaymentMethodType(
 *   id = "wallet",
 *   label = @Translation("Wallet"),
 * )
 */
class Wallet extends CreditCard {

  /**
   * {@inheritdoc}
   */
  public function buildLabel(PaymentMethodInterface $payment_method) {
    $args = [
      '@card_number' => $payment_method->card_number->value,
    ];
    return $this->t('Google Pay ending in @card_number', $args);
  }

  /**
   * {@inheritdoc}
   */
  public function buildFieldDefinitions() {
    $fields = parent::buildFieldDefinitions();
    $fields['wallet_type'] = BundleFieldDefinition::create('list_string')
      ->setLabel($this->t('Wallet provided'))
      ->setDescription($this->t('The wallet provider type.'))
      ->setRequired(TRUE)
      ->setSetting('allowed_values_function', ['\Drupal\commerce_payment\Wallet', 'getTypeLabels']);

    return $fields;
  }

}

Not sure though that Wallet would be a good name for it