Skip to content

Commit 54f93e2

Browse files
author
Vaha
committed
fixed 'wrong image gallery', 'wrong gallery behavior when query url' for swatches, 'product image updating' for dropdown type, added MFTF tests to cover all cases: #26473, #26856, #26858
1 parent 3455667 commit 54f93e2

10 files changed

+488
-32
lines changed
Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
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+
<actionGroups xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
10+
xsi:noNamespaceSchemaLocation="urn:magento:mftf:Test/etc/actionGroupSchema.xsd">
11+
<actionGroup name="AdminAssignImageBaseRoleActionGroup">
12+
<annotations>
13+
<description>Requires the navigation to the Product Creation page. Checks the Base Role area for image.</description>
14+
</annotations>
15+
<arguments>
16+
<argument name="image"/>
17+
</arguments>
18+
<conditionalClick selector="{{AdminProductImagesSection.productImagesToggle}}" dependentSelector="{{AdminProductImagesSection.imageFile(image.fileName)}}" visible="false" stepKey="expandImages"/>
19+
<waitForElementVisible selector="{{AdminProductImagesSection.imageFile(image.fileName)}}" stepKey="seeProductImageName"/>
20+
<click selector="{{AdminProductImagesSection.imageFile(image.fileName)}}" stepKey="clickProductImage"/>
21+
<waitForElementVisible selector="{{AdminProductImagesSection.altText}}" stepKey="seeAltTextSection"/>
22+
<checkOption selector="{{AdminProductImagesSection.roleBase}}" stepKey="checkRoles"/>
23+
<click selector="{{AdminSlideOutDialogSection.closeButton}}" stepKey="clickCloseButton"/>
24+
</actionGroup>
25+
</actionGroups>

