Uncaught TypeError: locations.each is not a function in Magento admin showing occasionally on system configuration page in 2.4.5

Question

While accessing a Magento admin system configuration page, facing the below error that prevents the save config button.

Uncaught TypeError: locations.each is not a function

When clicking on system.js, seems to be loading from the PayPal_Braintree module.

locations.each(function (loc) {
        $('[data-ui-id="select-groups-braintree-section-groups-braintree-groups-braintree-paypal-groups-styling-groups-button-'+loc+'-fields-paypal-location-'+loc+'-button-type-value"]').change(function () {
            hidePaypalSections();
        });
    });

Answer 1

Step-1 Run the below command to install the patch package.

composer require cweagans/composer-patches

Step-2 add the below lines in your composer.json file

"extra": {
    "magento-force": "override",
    "patches-file": "composer-patches.json",
    "composer-exit-on-patch-failure": true
}

Step-3 Create new file at root od magento -> composer-patches.json

{
  "patches": {
    "paypal/module-braintree-core": {
      "Fix Store Configuration Tab Issue": "patches/Fix_Store_Config_Issue.patch"
    }
  }
}

Step-4 Create new folder at magentoRoot -> patches

Step-5 Create new file at magentoRoot/patches -> Fix_Store_Config_Issue.patch

--- a/vendor/paypal/module-braintree-core/view/adminhtml/web/js/system.js   2023-01-25 22:36:53.170211591 +0530
+++ b/vendor/paypal/module-braintree-core/view/adminhtml/web/js/system.js   2022-09-12 14:45:06.000000000 +0530
@@ -125,7 +125,7 @@
         let messagingLogoPosition = $('.' + location + '-messaging-logo-position').val();
         let messagingTextColor = $('.' + location + '-messaging-text-color').val();
 
