Skip to content

Commit 46f9d26

Browse files
cspruiellcspruiell
committed
PB-370: Introduce upgrade mechanism for Page Builder content
 - functional tests
1 parent 62a9a46 commit 46f9d26

10 files changed

+745
-7
lines changed

‎app/code/Magento/PageBuilder/Test/Mftf/ActionGroup/BackgroundConfigurationActionGroup.xml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -328,7 +328,7 @@
328328
<actualResult type="variable">$fallbackImageStyle</actualResult>
329329
</assertContains>
330330
</actionGroup>
331-
<actionGroup name="validateEmptyRowWithInvalidVideoBackgroundAndNoFallbackImage">
331+
<actionGroup name="validateInvalidVideoBackgroundAndNoFallbackImage">
332332
<annotations>
333333
<description>Validates that the Row renders as an empty row when the video in video background fails to load and there is no fallback image.</description>
334334
</annotations>

‎app/code/Magento/PageBuilder/Test/Mftf/Data/BackgroundFormData.xml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -580,7 +580,7 @@
580580
<data key="section">background</data>
581581
<data key="fieldName">video_fallback_image</data>
582582
<data key="value"/>
583-
<data key="helperText">Maximum file size: 2 MB. Allowed file types: JPG, GIF, PNG.</data>
583+
<data key="helperText">Maximum file size: 4 MB. Allowed file types: JPG, GIF, PNG.</data>
584584
<data key="tooltipText">Fallback images appear on the screen before a video loads. When the video loads, it replaces the fallback image. If the video does not load for some reason, the fallback image remains on the screen in place of the video.</data>
585585
</entity>
586586
<entity name="PageBuilderVideoBackgroundFallbackImage_JPG" type="pagebuilder_video_background_fallback_image">

‎app/code/Magento/PageBuilder/Test/Mftf/Data/BannerData.xml

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -89,6 +89,19 @@
8989
<data key="fieldName">background_color</data>
9090
<data key="stageValue">rgb(250, 250, 250)</data>
9191
</entity>
92+
<!-- Background Type -->
93+
<entity name="PageBuilderBannerBackgroundType_Image" type="pagebuilder_banner_background_type_property">
94+
<data key="name">Background Type</data>
95+
<data key="section">background</data>
96+
<data key="fieldName">background_type</data>
97+
<data key="value">image</data>
98+
</entity>
99+
<entity name="PageBuilderBannerBackgroundType_Video" type="pagebuilder_banner_background_type_property">
100+
<data key="name">Background Type</data>
101+
<data key="section">background</data>
102+
<data key="fieldName">background_type</data>
103+
<data key="value">video</data>
104+
</entity>
92105
<!-- Link -->
93106
<entity name="PageBuilderBannerLinkUrlProperty" type="pagebuilder_banner_linkUrl_property">
94107
<data key="name">Link</data>