app/code/Magento/Catalog/Test/Mftf/Data/ProductData.xml

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -876,6 +876,14 @@
876876
<data key="weight">5</data>
877877
<requiredEntity type="product_extension_attribute">EavStock100</requiredEntity>
878878
</entity>
879+
<entity name="Magento2" type="image">
880+
<data key="title" unique="suffix">Magento2</data>
881+
<data key="file_type">Upload File</data>
882+
<data key="shareable">Yes</data>
883+
<data key="file">magento2.jpg</data>
884+
<data key="filename">magento2</data>
885+
<data key="file_extension">jpg</data>
886+
</entity>
879887
<entity name="Magento3" type="image">
880888
<data key="title" unique="suffix">Magento3</data>
881889
<data key="price">1.00</data>
Lines changed: 228 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,228 @@
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="StorefrontConfigurableOptionsThumbImagesTest">
12+
<annotations>
13+
<stories value="Configurable Product"/>
14+
<title value="Check thumbnail images and active image for Configurable Product"/>
15+
<description value="Login as admin, create attribute with two options, configurable product with two
16+
associated simple products. Add few images for products, check the fotorama thumbnail images
17+
(visible and active) for each selected option for the configurable product"/>
18+
<group value="catalog"/>
19+
</annotations>
20+
<before>
21+
<!-- Login as Admin -->
22+
<actionGroup ref="LoginAsAdmin" stepKey="loginToAdminPanel"/>
23+
24+
<!-- Create Default Category -->
25+
<createData entity="_defaultCategory" stepKey="createCategory"/>
26+
27+
<!-- Create an attribute with two options to be used in the first child product -->
28+
<createData entity="productAttributeWithTwoOptions" stepKey="createConfigProductAttribute"/>
29+
<createData entity="productAttributeOption1" stepKey="createConfigProductAttributeOption1">
30+
<requiredEntity createDataKey="createConfigProductAttribute"/>
31+
</createData>
32+
<createData entity="productAttributeOption2" stepKey="createConfigProductAttributeOption2">
33+
<requiredEntity createDataKey="createConfigProductAttribute"/>
34+
</createData>
35+
36+
<!-- Add the attribute just created to default attribute set -->
37+
<createData entity="AddToDefaultSet" stepKey="createConfigAddToAttributeSet">
38+
<requiredEntity createDataKey="createConfigProductAttribute"/>
39+
</createData>
40+
41+
<!-- Get the first option of the attribute created -->
42+
<getData entity="ProductAttributeOptionGetter" index="1" stepKey="getConfigAttributeOption1">
43+
<requiredEntity createDataKey="createConfigProductAttribute"/>
44+
</getData>
45+
46+
<!-- Get the second option of the attribute created -->
47+
<getData entity="ProductAttributeOptionGetter" index="2" stepKey="getConfigAttributeOption2">
48+
<requiredEntity createDataKey="createConfigProductAttribute"/>
49+
</getData>
50+
51+
<!-- Create Configurable product -->
52+
<createData entity="BaseConfigurableProduct" stepKey="createConfigProduct">
53+
<requiredEntity createDataKey="createCategory"/>
54+
</createData>
55+
56+
<!-- Create a simple product and give it the attribute with the first option -->
57+
<createData entity="ApiSimpleOne" stepKey="createConfigChildProduct1">
58+
<requiredEntity createDataKey="createConfigProductAttribute"/>
59+
<requiredEntity createDataKey="getConfigAttributeOption1"/>
60+
</createData>
61+
62+
<!--Create a simple product and give it the attribute with the second option -->
63+
<createData entity="ApiSimpleTwo" stepKey="createConfigChildProduct2">
64+
<requiredEntity createDataKey="createConfigProductAttribute"/>
65+
<requiredEntity createDataKey="getConfigAttributeOption2"/>
66+
</createData>
67+
68+
<!-- Create the configurable product -->
69+
<createData entity="ConfigurableProductTwoOptions" stepKey="createConfigProductOption">
70+
<requiredEntity createDataKey="createConfigProduct"/>
71+
<requiredEntity createDataKey="createConfigProductAttribute"/>
72+
<requiredEntity createDataKey="getConfigAttributeOption1"/>
73+
<requiredEntity createDataKey="getConfigAttributeOption2"/>
74+
</createData>
75+
76+
<!-- Add the first simple product to the configurable product -->
77+
<createData entity="ConfigurableProductAddChild" stepKey="createConfigProductAddChild1">
78+
<requiredEntity createDataKey="createConfigProduct"/>
79+
<requiredEntity createDataKey="createConfigChildProduct1"/>
80+
</createData>
81+
82+
<!-- Add the second simple product to the configurable product -->
83+
<createData entity="ConfigurableProductAddChild" stepKey="createConfigProductAddChild2">
84+
<requiredEntity createDataKey="createConfigProduct"/>
85+
<requiredEntity createDataKey="createConfigChildProduct2"/>
86+
</createData>
87+
88+
<!-- ConfigProduct -->
89+
<!-- Go to Product Page (ConfigProduct) -->
90+
<actionGroup ref="GoToProductPageViaIDActionGroup" stepKey="goToConfigProduct">
91+
<argument name="productId" value="$$createConfigProduct.id$$"/>
92+
</actionGroup>
93+
94+
<!--Switch to 'Default Store View' scope and open product page-->
95+
<actionGroup ref="SwitchToTheNewStoreViewActionGroup" stepKey="SwitchDefaultStoreViewForConfigProduct">
96+
<argument name="storeViewName" value="'Default Store View'"/>
97+
</actionGroup>
98+
99+
<!-- Add images for ConfigProduct -->
100+
<actionGroup ref="AddProductImageActionGroup" stepKey="addConfigProductMagento3">
101+
<argument name="image" value="Magento3"/>
102+
</actionGroup>
103+
104+
<actionGroup ref="AddProductImageActionGroup" stepKey="addConfigProductTestImageAdobe">
105+
<argument name="image" value="TestImageAdobe"/>
106+
</actionGroup>
107+
<actionGroup ref="AdminAssignImageBaseRoleActionGroup" stepKey="assignTestImageAdobeBaseRole">
108+
<argument name="image" value="TestImageAdobe"/>
109+
</actionGroup>
110+
111+
<!-- Save changes fot ConfigProduct -->
112+
<actionGroup ref="SaveProductFormActionGroup" stepKey="saveConfigProductProduct"/>
113+
114+
<!-- ChildProduct1 -->
115+
<!-- Go to Product Page (ChildProduct1) -->
116+
<actionGroup ref="GoToProductPageViaIDActionGroup" stepKey="goToChildProduct1">
117+
<argument name="productId" value="$$createConfigChildProduct1.id$$"/>
118+
</actionGroup>
119+
120+
<!--Switch to 'Default Store View' scope and open product page-->
121+
<actionGroup ref="SwitchToTheNewStoreViewActionGroup" stepKey="SwitchDefaultStoreViewForChildProduct1">
122+
<argument name="storeViewName" value="'Default Store View'"/>
123+
</actionGroup>
124+
125+
<!-- Add images for ChildProduct1 -->
126+
<actionGroup ref="AddProductImageActionGroup" stepKey="addChildProduct1ProductImage">
127+
<argument name="image" value="ProductImage"/>
128+
</actionGroup>
129+
<actionGroup ref="AddProductImageActionGroup" stepKey="addChildProduct1Magento2">
130+
<argument name="image" value="Magento2"/>
131+
</actionGroup>
132+
<actionGroup ref="AdminAssignImageRolesIfUnassignedActionGroup" stepKey="assignMagento2Role">
133+
<argument name="image" value="Magento2"/>
134+
</actionGroup>
135+
136+
<!-- Save changes fot ChildProduct1 -->
137+
<actionGroup ref="SaveProductFormActionGroup" stepKey="saveChildProduct1Product"/>
138+
139+
<!-- ChildProduct2 -->
140+
<!-- Go to Product Page (ChildProduct2) -->
141+
<actionGroup ref="GoToProductPageViaIDActionGroup" stepKey="goToChildProduct2">
142+
<argument name="productId" value="$$createConfigChildProduct2.id$$"/>
143+
</actionGroup>
144+
145+
<!--Switch to 'Default Store View' scope and open product page-->
146+
<actionGroup ref="SwitchToTheNewStoreViewActionGroup" stepKey="SwitchDefaultStoreViewForChildProduct2">
147+
<argument name="storeViewName" value="'Default Store View'"/>
148+
</actionGroup>
149+
150+
<!-- Add image for ChildProduct2 -->
151+
<actionGroup ref="AddProductImageActionGroup" stepKey="addChildProduct2TestImageNew">
152+
<argument name="image" value="TestImageNew"/>
153+
</actionGroup>
154+
155+
<!-- Save changes fot ChildProduct2 -->
156+
<actionGroup ref="SaveProductFormActionGroup" stepKey="saveChildProduct2Product"/>
157+
</before>
158+
<after>
159+
<!-- Delete Created Data -->
160+
<deleteData createDataKey="createCategory" stepKey="deleteCategory"/>
161+
<deleteData createDataKey="createConfigProduct" stepKey="deleteConfigProduct"/>
162+
<deleteData createDataKey="createConfigChildProduct1" stepKey="deleteConfigChildProduct1"/>
163+
<deleteData createDataKey="createConfigChildProduct2" stepKey="deleteConfigChildProduct2"/>
164+
<deleteData createDataKey="createConfigProductAttribute" stepKey="deleteAttribute"/>
165+
<actionGroup ref="logout" stepKey="logout"/>
166+
167+
<!-- Reindex invalidated indices after product attribute has been created/deleted -->
168+
<actionGroup ref="CliRunReindexUsingCronJobsActionGroup" stepKey="reindexInvalidatedIndices"/>
169+
</after>
170+
171+
<!-- Open ConfigProduct in Store Front Page -->
172+
<amOnPage url="$$createConfigProduct.sku$$.html" stepKey="openProductInStoreFront"/>
173+
<waitForPageLoad stepKey="waitForProductToLoad"/>
174+
175+
<!-- Check fotorama thumbnail images (no selected options) -->
176+
<actionGroup ref="StorefrontAssertFotoramaImageAvailabilityActionGroup" stepKey="seeMagento3ForNoOption">
177+
<argument name="fileName" value="{{Magento3.filename}}"/>
178+
</actionGroup>
179+
180+
<actionGroup ref="StorefrontAssertFotoramaImageAvailabilityActionGroup" stepKey="seeActiveTestImageAdobeForNoOption">
181+
<argument name="fileName" value="{{TestImageAdobe.filename}}"/>
182+
</actionGroup>
183+
184+
<!-- Select first option -->
185+
<actionGroup ref="StorefrontProductPageSelectDropDownOptionValueActionGroup" stepKey="selectFirstOptionValue">
186+
<argument name="attributeLabel" value="$$createConfigProductAttribute.default_frontend_label$$"/>
187+
<argument name="optionLabel" value="$$getConfigAttributeOption1.label$$"/>
188+
</actionGroup>
189+
190+
<!-- Check fotorama thumbnail images (first option selected) -->
191+
<actionGroup ref="StorefrontAssertFotoramaImageAvailabilityActionGroup" stepKey="seeMagento3ForFirstOption">
192+
<argument name="fileName" value="{{Magento3.filename}}"/>
193+
</actionGroup>
194+
195+
<actionGroup ref="StorefrontAssertFotoramaImageAvailabilityActionGroup" stepKey="seeTestImageAdobeForFirstOption">
196+
<argument name="fileName" value="{{TestImageAdobe.filename}}"/>
197+
</actionGroup>
198+
199+
<actionGroup ref="StorefrontAssertFotoramaImageAvailabilityActionGroup" stepKey="seeProductImageForFirstOption">
200+
<argument name="fileName" value="{{ProductImage.filename}}"/>
201+
</actionGroup>
202+
203+
<!-- Check active fotorama thumbnail image (first option selected) -->
204+
<actionGroup ref="StorefrontAssertActiveProductImageActionGroup" stepKey="seeActiveMagento2ForFirstOption">
205+
<argument name="fileName" value="{{Magento2.filename}}"/>
206+
</actionGroup>
207+
208+
<!-- Select second option -->
209+
<actionGroup ref="StorefrontProductPageSelectDropDownOptionValueActionGroup" stepKey="selectSecondOptionValue">
210+
<argument name="attributeLabel" value="$$createConfigProductAttribute.default_frontend_label$$"/>
211+
<argument name="optionLabel" value="$$getConfigAttributeOption2.label$$"/>
212+
</actionGroup>
213+
214+
<!-- Check fotorama thumbnail images (second option selected) -->
215+
<actionGroup ref="StorefrontAssertFotoramaImageAvailabilityActionGroup" stepKey="seeMagento3ForSecondOption">
216+
<argument name="fileName" value="{{Magento3.filename}}"/>
217+
</actionGroup>
218+
219+
<actionGroup ref="StorefrontAssertFotoramaImageAvailabilityActionGroup" stepKey="seeTestImageAdobeForSecondOption">
220+
<argument name="fileName" value="{{TestImageAdobe.filename}}"/>
221+
</actionGroup>
222+
223+
<!-- Check active fotorama thumbnail image (second option selected) -->
224+
<actionGroup ref="StorefrontAssertActiveProductImageActionGroup" stepKey="seeActiveTestImageNewForSecondOption">
225+
<argument name="fileName" value="{{TestImageNew.filename}}"/>
226+
</actionGroup>
227+
</test>
228+
</tests>
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
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="StorefrontSelectedByQueryParamsConfigurableOptionsThumbImagesTest"
12+
extends="StorefrontConfigurableOptionsThumbImagesTest">
13+
<annotations>
14+
<stories value="Configurable Product"/>
15+
<title value="Check thumbnail images and active image for Configurable Product with predefined
16+
by query params options"/>
17+
<description value="Login as admin, create attribute with two options, configurable product with two
18+
associated simple products. Add few images for products, check the fotorama thumbnail images
19+
(visible and active) for each option for the configurable product using product URL with params
20+
to selected needed option."/>
21+
<group value="catalog"/>
22+
</annotations>
23+
24+
<!-- Select first option using product query params URL -->
25+
<amOnPage
26+
url="$$createConfigProduct.sku$$.html#$$createConfigProductAttribute.attribute_id$$=$$getConfigAttributeOption1.value$$"
27+
stepKey="selectFirstOptionValue"/>
28+
<reloadPage stepKey="selectFirstOptionValueRefreshPage" after="selectFirstOptionValue"/>
29+
<waitForPageLoad stepKey="waitForProductWithSelectedFirstOptionToLoad" after="selectFirstOptionValueRefreshPage"/>
30+
31+
<!-- Select second option using product query params URL -->
32+
<amOnPage
33+
url="$$createConfigProduct.sku$$.html#$$createConfigProductAttribute.attribute_id$$=$$getConfigAttributeOption2.value$$"
34+
stepKey="selectSecondOptionValue"/>
35+
<reloadPage stepKey="selectSecondOptionValueRefreshPage" after="selectSecondOptionValue"/>
36+
<waitForPageLoad stepKey="waitForProductWithSelectedSecondOptionToLoad" after="selectSecondOptionValueRefreshPage"/>
37+
</test>
38+
</tests>

