Skip to content

Commit 364d994

Browse files
SarmisthaSarmistha
Sarmistha
authored and
Sarmistha
committed
Merge remote-tracking branch 'magento-l3/ACP2E-2404' into 2.4-develop
2 parents 4cde0ce + a58f4c4 commit 364d994

File tree

2 files changed

+117
-59
lines changed

2 files changed

+117
-59
lines changed

‎app/code/Magento/Catalog/Test/Mftf/Test/ProductViewPageCustomOptionValidationErrorMessageTest.xml‎

Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
<?xml version="1.0" encoding="UTF-8"?>
2+
<!--
3+
/**
4+
* Copyright © Magento, Inc. All rights reserved.
5+
* See COPYING.txt for license details.
6+
*/
7+
-->
8+
9+
<tests xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
10+
xsi:noNamespaceSchemaLocation="urn:magento:mftf:Test/etc/testSchema.xsd">
11+
<test name="ProductViewPageCustomOptionValidationErrorMessageTest">
12+
<annotations>
13+
<features value="Catalog"/>
14+
<stories value="Product view page"/>
15+
<title value="[Magento Cloud] Bug of product custom option validation in product view page"/>
16+
<description value="Check custom option validation error message is displayed in product view page"/>
17+
<severity value="AVERAGE"/>
18+
<testCaseId value="AC-9978"/>
19+
<useCaseId value="ACP2E-2404"/>
20+
<group value="Catalog"/>
21+
</annotations>
22+
<before>
23+
<actionGroup ref="AdminLoginActionGroup" stepKey="LoginAsAdmin" />
24+
<createData entity="SimpleProduct2" stepKey="createProduct"/>
25+
<!-- open product edit page -->
26+
<actionGroup ref="AdminProductPageOpenByIdActionGroup" stepKey="goToProductEditPage">
27+
<argument name="productId" value="$$createProduct.id$$"/>
28+
</actionGroup>
29+
<!-- Create a custom option(radio button) with 2 values -->
30+
<click stepKey="openCustomizableOptions" selector="{{AdminProductCustomizableOptionsSection.customizableOptions}}"/>
31+
<waitForPageLoad stepKey="waitForCustomOptionsOpen"/>
32+
<actionGroup ref="CreateCustomRadioOptionsActionGroup" stepKey="createCustomOption1">
33+
<argument name="customOptionName" value="ProductOptionRadiobutton.title"/>
34+
<argument name="productOption" value="ProductOptionField"/>
35+
<argument name="productOption2" value="ProductOptionField2"/>
36+
</actionGroup>
37+
<!-- Save the product -->
38+
<actionGroup ref="AdminProductFormSaveActionGroup" stepKey="saveProduct"/>
39+
<seeElement selector="{{AdminCategoryMessagesSection.SuccessMessage}}" stepKey="assertSuccess"/>
40+
<!-- indexer reindex -->
41+
<actionGroup ref="CliIndexerReindexActionGroup" stepKey="reindex">
42+
<argument name="indices" value=""/>
43+
</actionGroup>
44+
</before>
45+
<after>
46+
<deleteData createDataKey="createProduct" stepKey="deleteProduct"/>
47+
<actionGroup ref="AdminLogoutActionGroup" stepKey="logout"/>
48+
</after>
49+
<!-- Navigate to Product Page on StoreFront -->
50+
<actionGroup ref="StorefrontOpenProductPageActionGroup" stepKey="openStorefrontProductPage">
51+
<argument name="productUrl" value="$$createProduct.custom_attributes[url_key]$$"/>
52+
</actionGroup>
53+
<!-- Add Product to Cart from product detail page -->
54+
<click selector="{{StorefrontProductActionSection.addToCart}}" stepKey="addToCart"/>
55+
<!-- see custom option validation message -->
56+
<see userInput="This is a required field." stepKey="seeRequiredField"/>
57+
</test>
58+
</tests>

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

