Skip to content

Commit 9ea17db

Browse files
author
joiecaquicla
committed
magento2/magento2-page-builder#637: Form field/field group viewport scope - added ViewportSwitcherMobileSlideItemMinHeightTest, modified ViewportSwitcherMobileSliderMinHeightTest
1 parent d0cd7ba commit 9ea17db

File tree

2 files changed

+227
-3
lines changed

2 files changed

+227
-3
lines changed
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,224 @@
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+
<tests xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:mftf:Test/etc/testSchema.xsd">
9+
<test name="ViewportSwitcherMobileSlideItemMinHeightTest" extends="ViewportSwitcherMobileRowMinHeightTest">
10+
<annotations>
11+
<features value="PageBuilder"/>
12+
<stories value="Viewport Switcher"/>
13+
<title value="Mobile Viewport: Verify Slide Item Minimum Height Works As Expected Between Mobile And Desktop"/>
14+
<description value="Verify Slide Item's minimum height behaves as expected when desktop is set and mobile is empty, when desktop is set and mobile is set to calculated value, and when desktop is empty and mobile is set through Block content type."/>
15+
<severity value="BLOCKER"/>
16+
<group value="pagebuilder"/>
17+
<group value="pagebuilder-cms-block"/>
18+
<group value="pagebuilder-viewport-switcher"/>
19+
<group value="pagebuilder-slide"/>
20+
<group value="pagebuilder-sliderCommon"/>
21+
<group value="pagebuilder-slideItemCommon"/>
22+
</annotations>
23+
<!-- Add Slider Content Type -->
24+
<actionGroup ref="expandPageBuilderPanelMenuSection" stepKey="expandPageBuilderPanelMenuSection" before="dragContentTypeToStage">
25+
<argument name="contentType" value="PageBuilderSliderContentType"/>
26+
</actionGroup>
27+
<actionGroup ref="dragContentTypeToStage" stepKey="dragContentTypeToStage" before="openSlideItemEditPanel">
28+
<argument name="contentType" value="PageBuilderSliderContentType"/>
29+
</actionGroup>
30+
<actionGroup ref="openPageBuilderEditPanelSmallByIndex" stepKey="openEditPanel">
31+
<argument name="section" value="SlideOnBackend"/>
32+
</actionGroup>
33+
<actionGroup ref="fillSlideOutPanelFieldGeneral" stepKey="removeSlideItemDefaultMinHeight" before="enterPadding">
34+
<argument name="property" value="PageBuilderMinHeightProperty_Empty"/>
35+
</actionGroup>
36+
37+
<!-- Duplicate Slide Item -->
38+
<actionGroup ref="duplicateContentType" stepKey="duplicateContentType1">
39+
<argument name="contentType" value="PageBuilderSliderContentType"/>
40+
<argument name="targetIndex" value="1"/>
41+
</actionGroup>
42+
<actionGroup ref="duplicateContentType" stepKey="duplicateContentType2">
43+
<argument name="contentType" value="PageBuilderSliderContentType"/>
44+
<argument name="targetIndex" value="1"/>
45+
</actionGroup>
46+
47+
<actionGroup ref="unFocusOptionMenu" stepKey="unFocusSlideOptionMenu" before="openEditPanel1">
48+
<argument name="contentType" value="PageBuilderSlideContentType"/>
49+
</actionGroup>
50+
51+
<!-- Slide Item 1: Desktop Min Height = 500px -->
52+
<actionGroup ref="openPageBuilderEditPanelSmallByIndex" stepKey="openEditPanel1">
53+
<argument name="section" value="SlideOnBackend"/>
54+
<argument name="targetIndex" value="1"/>
55+
</actionGroup>
56+
<!-- Slide Item 1: Mobile Empty Min Height -->
57+
<actionGroup ref="openPageBuilderEditPanelSmallByIndex" stepKey="openEditPanel2">
58+
<argument name="section" value="SlideOnBackend"/>
59+
<argument name="targetIndex" value="1"/>
60+
</actionGroup>
61+
62+
<!-- Slide Item 2: Desktop Min Height = 500px -->
63+
<actionGroup ref="openPageBuilderEditPanelSmallByIndex" stepKey="openEditPanel3">
64+
<argument name="section" value="SlideOnBackend"/>
65+
<argument name="targetIndex" value="2"/>
66+
</actionGroup>
67+
<!-- Slide Item 2: Mobile Min Height = 100vh - 200px -->
68+
<actionGroup ref="openPageBuilderEditPanelSmallByIndex" stepKey="openEditPanel4">
69+
<argument name="section" value="SlideOnBackend"/>
70+
<argument name="targetIndex" value="2"/>
71+
</actionGroup>
72+
73+
<!-- Slide Item 3: Desktop Empty Min Height -->
74+
<actionGroup ref="openPageBuilderEditPanelSmallByIndex" stepKey="openEditPanel5">
75+
<argument name="section" value="SlideOnBackend"/>
76+
<argument name="targetIndex" value="3"/>
77+
</actionGroup>
78+
<!-- Slide Item 3: Mobile Min Height = 200px -->
79+
<actionGroup ref="openPageBuilderEditPanelSmallByIndex" stepKey="openEditPanel6">
80+
<argument name="section" value="SlideOnBackend"/>
81+
<argument name="targetIndex" value="3"/>
82+
</actionGroup>
83+
84+
<!-- Validate CMS Block Stage Desktop Viewport -->
85+
<actionGroup ref="ValidateContentTypesStyleEqualsExpectedStyleActionGroup" stepKey="seeFirstMinHeightCMSBlockStageDesktop">
86+
<argument name="selector" value="{{SlideOnBackend.wrapper('1')}}"/>
87+
<argument name="expectedProperty" value="{{PageBuilderMinHeightProperty_500px.intValue}}"/>
88+
<argument name="cssProperty" value="minHeight"/>
89+
</actionGroup>
90+
<executeJS function="return document.querySelectorAll('{{SlideOnBackend.wrapperCSS}}')[0].getBoundingClientRect().height" stepKey="firstMinHeightCMSBlockStageDesktop"/>
91+
92+
<actionGroup ref="ValidateContentTypesStyleEqualsExpectedStyleActionGroup" stepKey="seeSecondMinHeightCMSBlockStageDesktop">
93+
<argument name="selector" value="{{SlideOnBackend.wrapper('2')}}"/>
94+
<argument name="expectedProperty" value="{{PageBuilderMinHeightProperty_500px.intValue}}"/>
95+
<argument name="cssProperty" value="minHeight"/>
96+
</actionGroup>
97+
<executeJS function="return document.querySelectorAll('{{SlideOnBackend.wrapperCSS}}')[1].getBoundingClientRect().height" stepKey="secondMinHeightCMSBlockStageDesktop"/>
98+
99+
<actionGroup ref="ValidateContentTypesStyleEqualsExpectedStyleActionGroup" stepKey="seeThirdMinHeightCMSBlockStageDesktop">
100+
<argument name="selector" value="{{SliderOnStage.advancedConfigurationPath('3')}}"/>
101+
<argument name="expectedProperty" value="{{PageBuilderMinHeightProperty_300.value}}"/>
102+
<argument name="cssProperty" value="minHeight"/>
103+
</actionGroup>
104+
<executeJS function="return document.querySelectorAll('{{SlideOnBackend.wrapperCSS}}')[1].getBoundingClientRect().height" stepKey="thirdMinHeightCMSBlockStageDesktop"/>
105+
106+
<!-- Validate CMS Block Stage Mobile Viewport -->
107+
<actionGroup ref="ValidateContentTypesStyleEqualsExpectedStyleActionGroup" stepKey="seeFirstMinHeightCMSBlockStageMobile">
108+
<argument name="selector" value="{{SlideOnBackend.wrapper('1')}}"/>
109+
<argument name="expectedProperty" value="{{PageBuilderMinHeightProperty_500px.intValue}}"/>
110+
<argument name="cssProperty" value="minHeight"/>
111+
</actionGroup>
112+
<executeJS function="return document.querySelectorAll('{{SlideOnBackend.wrapperCSS}}')[0].getBoundingClientRect().height" stepKey="firstMinHeightCMSBlockStageMobile"/>
113+
114+
<executeJS function="return document.querySelectorAll('{{SlideOnBackend.wrapperCSS}}')[0].getBoundingClientRect().height" stepKey="secondMinHeightCMSBlockStageMobile"/>
115+
<actionGroup ref="ValidateContentTypesStyleEqualsExpectedStyleActionGroup" stepKey="seeSecondMinHeightCMSBlockStageMobile">
116+
<argument name="selector" value="{{SlideOnBackend.wrapper('2')}}"/>
117+
<argument name="expectedProperty" value="$expectedSecondHeightCMSBlockStageMobile"/>
118+
<argument name="cssProperty" value="minHeight"/>
119+
</actionGroup>
120+
121+
<actionGroup ref="ValidateContentTypesStyleEqualsExpectedStyleActionGroup" stepKey="seeThirdMinHeightCMSBlockStageMobile">
122+
<argument name="selector" value="{{SlideOnBackend.wrapper('3')}}"/>
123+
<argument name="expectedProperty" value="{{PageBuilderMinHeightProperty_200px.intValue}}"/>
124+
<argument name="cssProperty" value="minHeight"/>
125+
</actionGroup>
126+
<executeJS function="return document.querySelectorAll('{{SlideOnBackend.wrapperCSS}}')[2].getBoundingClientRect().height" stepKey="thirdMinHeightCMSBlockStageMobile"/>
127+
128+
<!-- Validate CMS Page Stage Desktop Viewport -->
129+
<actionGroup ref="ValidateContentTypesStyleEqualsExpectedStyleActionGroup" stepKey="seeFirstMinHeightCMSPageStageDesktop">
130+
<argument name="selector" value="{{SlideOnFrontend.wrapper('1')}}"/>
131+
<argument name="expectedProperty" value="{{PageBuilderMinHeightProperty_500px.intValue}}"/>
132+
<argument name="cssProperty" value="minHeight"/>
133+
</actionGroup>
134+
<executeJS function="return document.querySelectorAll('{{SlideOnFrontend.wrapperCSS}}')[0].getBoundingClientRect().height" stepKey="firstMinHeightCMSPageStageDesktop"/>
135+
136+
<actionGroup ref="ValidateContentTypesStyleEqualsExpectedStyleActionGroup" stepKey="seeSecondMinHeightCMSPageStageDesktop">
137+
<argument name="selector" value="{{SlideOnFrontend.wrapper('2')}}"/>
138+
<argument name="expectedProperty" value="{{PageBuilderMinHeightProperty_500px.intValue}}"/>
139+
<argument name="cssProperty" value="minHeight"/>
140+
</actionGroup>
141+
<executeJS function="return document.querySelectorAll('{{SlideOnFrontend.wrapperCSS}}')[1].getBoundingClientRect().height" stepKey="secondMinHeightCMSPageStageDesktop"/>
142+
143+
<actionGroup ref="ValidateContentTypesStyleEqualsExpectedStyleActionGroup" stepKey="seeThirdMinHeightCMSPageStageDesktop">
144+
<argument name="selector" value="{{SlideOnFrontend.wrapper('3')}}"/>
145+
<argument name="expectedProperty" value="{{PageBuilderMinHeightProperty_300px.intValue}}"/>
146+
<argument name="cssProperty" value="minHeight"/>
147+
</actionGroup>
148+
<executeJS function="return document.querySelectorAll('{{SlideOnFrontend.wrapperCSS}}')[2].getBoundingClientRect().height" stepKey="thirdMinHeightCMSPageStageDesktop"/>
149+
<assertEquals stepKey="assertThirdMinHeightCMSPageStageDesktop">
150+
<actualResult type="variable">thirdMinHeightCMSPageStageDesktop</actualResult>
151+
<expectedResult type="string">{{PageBuilderMinHeightProperty_300px.intValue}}</expectedResult>
152+
</assertEquals>
153+
154+
<!-- Validate CMS Page Stage Mobile Viewport -->
155+
<actionGroup ref="ValidateContentTypesStyleEqualsExpectedStyleActionGroup" stepKey="seeFirstMinHeightCMSPageStageMobile">
156+
<argument name="selector" value="{{SlideOnFrontend.wrapper('1')}}"/>
157+
<argument name="expectedProperty" value="{{PageBuilderMinHeightProperty_500px.intValue}}"/>
158+
<argument name="cssProperty" value="minHeight"/>
159+
</actionGroup>
160+
<executeJS function="return document.querySelectorAll('{{SlideOnFrontend.wrapperCSS}}')[0].getBoundingClientRect().height" stepKey="firstMinHeightCMSPageStageMobile"/>
161+
162+
<executeJS function="return document.querySelectorAll('{{SlideOnFrontend.wrapperCSS}}')[1].getBoundingClientRect().height" stepKey="secondMinHeightCMSPageStageMobile"/>
163+
<actionGroup ref="ValidateContentTypesStyleEqualsExpectedStyleActionGroup" stepKey="seeSecondMinHeightCMSPageStageMobile">
164+
<argument name="selector" value="{{SlideOnFrontend.wrapper('2')}}"/>
165+
<argument name="expectedProperty" value="$expectedSecondHeightCMSPageStageMobile"/>
166+
<argument name="cssProperty" value="minHeight"/>
167+
</actionGroup>
168+
169+
<actionGroup ref="ValidateContentTypesStyleEqualsExpectedStyleActionGroup" stepKey="seeThirdMinHeightCMSPageStageMobile">
170+
<argument name="selector" value="{{SlideOnFrontend.wrapper('3')}}"/>
171+
<argument name="expectedProperty" value="{{PageBuilderMinHeightProperty_200px.intValue}}"/>
172+
<argument name="cssProperty" value="minHeight"/>
173+
</actionGroup>
174+
<executeJS function="return document.querySelectorAll('{{SlideOnFrontend.wrapperCSS}}')[2].getBoundingClientRect().height" stepKey="thirdMinHeightCMSPageStageMobile"/>
175+
176+
<!-- Validate Storefront Desktop -->
177+
<actionGroup ref="ValidateContentTypesStyleEqualsExpectedStyleActionGroup" stepKey="seeFirstMinHeightStorefront">
178+
<argument name="selector" value="{{SlideOnFrontend.wrapper('1')}}"/>
179+
<argument name="expectedProperty" value="{{PageBuilderMinHeightProperty_500px.intValue}}"/>
180+
<argument name="cssProperty" value="minHeight"/>
181+
</actionGroup>
182+
<executeJS function="return document.querySelectorAll('{{SlideOnFrontend.wrapperCSS}}')[0].getBoundingClientRect().height" stepKey="firstMinHeightStorefront"/>
183+
184+
<actionGroup ref="ValidateContentTypesStyleEqualsExpectedStyleActionGroup" stepKey="seeSecondMinHeightStorefront">
185+
<argument name="selector" value="{{SlideOnFrontend.wrapper('2')}}"/>
186+
<argument name="expectedProperty" value="{{PageBuilderMinHeightProperty_500px.intValue}}"/>
187+
<argument name="cssProperty" value="minHeight"/>
188+
</actionGroup>
189+
<executeJS function="return document.querySelectorAll('{{SlideOnFrontend.wrapperCSS}}')[1].getBoundingClientRect().height" stepKey="secondMinHeightStorefront"/>
190+
191+
<actionGroup ref="ValidateContentTypesStyleEqualsExpectedStyleActionGroup" stepKey="seeThirdMinHeightStorefront">
192+
<argument name="selector" value="{{SlideOnFrontend.wrapper('3')}}"/>
193+
<argument name="expectedProperty" value="{{PageBuilderMinHeightProperty_300px.intValue}}"/>
194+
<argument name="cssProperty" value="minHeight"/>
195+
</actionGroup>
196+
<executeJS function="return document.querySelectorAll('{{SlideOnFrontend.wrapperCSS}}')[2].getBoundingClientRect().height" stepKey="thirdMinHeightStorefront"/>
197+
<assertEquals stepKey="assertThirdMinHeightStorefront">
198+
<actualResult type="variable">thirdMinHeightCMSPageStageDesktop</actualResult>
199+
<expectedResult type="string">{{PageBuilderMinHeightProperty_300px.intValue}}</expectedResult>
200+
</assertEquals>
201+
202+
<!-- Validate Storefront Mobile -->
203+
<actionGroup ref="ValidateContentTypesStyleEqualsExpectedStyleActionGroup" stepKey="seeFirstMinHeightStorefrontMobile">
204+
<argument name="selector" value="{{SlideOnFrontend.wrapper('1')}}"/>
205+
<argument name="expectedProperty" value="{{PageBuilderMinHeightProperty_500px.intValue}}"/>
206+
<argument name="cssProperty" value="minHeight"/>
207+
</actionGroup>
208+
<executeJS function="return document.querySelectorAll('{{SlideOnFrontend.wrapperCSS}}')[0].getBoundingClientRect().height" stepKey="firstMinHeightStorefrontMobile"/>
209+
210+
<executeJS function="return document.querySelectorAll('{{SlideOnFrontend.wrapperCSS}}')[1].getBoundingClientRect().height" stepKey="secondMinHeightStorefrontMobile"/>
211+
<actionGroup ref="ValidateContentTypesStyleEqualsExpectedStyleActionGroup" stepKey="seeSecondMinHeightStorefrontMobile">
212+
<argument name="selector" value="{{SlideOnFrontend.wrapper('2')}}"/>
213+
<argument name="expectedProperty" value="$expectedSecondHeightStorefrontMobile"/>
214+
<argument name="cssProperty" value="minHeight"/>
215+
</actionGroup>
216+
217+
<actionGroup ref="ValidateContentTypesStyleEqualsExpectedStyleActionGroup" stepKey="seeThirdMinHeightStorefrontMobile">
218+
<argument name="selector" value="{{SlideOnFrontend.wrapper('3')}}"/>
219+
<argument name="expectedProperty" value="{{PageBuilderMinHeightProperty_200px.intValue}}"/>
220+
<argument name="cssProperty" value="minHeight"/>
221+
</actionGroup>
222+
<executeJS function="return document.querySelectorAll('{{SlideOnFrontend.wrapperCSS}}')[2].getBoundingClientRect().height" stepKey="thirdMinHeightStorefrontMobile"/>
223+
</test>
224+
</tests>