-        locations.each(function (loc) {
+        $.each(locations, function (loc) {
             buttonTypes.each(function (type) {
                 $('[data-ui-id="select-groups-braintree-section-groups-braintree-groups-braintree-paypal-groups-styling-groups-button-' + loc + '-groups-button-location-' + loc + '-type-' + type + '-fields-button-location-' + loc + '-type-' + type + '-show-value"]').val(buttonShowStatus).click();
                 $('[data-ui-id="select-groups-braintree-section-groups-braintree-groups-braintree-paypal-groups-styling-groups-button-' + loc + '-groups-button-location-' + loc + '-type-' + type + '-fields-button-location-' + loc + '-type-' + type + '-layout-value"]').val(buttonLayout).click();
@@ -150,7 +150,7 @@
         let locations = ['checkout', 'productpage', 'cart'], buttonTypes = ['paypal', 'paylater', 'credit'];
         let buttonShowStatus = 1, buttonLayout = 'horizontal', buttonTagline = 0, buttonLabel = 'paypal', buttonColor = 'gold', buttonShape = 'rect', buttonSize = 'responsive';
 
-        locations.each(function (loc) {
+        $.each(locations, function (loc) {
             buttonTypes.each(function (type) {
                 $('[data-ui-id="select-groups-braintree-section-groups-braintree-groups-braintree-paypal-groups-styling-groups-button-' + loc + '-groups-button-location-' + loc + '-type-' + type + '-fields-button-location-' + loc + '-type-' + type + '-show-value"]').val(buttonShowStatus).click();
                 $('[data-ui-id="select-groups-braintree-section-groups-braintree-groups-braintree-paypal-groups-styling-groups-button-' + loc + '-groups-button-location-' + loc + '-type-' + type + '-fields-button-location-' + loc + '-type-' + type + '-layout-value"]').val(buttonLayout).click();
@@ -174,7 +174,7 @@
     window.applyButton = function () {
         let locations = ['checkout', 'productpage', 'cart'], buttonTypes = ['paypal', 'paylater', 'credit'];
 
-        locations.each(function (loc) {
+        $.each(locations, function (loc) {
             buttonTypes.each(function (type) {
                 $('[data-ui-id="select-groups-braintree-section-groups-braintree-groups-braintree-paypal-groups-styling-groups-button-' + loc + '-groups-button-location-' + loc + '-type-' + type + '-fields-button-location-' + loc + '-type-' + type + '-show-value"]').click();
                 $('[data-ui-id="select-groups-braintree-section-groups-braintree-groups-braintree-paypal-groups-styling-groups-button-' + loc + '-groups-button-location-' + loc + '-type-' + type + '-fields-button-location-' + loc + '-type-' + type + '-layout-value"]').click();
@@ -200,7 +200,7 @@
     $('[data-ui-id="select-groups-braintree-section-groups-braintree-groups-braintree-paypal-groups-styling-fields-payment-location-value"]').change(function () {
         hidePaypalSections();
     });
-    locations.each(function (loc) {
+    $.each(locations, function (loc) {
         $('[data-ui-id="select-groups-braintree-section-groups-braintree-groups-braintree-paypal-groups-styling-groups-button-'+loc+'-fields-paypal-location-'+loc+'-button-type-value"]').change(function () {
             hidePaypalSections();
         });
@@ -215,7 +215,7 @@
         }
         merchantCountryIndex = mainLocation.attr('id').split('_')[1];
         mainType = $('[data-ui-id="select-groups-braintree-section-groups-braintree-groups-braintree-paypal-groups-styling-groups-button-'+mainLocation.val()+'-fields-paypal-location-'+mainLocation.val()+'-button-type-value"]');
-        locations.each(function (loc) {
+        $.each(locations, function (loc) {
             $('#row_payment_' + merchantCountryIndex + '_braintree_section_braintree_braintree_paypal_styling_button_' + loc).hide();
             buttonTypes.each(function (type) {
                 $('#row_payment_'+merchantCountryIndex+'_braintree_section_braintree_braintree_paypal_styling_button_'+loc+'_button_location_'+loc+'_type_' + type).hide();

Step-6 Run the below command

composer install 

composer update

Note: Above Patch file: Fix_Store_Config_Issue.patch is only work on Magento 2.4.5, for the other version you need to create your own patch file.

Create Custom Patch : https://magento.stackexchange.com/a/368552/82670

Answer 2

Use the patch to get it fixed.

diff --git a/vendor/paypal/module-braintree-core/view/adminhtml/web/js/system.js
b/vendor/paypal/module-braintree-core/view/adminhtml/web/js/system.js
index 1313f215e..cfa34c760 100644
--- a/vendor/paypal/module-braintree-core/view/adminhtml/web/js/system.js
+++ b/vendor/paypal/module-braintree-core/view/adminhtml/web/js/system.js
@@ -200,7 +200,7 @@ require(['jquery', 'Magento_Ui/js/modal/alert', 'mage/translate', 'domReady!'],
     $('[data-ui-id="select-groups-braintree-section-groups-braintree-groups-braintree-paypal-groups-styling-fields-payment-location-value"]').change(function () {
         hidePaypalSections();
     });
-    locations.each(function (loc) {
+    $.each(locations, function (loc) {
         $('[data-ui-id="select-groups-braintree-section-groups-braintree-groups-braintree-paypal-groups-styling-groups-button-'+loc+'-fields-paypal-location-'+loc+'-button-type-value"]').change(function () {
             hidePaypalSections();
         });
@@ -215,7 +215,7 @@ require(['jquery', 'Magento_Ui/js/modal/alert', 'mage/translate', 'domReady!'],
         }
         merchantCountryIndex = mainLocation.attr('id').split('_')[1];
         mainType = $('[data-ui-id="select-groups-braintree-section-groups-braintree-groups-braintree-paypal-groups-styling-groups-button-'+mainLocation.val()+'-fields-paypal-location-'+mainLocation.val()+'-button-type-value"]');
-        locations.each(function (loc) {
+        $.each(locations, function (loc) {
             $('#row_payment_' + merchantCountryIndex + '_braintree_section_braintree_braintree_paypal_styling_button_' + loc).hide();
             buttonTypes.each(function (type) {
                 $('#row_payment_'+merchantCountryIndex+'_braintree_section_braintree_braintree_paypal_styling_button_'+loc+'_button_location_'+loc+'_type_' + type).hide();