‎app/code/Magento/PageBuilder/Test/Mftf/Section/PageBuilderBannerSection.xml

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -26,11 +26,13 @@
2626
<element name="posterMinimumHeight" type="text" selector="(//div[@data-content-type='banner'])[{{arg1}}]//div[@data-element='overlay'][contains(@style,'min-height: {{arg2}}px;')]" parameterized="true"/>
2727
<element name="collageMinimumHeight" type="text" selector="(//div[@data-content-type='banner'])[{{arg1}}]//div[@data-element='wrapper'][contains(@style,'min-height: {{arg2}}px;')]" parameterized="true"/>
2828
<!-- Background Configuration -->
29+
<element name="backgroundType" type="text" selector="(//div[@data-content-type='banner'])[{{index}}]//div[@data-background-type='{{backgroundType}}']" parameterized="true"/>
2930
<element name="backgroundPosition" type="button" selector="(//div[@data-content-type='banner'])[{{arg1}}]//div[@data-element='wrapper'][contains(@style,'background-position: {{arg2}};')]" parameterized="true"/>
3031
<element name="backgroundSize" type="button" selector="(//div[@data-content-type='banner'])[{{arg1}}]//div[@data-element='wrapper'][contains(@style,'background-size: {{arg2}};')]" parameterized="true"/>
3132
<element name="backgroundRepeat" type="button" selector="(//div[@data-content-type='banner'])[{{arg1}}]//div[@data-element='wrapper'][contains(@style,'background-repeat: {{arg2}};')]" parameterized="true"/>
3233
<element name="backgroundAttachment" type="button" selector="(//div[@data-content-type='banner'])[{{arg1}}]//div[@data-element='wrapper'][contains(@style,'background-attachment: {{arg2}};')]" parameterized="true"/>
3334
<element name="backgroundColor" type="button" selector="(//div[@data-content-type='banner'])[{{arg1}}]//div[@data-element='wrapper'][contains(@style,'background-color: {{arg2}};')]" parameterized="true"/>
35+
<element name="backgroundColorElement" type="button" selector="(//div[@data-content-type='banner'])[{{arg1}}]//div[@data-element='wrapper'][contains(@style,'background-color:')]" parameterized="true"/>
3436
<element name="noBackgroundColor" type="button" selector="(//div[@data-content-type='banner'])[{{arg1}}]//div[@data-element='wrapper'][not(contains(@style,'background-color:'))]" parameterized="true"/>
3537
<element name="backgroundImage" type="button" selector="(//div[@data-content-type='banner'])[{{arg1}}]//div[@data-element='wrapper'][contains(@style,'background-image: url(') and contains(@style,'{{arg2}}')]" parameterized="true"/>
3638
<element name="noBackgroundImage" type="button" selector="(//div[@data-content-type='banner'])[{{arg1}}]//div[@data-element='wrapper'][not(contains(@style,'background-image:'))]" parameterized="true"/>
@@ -52,6 +54,17 @@
5254
<element name="showOverlay" type="text" selector="(//div[@data-content-type='banner'])[{{arg1}}][@data-show-overlay='{{arg2}}']" parameterized="true"/>
5355
<element name="overlayBackgroundColor" type="text" selector="(//div[@data-content-type='banner'])[{{arg1}}]//div[@data-element='wrapper']//div[@data-element='overlay'][contains(@style,'background-color: {{arg2}};')]" parameterized="true"/>
5456
<element name="transparentOverlay" type="text" selector="(//div[@data-content-type='banner'])[{{arg1}}]//div[@data-element='wrapper']//div[@data-element='overlay'][contains(@style,'background-color: transparent;')]" parameterized="true"/>
57+
<!-- Video Background -->
58+
<element name="videoBackgroundJarallaxContainer" type="text" selector="(//div[@data-content-type='banner'])[{{index}}]//div[contains(@id,'jarallax-container')]" parameterized="true"/>
59+
<element name="videoBackgroundVideoElement" type="text" selector="(//div[@data-content-type='banner'])[{{index}}]//div[contains(@id,'jarallax-container')]//iframe|(//div[@data-content-type='banner'])[{{index}}]//div[contains(@id,'jarallax-container')]//video" parameterized="true"/>
60+
<element name="videoBackgroundVideoUrl" type="text" selector="(//div[@data-content-type='banner'])[{{index}}]//div[contains(@id,'jarallax-container')]//*[contains(@src,'{{videoURL}}')]" parameterized="true"/>
61+
<element name="videoBackgroundOverlayElement" type="text" selector="(//div[@data-content-type='banner'])[{{index}}]//div[@data-element='video_overlay']" parameterized="true"/>
62+
<element name="videoBackgroundInfiniteLoop" type="text" selector="(//div[@data-content-type='banner'])[{{index}}]//div[@data-element='wrapper' and @data-video-loop='{{infiniteLoopValue}}']" parameterized="true"/>
63+
<element name="videoBackgroundLazyLoad" type="text" selector="(//div[@data-content-type='banner'])[{{index}}]//div[@data-element='wrapper' and @data-video-lazy-load='{{lazyLoadValue}}']" parameterized="true"/>
64+
<element name="videoBackgroundPlayOnlyVisible" type="text" selector="(//div[@data-content-type='banner'])[{{index}}]//div[@data-element='wrapper' and @data-video-play-only-visible='{{playOnlyVisibleValue}}']" parameterized="true"/>
65+
<element name="videoBackgroundFallbackImage" type="text" selector="(//div[@data-content-type='banner'])[{{index}}]//div[contains(@id,'jarallax-container')]//img" parameterized="true"/>
66+
<element name="videoBackgroundFallbackImageSource" type="text" selector="(//div[@data-content-type='banner'])[{{index}}]//div[contains(@id,'jarallax-container')]//img[contains(@src,'{{fileName}}')]" parameterized="true"/>
67+
<element name="videoBackgroundNoFallbackImage" type="text" selector="(//div[@data-content-type='banner'])[{{index}}]//div[contains(@id,'jarallax-container')]//div" parameterized="true"/>
5568
<!-- Advanced Configuration -->
5669
<element name="alignment" type="text" selector="(//div[@data-content-type='banner'])[{{arg1}}]//div[@data-element='wrapper'][contains(@style,'text-align: {{arg2}};')]" parameterized="true"/>
5770
<element name="noAlignment" type="text" selector="(//div[@data-content-type='banner'])[{{arg1}}]//div[@data-element='wrapper'][not(contains(@style,'text-align:'))]" parameterized="true"/>
@@ -94,11 +107,13 @@
94107
<element name="posterMinimumHeight" type="text" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{arg1}}]//div[@data-element='overlay'][contains(@style,'min-height: {{arg2}}px;')]" parameterized="true"/>
95108
<element name="collageMinimumHeight" type="text" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{arg1}}]//div[@data-element='wrapper'][contains(@style,'min-height: {{arg2}}px;')]" parameterized="true"/>
96109
<!-- Background Configuration -->
110+
<element name="backgroundType" type="text" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{index}}]//div[@data-element='wrapper'][@data-background-type='{{backgroundType}}']" parameterized="true"/>
97111
<element name="backgroundPosition" type="button" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{arg1}}]//div[@data-element='wrapper'][contains(@style,'background-position: {{arg2}};')]" parameterized="true"/>
98112
<element name="backgroundSize" type="button" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{arg1}}]//div[@data-element='wrapper'][contains(@style,'background-size: {{arg2}};')]" parameterized="true"/>
99113
<element name="backgroundRepeat" type="button" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{arg1}}]//div[@data-element='wrapper'][contains(@style,'background-repeat: {{arg2}};')]" parameterized="true"/>
100114
<element name="backgroundAttachment" type="button" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{arg1}}]//div[@data-element='wrapper'][contains(@style,'background-attachment: {{arg2}};')]" parameterized="true"/>
101115
<element name="backgroundColor" type="button" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{arg1}}]//div[@data-element='wrapper'][contains(@style,'background-color: {{arg2}};')]" parameterized="true"/>
116+
<element name="backgroundColorElement" type="button" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{arg1}}]//div[@data-element='wrapper'][contains(@style,'background-color:')]" parameterized="true"/>
102117
<element name="noBackgroundColor" type="button" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{arg1}}]//div[@data-element='wrapper'][not(contains(@style,'background-color:'))]" parameterized="true"/>
103118
<element name="backgroundImage" type="button" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{arg1}}]//div[@data-element='wrapper'][contains(@style,'background-image: url(') and contains(@style,'{{arg2}}')]" parameterized="true"/>
104119
<element name="noBackgroundImage" type="button" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{arg1}}]//div[@data-element='wrapper'][not(contains(@style,'background-image:'))]" parameterized="true"/>
@@ -116,6 +131,17 @@
116131
<element name="overlayBackgroundColor" type="button" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{arg1}}]//div[@data-element='overlay'][contains(@style,'background-color: {{arg2}};')]" parameterized="true"/>
117132
<element name="transparentOverlay" type="button" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{arg1}}]//div[@data-element='overlay'][contains(@style,'background-color: transparent;')]" parameterized="true"/>
118133
<element name="inlineWYSIWYGEditorWithTag" type="text" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{arg1}}]//div[contains(@class,'inline-wysiwyg')]//{{arg2}}" parameterized="true"/>
134+
<!-- Video Background -->
135+
<element name="videoBackgroundJarallaxContainer" type="text" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{index}}]//div[@data-element='wrapper']//div[contains(@id,'jarallax-container')]" parameterized="true"/>
136+
<element name="videoBackgroundVideoElement" type="text" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{index}}]//div[@data-element='wrapper']//div[contains(@id,'jarallax-container')]//iframe|(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{index}}]//div[@data-element='wrapper']//div[contains(@id,'jarallax-container')]//video" parameterized="true"/>
137+
<element name="videoBackgroundVideoUrl" type="text" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{index}}]//div[@data-element='wrapper']//div[contains(@id,'jarallax-container')]//*[contains(@src,'{{videoURL}}')]" parameterized="true"/>
138+
<element name="videoBackgroundOverlayElement" type="text" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{index}}]//div[@data-element='wrapper']//div[@data-element='video_overlay']" parameterized="true"/>
139+
<element name="videoBackgroundInfiniteLoop" type="text" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{index}}]//div[@data-element='wrapper'][@data-video-loop='{{infiniteLoopValue}}']" parameterized="true"/>
140+
<element name="videoBackgroundLazyLoad" type="text" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{index}}]//div[@data-element='wrapper'][@data-video-lazy-load='{{lazyLoadValue}}']" parameterized="true"/>
141+
<element name="videoBackgroundPlayOnlyVisible" type="text" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{index}}]//div[@data-element='wrapper'][@data-video-play-only-visible='{{playOnlyVisibleValue}}']" parameterized="true"/>
142+
<element name="videoBackgroundFallbackImage" type="text" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{index}}]//div[@data-element='wrapper']//div[contains(@id,'jarallax-container')]//img" parameterized="true"/>
143+
<element name="videoBackgroundFallbackImageSource" type="text" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{index}}]//div[@data-element='wrapper']//div[contains(@id,'jarallax-container')]//img[contains(@src,'{{fileName}}')]" parameterized="true"/>
144+
<element name="videoBackgroundNoFallbackImage" type="text" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{index}}]//div[@data-element='wrapper']//div[contains(@id,'jarallax-container')]//div" parameterized="true"/>
119145
<!-- Advanced Configuration -->
120146
<element name="alignment" type="text" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{arg1}}]//div[@data-element='wrapper'][contains(@style,'text-align: {{arg2}};')]" parameterized="true"/>
121147
<element name="noAlignment" type="text" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{arg1}}]//div[@data-element='wrapper'][not(contains(@style,'text-align:'))]" parameterized="true"/>

