PSPAYPAL-879 remove bug with vaulting checkout button

OXID-eSales · Jan 9, 2025 · 706bbb1 · 706bbb1
1 parent 0afa9f6
commit 706bbb1
Show file tree

Hide file tree

Showing 6 changed files with 38 additions and 41 deletions.
diff --git a/out/src/js/paypal-frontend.min.js b/out/src/js/paypal-frontend.min.js
diff --git a/resources/build/js/paypal-frontend-paypal-vault-checkout.js b/resources/build/js/paypal-frontend-paypal-vault-checkout.js
@@ -0,0 +1,33 @@
+function registerClickListenerForSavedVaultRadioButtons() {
+    document.querySelectorAll(".vaulting_paymentsource").forEach(function (paymentsource) {
+        paymentsource.onclick = function () {
+            if (paymentsource.checked) {
+                document.getElementById("paypalVaultCheckoutButton").disabled = false;
+            }
+        };
+    });
+}
+
+// clicking the vault checkout button will submit the form for payment
+function registerClickListenerForTheVaultCheckoutButton() {
+    document.getElementById("paypalVaultCheckoutButton").onclick = function () {
+        document.querySelectorAll(".vaulting_paymentsource").forEach(function (paymentsource) {
+            if (paymentsource.checked) {
+                document.getElementById("payment_oscpaypal").click();
+
+                let input = document.createElement("input");
+                input.type = "hidden";
+                input.name = "vaultingpaymentsource";
+                input.value = paymentsource.dataset.index;
+                document.getElementById("payment").appendChild(input);
+
+                document.getElementById("paymentNextStepBottom").click();
+            }
+        });
+    };
+}
+
+document.addEventListener("DOMContentLoaded", function() {
+    registerClickListenerForSavedVaultRadioButtons();
+    registerClickListenerForTheVaultCheckoutButton();
+});
diff --git a/resources/grunt/concat.js b/resources/grunt/concat.js
@@ -16,6 +16,7 @@ module.exports = {
                 "build/js/paypal-frontend-googlepay.js",
                 "build/js/paypal-frontend-googlepay-3ds.js",
                 "build/js/paypal-frontend-hateoaslinks.js",
+                "build/js/paypal-frontend-paypal-vault-checkout.js",
             ]
         }
     }

diff --git a/resources/grunt/uglify.js b/resources/grunt/uglify.js
@@ -16,6 +16,7 @@ module.exports = {
                 "build/js/paypal-frontend-googlepay.js",
                 "build/js/paypal-frontend-googlepay-3ds.js",
                 "build/js/paypal-frontend-hateoaslinks.js",
+                "build/js/paypal-frontend-paypal-vault-checkout.js",
             ]
         }
     }

diff --git a/views/tpl/flow/page/checkout/change_payment.tpl b/views/tpl/flow/page/checkout/change_payment.tpl
@@ -23,32 +23,13 @@
                 <button type="submit" name="userform"
                         class="btn btn-primary pull-right submitButton nextStep largeButton"
                         id="paypalVaultCheckoutButton"
+                        disabled
                 >
                     [{oxmultilang ident="OSC_PAYPAL_CONTINUE_TO_NEXT_STEP"}] <i class="fa fa-caret-right"></i>
                 </button>
             </div>
         </div>
     </div>
-
-    <script>
-        window.onload = function () {
-            document.getElementById("paypalVaultCheckoutButton").onclick = function () {
-                document.querySelectorAll(".vaulting_paymentsource").forEach(function (paymentsource) {
-                    if (paymentsource.checked) {
-                        document.getElementById("payment_oscpaypal").click();
-
-                        let input = document.createElement("input");
-                        input.type = "hidden";
-                        input.name = "vaultingpaymentsource";
-                        input.value = paymentsource.dataset.index;
-                        document.getElementById("payment").appendChild(input);
-
-                        document.getElementById("paymentNextStepBottom").click();
-                    }
-                });
-            }
-        }
-    </script>
 [{/if}]
 
 [{if 'oscpaypal_express'|array_key_exists:$oView->getPaymentList() && $oViewConf->isPayPalExpressSessionActive()}]

diff --git a/views/tpl/wave/page/checkout/change_payment.tpl b/views/tpl/wave/page/checkout/change_payment.tpl
@@ -23,32 +23,13 @@
                 <button type="submit" name="userform"
                         class="btn btn-primary pull-right submitButton nextStep largeButton"
                         id="paypalVaultCheckoutButton"
+                        disabled
                 >
                     [{oxmultilang ident="OSC_PAYPAL_CONTINUE_TO_NEXT_STEP"}] <i class="fa fa-caret-right"></i>
                 </button>
             </div>
         </div>
     </div>
-
-    <script>
-        window.onload = function () {
-            document.getElementById("paypalVaultCheckoutButton").onclick = function () {
-                document.querySelectorAll(".vaulting_paymentsource").forEach(function (paymentsource) {
-                    if (paymentsource.checked) {
-                        document.getElementById("payment_oscpaypal").click();
-
-                        let input = document.createElement("input");
-                        input.type = "hidden";
-                        input.name = "vaultingpaymentsource";
-                        input.value = paymentsource.dataset.index;
-                        document.getElementById("payment").appendChild(input);
-
-                        document.getElementById("paymentNextStepBottom").click();
-                    }
-                });
-            }
-        }
-    </script>
 [{/if}]
 [{if 'oscpaypal_express'|array_key_exists:$oView->getPaymentList() && $oViewConf->isPayPalExpressSessionActive()}]
     [{assign var="config" value=$oViewConf->getPayPalCheckoutConfig()}]