app/code/Magento/PageBuilder/Test/Mftf/Test/ViewportSwitcherMobile/ViewportSwitcherMobileSliderMinHeightTest.xml

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@
3333
<argument name="contentType" value="PageBuilderSliderContentType"/>
3434
<argument name="index" value="1"/>
3535
</actionGroup>
36-
<actionGroup ref="fillSlideOutPanelFieldGeneral" stepKey="removeBannerDefaultMinHeight" before="enterPadding">
36+
<actionGroup ref="fillSlideOutPanelFieldGeneral" stepKey="removeSliderDefaultMinHeight" before="enterPadding">
3737
<argument name="property" value="PageBuilderMinHeightProperty_Empty"/>
3838
</actionGroup>
3939

@@ -145,7 +145,7 @@
145145

146146
<actionGroup ref="ValidateContentTypesStyleEqualsExpectedStyleActionGroup" stepKey="seeThirdMinHeightCMSPageStageDesktop">
147147
<argument name="selector" value="{{SliderOnFrontend.advancedConfigurationPath('3')}}"/>
148-
<argument name="expectedProperty" value="auto"/>
148+
<argument name="expectedProperty" value="{{PageBuilderMinHeightProperty_Auto.value}}"/>
149149
<argument name="cssProperty" value="minHeight"/>
150150
</actionGroup>
151151
<executeJS function="return document.querySelectorAll('{{SliderOnFrontend.all}}')[2].getBoundingClientRect().height" stepKey="thirdMinHeightCMSPageStageDesktop"/>
@@ -197,7 +197,7 @@
197197

198198
<actionGroup ref="ValidateContentTypesStyleEqualsExpectedStyleActionGroup" stepKey="seeThirdMinHeightStorefront">
199199
<argument name="selector" value="{{SliderOnFrontend.advancedConfigurationPath('3')}}"/>
200-
<argument name="expectedProperty" value="auto"/>
200+
<argument name="expectedProperty" value="{{PageBuilderMinHeightProperty_Auto.value}}"/>
201201
<argument name="cssProperty" value="minHeight"/>
202202
</actionGroup>
203203
<executeJS function="return document.querySelectorAll('{{SliderOnFrontend.all}}')[2].getBoundingClientRect().height" stepKey="thirdMinHeightStorefront"/>

0 commit comments

Comments
 (0)