‎app/code/Magento/PageBuilder/Test/Mftf/Test/AdminPageBuilderBannerCollageCenterAppearanceTest.xml

Lines changed: 60 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1387,4 +1387,64 @@
13871387
<executeJS function="return Math.abs(Math.round({$overlayRightPositionAfterSave}-{$buttonRightPositionAfterSave}-30))" stepKey="overlayMinusButtonMinusPaddingAfterSave"/>
13881388
<executeJS function="return Math.abs(Math.round({$overlayRightPositionStoreFront}-{$buttonRightPositionStoreFront}-30))" stepKey="overlayMinusButtonMinusPaddingStoreFront"/>
13891389
</test>
1390+
<test name="BannerCollageCenterValidateVideoBackground" extends="BannerPosterValidateVideoBackground">
1391+
<annotations>
1392+
<features value="PageBuilder"/>
1393+
<stories value="Banner"/>
1394+
<title value="Validate Video Background in Banner with Collage Center Appearance"/>
1395+
<description value="Set all video background attributes for a banner with collage center appearance and validate on stage and storefront."/>
1396+
<severity value="CRITICAL"/>
1397+
<useCaseId value="PB-265"/>
1398+
<testCaseId value="MC-31621"/>
1399+
<group value="pagebuilder"/>
1400+
<group value="pagebuilder-banner"/>
1401+
<group value="pagebuilder-bannerCollageCenter"/>
1402+
<group value="pagebuilder-backgroundForm"/>
1403+
<group value="pagebuilder-video-background"/>
1404+
</annotations>
1405+
<!-- Fill Out Banner Edit Panel -->
1406+
<actionGroup ref="chooseVisualSelectOption" stepKey="enterAppearanceProperty">
1407+
<argument name="property" value="PageBuilderAppearance_CollageCentered"/>
1408+
</actionGroup>
1409+
</test>
1410+
<test name="BannerCollageCenterValidateVideoBackgroundFallbackImage" extends="BannerPosterValidateVideoBackgroundFallbackImage">
1411+
<annotations>
1412+
<features value="PageBuilder"/>
1413+
<stories value="Banner"/>
1414+
<title value="Validate Video Background Fallback Image Renders When Video Isn't Loaded in Banner with Collage Center Appearance"/>
1415+
<description value="Set video background fallback image for a banner with collage center appearance and validate on stage and storefront."/>
1416+
<severity value="CRITICAL"/>
1417+
<useCaseId value="PB-265"/>
1418+
<testCaseId value="MC-31629"/>
1419+
<group value="pagebuilder"/>
1420+
<group value="pagebuilder-banner"/>
1421+
<group value="pagebuilder-bannerCollageCenter"/>
1422+
<group value="pagebuilder-backgroundForm"/>
1423+
<group value="pagebuilder-video-background"/>
1424+
</annotations>
1425+
<!-- Fill Out Banner Edit Panel -->
1426+
<actionGroup ref="chooseVisualSelectOption" stepKey="enterAppearanceProperty">
1427+
<argument name="property" value="PageBuilderAppearance_CollageCentered"/>
1428+
</actionGroup>
1429+
</test>
1430+
<test name="BannerCollageCenterValidateVideoBackgroundNoFallbackImage" extends="BannerPosterValidateVideoBackgroundNoFallbackImage">
1431+
<annotations>
1432+
<features value="PageBuilder"/>
1433+
<stories value="Banner"/>
1434+
<title value="Validate Banner with Collage Center Appearance Renders When Video Isn't Loaded and There's No Fallback Image "/>
1435+
<description value="Validate that a banner with collage center appearance renders correctly when the video background video hasn't loaded and there is no fallback image."/>
1436+
<severity value="CRITICAL"/>
1437+
<useCaseId value="PB-265"/>
1438+
<testCaseId value="MC-31635"/>
1439+
<group value="pagebuilder"/>
1440+
<group value="pagebuilder-banner"/>
1441+
<group value="pagebuilder-bannerCollageCenter"/>
1442+
<group value="pagebuilder-backgroundForm"/>
1443+
<group value="pagebuilder-video-background"/>
1444+
</annotations>
1445+
<!-- Fill Out Banner Edit Panel -->
1446+
<actionGroup ref="chooseVisualSelectOption" stepKey="enterAppearanceProperty">
1447+
<argument name="property" value="PageBuilderAppearance_CollageCentered"/>
1448+
</actionGroup>
1449+
</test>
13901450
</tests>

0 commit comments

Comments
 (0)