diff --git a/modules/ppcp-button/resources/js/button.js b/modules/ppcp-button/resources/js/button.js index 03a38a3f7..23a9d71b9 100644 --- a/modules/ppcp-button/resources/js/button.js +++ b/modules/ppcp-button/resources/js/button.js @@ -66,7 +66,7 @@ const bootstrap = () => { errorHandler.clear(); if (messages.length) { - messages.forEach(s => errorHandler.message(s)); + errorHandler.messages(messages); } else { errorHandler.message(PayPalCommerceGateway.labels.error.required.generic); } diff --git a/modules/ppcp-button/resources/js/modules/ErrorHandler.js b/modules/ppcp-button/resources/js/modules/ErrorHandler.js index 9cd4ac174..c402aa751 100644 --- a/modules/ppcp-button/resources/js/modules/ErrorHandler.js +++ b/modules/ppcp-button/resources/js/modules/ErrorHandler.js @@ -17,21 +17,48 @@ class ErrorHandler { appendPreparedErrorMessageElement(errorMessageElement) { - if(this.messagesList === null) { - this.prepareMessagesList(); + if (this.messagesList === null) { + this._prepareMessagesList(); } this.messagesList.replaceWith(errorMessageElement); } + /** + * @param {String} text + * @param {Boolean} persist + */ message(text, persist = false) { - if(! typeof String || text.length === 0){ + this._addMessage(text, persist); + + this._scrollToMessages(); + } + + /** + * @param {Array} texts + * @param {Boolean} persist + */ + messages(texts, persist = false) + { + texts.forEach(t => this._addMessage(t, persist)); + + this._scrollToMessages(); + } + + /** + * @private + * @param {String} text + * @param {Boolean} persist + */ + _addMessage(text, persist = false) + { + if(! typeof String || text.length === 0) { throw new Error('A new message text must be a non-empty string.'); } - if(this.messagesList === null){ - this.prepareMessagesList(); + if (this.messagesList === null){ + this._prepareMessagesList(); } if (persist) { @@ -40,15 +67,24 @@ class ErrorHandler { this.wrapper.classList.remove('ppcp-persist'); } - let messageNode = this.prepareMessagesListItem(text); + let messageNode = this._prepareMessagesListItem(text); this.messagesList.appendChild(messageNode); - - jQuery.scroll_to_notices(jQuery('.woocommerce-notices-wrapper')) } - prepareMessagesList() + /** + * @private + */ + _scrollToMessages() { - if(this.messagesList === null){ + jQuery.scroll_to_notices(jQuery('.woocommerce-notices-wrapper')); + } + + /** + * @private + */ + _prepareMessagesList() + { + if (this.messagesList === null) { this.messagesList = document.createElement('ul'); this.messagesList.setAttribute('class', 'woocommerce-error'); this.messagesList.setAttribute('role', 'alert'); @@ -56,7 +92,10 @@ class ErrorHandler { } } - prepareMessagesListItem(message) + /** + * @private + */ + _prepareMessagesListItem(message) { const li = document.createElement('li'); li.innerHTML = message; @@ -64,13 +103,6 @@ class ErrorHandler { return li; } - sanitize(text) - { - const textarea = document.createElement('textarea'); - textarea.innerHTML = text; - return textarea.value.replace('Error: ', ''); - } - clear() { if (this.messagesList === null) {