ACP2E-2404: [Magento Cloud] Bug of product custom option validation in product view page

Author: Sarmistha

app/code/Magento/Catalog/view/frontend/web/product/view/validation.js

@@ -13,77 +13,77 @@ define([
     $.widget('mage.validation', $.mage.validation, {
         options: {
             radioCheckboxClosest: 'ul, ol',
+        },
 
-            /**
-             * @param {*} error
-             * @param {HTMLElement} element
-             */
-            errorPlacement: function (error, element) {
-                var messageBox,
-                    dataValidate;
+        /**
+         * @param {*} error
+         * @param {HTMLElement} element
+         */
+        errorPlacement: function (error, element) {
+            var messageBox,
+                dataValidate;
 
-                if ($(element).hasClass('datetime-picker')) {
-                    element = $(element).parent();
+            if ($(element).hasClass('datetime-picker')) {
+                element = $(element).parent();
 
-                    if (element.parent().find('.mage-error').length) {
-                        return;
-                    }
+                if (element.parent().find('.mage-error').length) {
+                    return;
                 }
+            }
 
-                if (element.attr('data-errors-message-box')) {
-                    messageBox = $(element.attr('data-errors-message-box'));
-                    messageBox.html(error);
+            if (element.attr('data-errors-message-box')) {
+                messageBox = $(element.attr('data-errors-message-box'));
+                messageBox.html(error);
 
-                    return;
-                }
+                return;
+            }
 
-                dataValidate = element.attr('data-validate');
+            dataValidate = element.attr('data-validate');
 
-                if (dataValidate && dataValidate.indexOf('validate-one-checkbox-required-by-name') > 0) {
-                    error.appendTo('#links-advice-container');
-                } else if (element.is(':radio, :checkbox')) {
-                    element.closest(this.radioCheckboxClosest).after(error);
-                } else {
-                    element.after(error);
-                }
-            },
+            if (dataValidate && dataValidate.indexOf('validate-one-checkbox-required-by-name') > 0) {
+                error.appendTo('#links-advice-container');
+            } else if (element.is(':radio, :checkbox')) {
+                element.closest(this.radioCheckboxClosest).after(error);
+            } else {
+                element.after(error);
+            }
+        },
 
-            /**
-             * @param {HTMLElement} element
-             * @param {String} errorClass
-             */
-            highlight: function (element, errorClass) {
-                var dataValidate = $(element).attr('data-validate');
+        /**
+         * @param {HTMLElement} element
+         * @param {String} errorClass
+         */
+        highlight: function (element, errorClass) {
+            var dataValidate = $(element).attr('data-validate');
 
-                if (dataValidate && dataValidate.indexOf('validate-required-datetime') > 0) {
-                    $(element).parent().find('.datetime-picker').each(function () {
-                        $(this).removeClass(errorClass);
+            if (dataValidate && dataValidate.indexOf('validate-required-datetime') > 0) {
+                $(element).parent().find('.datetime-picker').each(function () {
+                    $(this).removeClass(errorClass);
 
-                        if ($(this).val().length === 0) {
-                            $(this).addClass(errorClass);
-                        }
-                    });
-                } else if ($(element).is(':radio, :checkbox')) {
-                    $(element).closest(this.radioCheckboxClosest).addClass(errorClass);
-                } else {
-                    $(element).addClass(errorClass);
-                }
-            },
+                    if ($(this).val().length === 0) {
+                        $(this).addClass(errorClass);
+                    }
+                });
+            } else if ($(element).is(':radio, :checkbox')) {
+                $(element).closest(this.radioCheckboxClosest).addClass(errorClass);
+            } else {
+                $(element).addClass(errorClass);
+            }
+        },
 
-            /**
-             * @param {HTMLElement} element
-             * @param {String} errorClass
-             */
-            unhighlight: function (element, errorClass) {
-                var dataValidate = $(element).attr('data-validate');
+        /**
+         * @param {HTMLElement} element
+         * @param {String} errorClass
+         */
+        unhighlight: function (element, errorClass) {
+            var dataValidate = $(element).attr('data-validate');
 
-                if (dataValidate && dataValidate.indexOf('validate-required-datetime') > 0) {
-                    $(element).parent().find('.datetime-picker').removeClass(errorClass);
-                } else if ($(element).is(':radio, :checkbox')) {
-                    $(element).closest(this.radioCheckboxClosest).removeClass(errorClass);
-                } else {
-                    $(element).removeClass(errorClass);
-                }
+            if (dataValidate && dataValidate.indexOf('validate-required-datetime') > 0) {
+                $(element).parent().find('.datetime-picker').removeClass(errorClass);
+            } else if ($(element).is(':radio, :checkbox')) {
+                $(element).closest(this.radioCheckboxClosest).removeClass(errorClass);
+            } else {
+                $(element).removeClass(errorClass);
             }
         }
     });