MAGETWO-44658: All cards are available in Add new card dropdown when only specific allowed for Braintree

 - Added subscriber for quote billing address

Author: Ievgen Sentiabov

app/code/Magento/Braintree/Model/ConfigProvider.php

@@ -12,7 +12,6 @@
 
 class ConfigProvider extends CcGenericConfigProvider
 {
-    const COMPONENT_PROVIDER_NAME = 'checkout.steps.billing-step.payment.payments-list.braintree-form';
 
     /**
      * @var string[]
@@ -186,8 +185,7 @@ public function getConfig()
                     'isCcDetectionEnabled' => $this->config->isCcDetectionEnabled(),
                     'availableCardTypes' => $this->getCcAvailableCcTypes(),
                     'braintreeDataJs'=> $this->config->getBraintreeDataJs(),
-                    'ajaxGenerateNonceUrl' => $this->getAjaxGenerateNonceUrl(),
-                    'billingAddressComponentName' => self::COMPONENT_PROVIDER_NAME
+                    'ajaxGenerateNonceUrl' => $this->getAjaxGenerateNonceUrl()
                 ],
             ],
         ]);

app/code/Magento/Braintree/Test/Unit/Model/ConfigProviderTest.php

@@ -263,8 +263,7 @@ public function getConfigDataProvider()
                             'isCcDetectionEnabled' => true,
                             'availableCardTypes' => $this->availableCardTypes,
                             'braintreeDataJs'=> 'https://js.braintreegateway.com/v1/braintree-data.js',
-                            'ajaxGenerateNonceUrl' => self::PAYMENT_NONCE_GENERATION_URL,
-                            'billingAddressComponentName' => ConfigProvider::COMPONENT_PROVIDER_NAME
+                            'ajaxGenerateNonceUrl' => self::PAYMENT_NONCE_GENERATION_URL
                         ],
                     ],
                 ]
@@ -339,8 +338,7 @@ public function getConfigDataProvider()
                             'isCcDetectionEnabled' => true,
                             'availableCardTypes' => $this->availableCardTypes,
                             'braintreeDataJs'=> 'https://js.braintreegateway.com/v1/braintree-data.js',
-                            'ajaxGenerateNonceUrl' => self::PAYMENT_NONCE_GENERATION_URL,
-                            'billingAddressComponentName' => ConfigProvider::COMPONENT_PROVIDER_NAME
+                            'ajaxGenerateNonceUrl' => self::PAYMENT_NONCE_GENERATION_URL
                         ],
                     ],
                 ]
@@ -415,8 +413,7 @@ public function getConfigDataProvider()
                             'isCcDetectionEnabled' => true,
                             'availableCardTypes' => $this->availableCardTypes,
                             'braintreeDataJs'=> 'https://js.braintreegateway.com/v1/braintree-data.js',
-                            'ajaxGenerateNonceUrl' => self::PAYMENT_NONCE_GENERATION_URL,
-                            'billingAddressComponentName' => ConfigProvider::COMPONENT_PROVIDER_NAME
+                            'ajaxGenerateNonceUrl' => self::PAYMENT_NONCE_GENERATION_URL
                         ],
                     ],
                 ]
@@ -460,8 +457,7 @@ public function getConfigDataProvider()
                             'isCcDetectionEnabled' => true,
                             'availableCardTypes' => $this->availableCardTypes,
                             'braintreeDataJs'=> 'https://js.braintreegateway.com/v1/braintree-data.js',
-                            'ajaxGenerateNonceUrl' => self::PAYMENT_NONCE_GENERATION_URL,
-                            'billingAddressComponentName' => ConfigProvider::COMPONENT_PROVIDER_NAME
+                            'ajaxGenerateNonceUrl' => self::PAYMENT_NONCE_GENERATION_URL
                         ],
                     ],
                 ]

app/code/Magento/Braintree/view/frontend/web/js/view/payment/method-renderer/cc-form.js

@@ -25,9 +25,7 @@ define(
         _,
         $,
         messageList,
-        $t,
-        registry,
-        wrapper
+        $t
     ) {
         'use strict';
         var configBraintree= window.checkoutConfig.payment.braintree;
@@ -66,11 +64,7 @@ define(
                 availableCardTypes: configBraintree ? configBraintree.availableCardTypes : {},
                 creditCardExpMonth: null,
                 creditCardExpYear: null,
-                billingAddressComponentName: configBraintree.billingAddressComponentName,
-                lastBillingAddress: null,
-                imports: {
-                    onIsSameChange: '${ $.billingAddressComponentName }:isAddressSameAsShipping'
-                }
+                lastBillingAddress: null
             },
             initVars: function() {
                     this.ajaxGenerateNonceUrl = configBraintree ? configBraintree.ajaxGenerateNonceUrl : '';
@@ -95,6 +89,7 @@ define(
              * @override
              */
             initObservable: function () {
+                var self = this;
                 this.initVars();
                 this._super()
                     .track('availableCcValues')
@@ -111,8 +106,6 @@ define(
                         this.selectedCardToken() == '';
                 }, this);
 
-                this.initBillingAddressListening();
-
                 if (!this.braintreeDataFrameLoaded && this.isFraudDetectionEnabled) {
                     $.getScript(this.braintreeDataJs, function () {
                         self.braintreeDataFrameLoaded = true;
@@ -127,6 +120,11 @@ define(
                     this.messageContainer.addErrorMessage({'message': $t('Can not initialize PayPal (Braintree)')});
                 }
 
+                // subscribe on billing address update
+                quote.billingAddress.subscribe(function () {
+                    self.updateAvailableTypeValues();
+                });
+
                 return this;
             },
             /**
@@ -321,10 +319,10 @@ define(
             getCcAvailableTypes: function () {
                 var availableTypes = configBraintree.availableCardTypes;
                 var billingAddress = quote.billingAddress();
+                this.lastBillingAddress = quote.shippingAddress();
                 if (!billingAddress) {
                     billingAddress = this.lastBillingAddress;
                 }
-                this.lastBillingAddress = billingAddress;
                 var billingCountryId = billingAddress.countryId;
                 if (billingCountryId &&
                     typeof configBraintree.countrySpecificCardTypes[billingCountryId] !== 'undefined'
@@ -385,32 +383,6 @@ define(
              */
             updateAvailableTypeValues: function () {
                 this.availableCcValues = this.getCcAvailableTypesValues();
-            },
-
-            /**
-             * Trigger update CC types function
-             * after Magento_Checkout/js/view/billing-address::isAddressSameAsShipping() was triggered
-             */
-            onIsSameChange: function () {
-                this.updateAvailableTypeValues();
-            },
-
-            /**
-             * Listening Magento_Checkout/js/view/billing-address::updateAddress() function
-             * and update available CC types values
-             */
-            initBillingAddressListening: function () {
-                var self = this;
-                if (!registry.has([self.billingAddressComponentName])) {
-                    throw new Error('Billing Address component not found');
-                }
-                registry.get(self.billingAddressComponentName, function (component) {
-                    // listen updateAddress() function
-                    component.updateAddress = wrapper.wrap(component.updateAddress, function (origin) {
-                        origin();
-                        self.updateAvailableTypeValues();
-                    });
-                });
             }
         });
     }