Skip to content

Commit 381d1e3

Browse files
author
joiecaquicla
committed
magento2/magento2-page-builder#637: Form field/field group viewport scope - added ViewportSwitcherMobileSliderMinHeightTest
1 parent 49ee873 commit 381d1e3

File tree

1 file changed

+235
-0
lines changed

1 file changed

+235
-0
lines changed

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

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

0 commit comments

Comments
 (0)