From 729251495f332ba39b96b5721538f209b5a5ed9a Mon Sep 17 00:00:00 2001 From: Alex P Date: Tue, 9 May 2023 12:01:26 +0300 Subject: [PATCH 1/2] Handle empty acdc fields --- .../js/modules/Renderer/CreditCardRenderer.js | 18 +++++++++++++++++- modules/ppcp-button/src/Assets/SmartButton.php | 4 ++++ 2 files changed, 21 insertions(+), 1 deletion(-) diff --git a/modules/ppcp-button/resources/js/modules/Renderer/CreditCardRenderer.js b/modules/ppcp-button/resources/js/modules/Renderer/CreditCardRenderer.js index 0ddafdd15..ac0d62841 100644 --- a/modules/ppcp-button/resources/js/modules/Renderer/CreditCardRenderer.js +++ b/modules/ppcp-button/resources/js/modules/Renderer/CreditCardRenderer.js @@ -10,6 +10,7 @@ class CreditCardRenderer { this.spinner = spinner; this.cardValid = false; this.formValid = false; + this.emptyFields = new Set(['number', 'cvv', 'expirationDate']); this.currentHostedFieldsInstance = null; } @@ -138,6 +139,12 @@ class CreditCardRenderer { this.formValid = formValid; }); + hostedFields.on('empty', (event) => { + this.emptyFields.add(event.emittedBy); + }); + hostedFields.on('notEmpty', (event) => { + this.emptyFields.delete(event.emittedBy); + }); show(buttonSelector); @@ -249,7 +256,16 @@ class CreditCardRenderer { }); } else { this.spinner.unblock(); - const message = ! this.cardValid ? this.defaultConfig.hosted_fields.labels.card_not_supported : this.defaultConfig.hosted_fields.labels.fields_not_valid; + + let message = this.defaultConfig.labels.error.generic; + if (this.emptyFields.size > 0) { + message = this.defaultConfig.hosted_fields.labels.fields_empty; + } else if (!this.cardValid) { + message = this.defaultConfig.hosted_fields.labels.card_not_supported; + } else if (!this.formValid) { + message = this.defaultConfig.hosted_fields.labels.fields_not_valid; + } + this.errorHandler.message(message); } } diff --git a/modules/ppcp-button/src/Assets/SmartButton.php b/modules/ppcp-button/src/Assets/SmartButton.php index 7f07c332a..bc4e4d82b 100644 --- a/modules/ppcp-button/src/Assets/SmartButton.php +++ b/modules/ppcp-button/src/Assets/SmartButton.php @@ -893,6 +893,10 @@ class SmartButton implements SmartButtonInterface { 'credit_card_number' => '', 'cvv' => '', 'mm_yy' => __( 'MM/YY', 'woocommerce-paypal-payments' ), + 'fields_empty' => __( + 'Card payment details are missing. Please fill in all required fields.', + 'woocommerce-paypal-payments' + ), 'fields_not_valid' => __( 'Unfortunately, your credit card details are not valid.', 'woocommerce-paypal-payments' From 04bc1ba37f3ddf78bd224fdccd469075091d9936 Mon Sep 17 00:00:00 2001 From: Alex P Date: Tue, 9 May 2023 12:02:57 +0300 Subject: [PATCH 2/2] Fix js error --- .../resources/js/modules/Renderer/CreditCardRenderer.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/modules/ppcp-button/resources/js/modules/Renderer/CreditCardRenderer.js b/modules/ppcp-button/resources/js/modules/Renderer/CreditCardRenderer.js index ac0d62841..fcd20a609 100644 --- a/modules/ppcp-button/resources/js/modules/Renderer/CreditCardRenderer.js +++ b/modules/ppcp-button/resources/js/modules/Renderer/CreditCardRenderer.js @@ -131,7 +131,7 @@ class CreditCardRenderer { return event.fields[key].isValid; }); - const className = this._cardNumberFiledCLassNameByCardType(event.cards[0].type); + const className = event.cards.length ? this._cardNumberFiledCLassNameByCardType(event.cards[0].type) : ''; event.fields.number.isValid ? cardNumber.classList.add(className) : this._recreateElementClassAttribute(cardNumber, cardNumberField.className);