app/code/Magento/ConfigurableProduct/view/frontend/web/js/configurable.js

Lines changed: 33 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,8 @@ define([
1313
'priceUtils',
1414
'priceBox',
1515
'jquery-ui-modules/widget',
16-
'jquery/jquery.parsequery'
16+
'jquery/jquery.parsequery',
17+
'fotoramaVideoEvents'
1718
], function ($, _, mageTemplate, $t, priceUtils) {
1819
'use strict';
1920

@@ -307,9 +308,13 @@ define([
307308
_changeProductImage: function () {
308309
var images,
309310
initialImages = this.options.mediaGalleryInitial,
310-
galleryObject = $(this.options.mediaGallerySelector).data('gallery');
311+
gallery = $(this.options.mediaGallerySelector).data('gallery');
312+
313+
if (_.isUndefined(gallery)) {
314+
$(this.options.mediaGallerySelector).on('gallery:loaded', function () {
315+
this._changeProductImage();
316+
}.bind(this));
311317

312-
if (!galleryObject) {
313318
return;
314319
}
315320

@@ -325,17 +330,35 @@ define([
325330
images = $.extend(true, [], images);
326331
images = this._setImageIndex(images);
327332

328-
galleryObject.updateData(images);
329-
330-
$(this.options.mediaGallerySelector).AddFotoramaVideoEvents({
331-
selectedOption: this.simpleProduct,
332-
dataMergeStrategy: this.options.gallerySwitchStrategy
333-
});
333+
gallery.updateData(images);
334+
this._addFotoramaVideoEvents(false);
334335
} else {
335-
galleryObject.updateData(initialImages);
336+
gallery.updateData(initialImages);
337+
this._addFotoramaVideoEvents(true);
338+
}
339+
},
340+
341+
/**
342+
* Add video events
343+
*
344+
* @param {Boolean} isInitial
345+
* @private
346+
*/
347+
_addFotoramaVideoEvents: function (isInitial) {
348+
if (_.isUndefined($.mage.AddFotoramaVideoEvents)) {
349+
return;
350+
}
351+
352+
if (isInitial) {
336353
$(this.options.mediaGallerySelector).AddFotoramaVideoEvents();
354+
355+
return;
337356
}
338357

358+
$(this.options.mediaGallerySelector).AddFotoramaVideoEvents({
359+
selectedOption: this.simpleProduct,
360+
dataMergeStrategy: this.options.gallerySwitchStrategy
361+
});
339362
},
340363

341364
/**
Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
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+
<actionGroups xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
10+
xsi:noNamespaceSchemaLocation="urn:magento:mftf:Test/etc/actionGroupSchema.xsd">
11+
<actionGroup name="AdminUpdateAttributeInputTypeActionGroup">
12+
<annotations>
13+
<description>Set value for the "Catalog Input Type for Store Owner" attribute option</description>
14+
</annotations>
15+
<arguments>
16+
<argument name="value" type="string" defaultValue="swatch_visual"/>
17+
</arguments>
18+
<selectOption selector="{{AttributePropertiesSection.InputType}}" userInput="{{value}}" stepKey="setInputType"/>
19+
</actionGroup>
20+
</actionGroups>

0 commit comments

Comments
 (0)