Lines changed: 59 additions & 59 deletions
Original file line numberDiff line numberDiff line change
@@ -12,78 +12,78 @@ define([
1212

1313
$.widget('mage.validation', $.mage.validation, {
1414
options: {
15-
radioCheckboxClosest: 'ul, ol',
15+
radioCheckboxClosest: 'ul, ol'
16+
},
1617

17-
/**
18-
* @param {*} error
19-
* @param {HTMLElement} element
20-
*/
21-
errorPlacement: function (error, element) {
22-
var messageBox,
23-
dataValidate;
18+
/**
19+
* @param {*} error
20+
* @param {HTMLElement} element
21+
*/
22+
errorPlacement: function (error, element) {
23+
var messageBox,
24+
dataValidate;
2425

25-
if ($(element).hasClass('datetime-picker')) {
26-
element = $(element).parent();
26+
if ($(element).hasClass('datetime-picker')) {
27+
element = $(element).parent();
2728

28-
if (element.parent().find('.mage-error').length) {
29-
return;
30-
}
29+
if (element.parent().find('.mage-error').length) {
30+
return;
3131
}
32+
}
3233

33-
if (element.attr('data-errors-message-box')) {
34-
messageBox = $(element.attr('data-errors-message-box'));
35-
messageBox.html(error);
34+
if (element.attr('data-errors-message-box')) {
35+
messageBox = $(element.attr('data-errors-message-box'));
36+
messageBox.html(error);
3637

37-
return;
38-
}
38+
return;
39+
}
3940

40-
dataValidate = element.attr('data-validate');
41+
dataValidate = element.attr('data-validate');
4142

42-
if (dataValidate && dataValidate.indexOf('validate-one-checkbox-required-by-name') > 0) {
43-
error.appendTo('#links-advice-container');
44-
} else if (element.is(':radio, :checkbox')) {
45-
element.closest(this.radioCheckboxClosest).after(error);
46-
} else {
47-
element.after(error);
48-
}
49-
},
43+
if (dataValidate && dataValidate.indexOf('validate-one-checkbox-required-by-name') > 0) {
44+
error.appendTo('#links-advice-container');
45+
} else if (element.is(':radio, :checkbox')) {
46+
element.closest(this.radioCheckboxClosest).after(error);
47+
} else {
48+
element.after(error);
49+
}
50+
},
5051

51-
/**
52-
* @param {HTMLElement} element
53-
* @param {String} errorClass
54-
*/
55-
highlight: function (element, errorClass) {
56-
var dataValidate = $(element).attr('data-validate');
52+
/**
53+
* @param {HTMLElement} element
54+
* @param {String} errorClass
55+
*/
56+
highlight: function (element, errorClass) {
57+
var dataValidate = $(element).attr('data-validate');
5758

58-
if (dataValidate && dataValidate.indexOf('validate-required-datetime') > 0) {
59-
$(element).parent().find('.datetime-picker').each(function () {
60-
$(this).removeClass(errorClass);
59+
if (dataValidate && dataValidate.indexOf('validate-required-datetime') > 0) {
60+
$(element).parent().find('.datetime-picker').each(function () {
61+
$(this).removeClass(errorClass);
6162

62-
if ($(this).val().length === 0) {
63-
$(this).addClass(errorClass);
64-
}
65-
});
66-
} else if ($(element).is(':radio, :checkbox')) {
67-
$(element).closest(this.radioCheckboxClosest).addClass(errorClass);
68-
} else {
69-
$(element).addClass(errorClass);
70-
}
71-
},
63+
if ($(this).val().length === 0) {
64+
$(this).addClass(errorClass);
65+
}
66+
});
67+
} else if ($(element).is(':radio, :checkbox')) {
68+
$(element).closest(this.radioCheckboxClosest).addClass(errorClass);
69+
} else {
70+
$(element).addClass(errorClass);
71+
}
72+
},
7273

73-
/**
74-
* @param {HTMLElement} element
75-
* @param {String} errorClass
76-
*/
77-
unhighlight: function (element, errorClass) {
78-
var dataValidate = $(element).attr('data-validate');
74+
/**
75+
* @param {HTMLElement} element
76+
* @param {String} errorClass
77+
*/
78+
unhighlight: function (element, errorClass) {
79+
var dataValidate = $(element).attr('data-validate');
7980

80-
if (dataValidate && dataValidate.indexOf('validate-required-datetime') > 0) {
81-
$(element).parent().find('.datetime-picker').removeClass(errorClass);
82-
} else if ($(element).is(':radio, :checkbox')) {
83-
$(element).closest(this.radioCheckboxClosest).removeClass(errorClass);
84-
} else {
85-
$(element).removeClass(errorClass);
86-
}
81+
if (dataValidate && dataValidate.indexOf('validate-required-datetime') > 0) {
82+
$(element).parent().find('.datetime-picker').removeClass(errorClass);
83+
} else if ($(element).is(':radio, :checkbox')) {
84+
$(element).closest(this.radioCheckboxClosest).removeClass(errorClass);
85+
} else {
86+
$(element).removeClass(errorClass);
8787
}
8888
}
8989
});

0 commit comments

Comments
 (0)