Skip to content

[Owls] Video background for banner #394

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 25 commits into from
Mar 3, 2020
Merged

[Owls] Video background for banner #394

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
25 commits
Select commit Hold shift + click to select a range
4355811
PB-265: Video background for Banner
cspruiell Feb 13, 2020
62a9a46
Merge remote-tracking branch 'origin/develop' into PB-265-video-backg…
cspruiell Feb 18, 2020
46f9d26
PB-370: Introduce upgrade mechanism for Page Builder content
cspruiell Feb 18, 2020
75a8b38
PB-265: Video background for Banner
cspruiell Feb 19, 2020
50ad98c
PB-265: Video background for Banner
cspruiell Feb 19, 2020
bfcbf42
Merge remote-tracking branch 'origin/develop' into PB-265-video-backg…
cspruiell Feb 19, 2020
1f1a258
Merge remote-tracking branch 'origin/develop' into PB-265-video-backg…
cspruiell Feb 20, 2020
c70a4a4
PB-265: Video background for Banner
cspruiell Feb 20, 2020
ca7ca38
PB-265: Video background for Banner
cspruiell Feb 20, 2020
3223f3b
PB-370: Introduce upgrade mechanism for Page Builder content
cspruiell Feb 20, 2020
011c9e5
Merge remote-tracking branch 'origin/develop' into PB-265-video-backg…
cspruiell Feb 25, 2020
51a426e
PB-265: Video background for Banner
cspruiell Feb 25, 2020
f047afc
PB-265: Video background for Banner
omiroshnichenko Feb 25, 2020
f331b38
PB-265: Video background for Banner
omiroshnichenko Feb 25, 2020
718c6c4
Merge branch 'develop' into PB-265-video-background-for-banner
omiroshnichenko Feb 25, 2020
40359e9
PB-265: Video background for Banner
omiroshnichenko Feb 25, 2020
ca9d308
Merge branch 'PB-265-video-background-for-banner' of github.com:magen…
omiroshnichenko Feb 25, 2020
d0d50e1
PB-265: Video background for Banner
omiroshnichenko Feb 26, 2020
d6efc89
PB-265: Video background for Banner
omiroshnichenko Feb 27, 2020
57df0cb
Merge branch 'develop' into PB-265-video-background-for-banner
omiroshnichenko Feb 28, 2020
e2c30c6
PB-265: Video background for Banner
omiroshnichenko Feb 28, 2020
8739a69
PB-265: Video background for Banner
omiroshnichenko Feb 28, 2020
ad7a553
PB-265: Video background for Banner
omiroshnichenko Feb 28, 2020
787cacd
Merge branch 'develop' into PB-265-video-background-for-banner
omiroshnichenko Feb 29, 2020
3ff476c
PB-265: Video background for Banner
omiroshnichenko Mar 2, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions app/code/Magento/PageBuilder/Test/Mftf/ActionGroup/BackgroundConfigurationActionGroup.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -328,9 +328,9 @@
<actualResult type="variable">$fallbackImageStyle</actualResult>
</assertContains>
</actionGroup>
<actionGroup name="validateEmptyRowWithInvalidVideoBackgroundAndNoFallbackImage">
<actionGroup name="validateInvalidVideoBackgroundAndNoFallbackImage">
<annotations>
<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>
<description>Validates that nothing renders when the video in video background fails to load and there is no fallback image.</description>
</annotations>
<arguments>
<argument name="section" defaultValue="RowOnStage"/>
Expand Down
26 changes: 26 additions & 0 deletions app/code/Magento/PageBuilder/Test/Mftf/Section/PageBuilderBannerSection.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,11 +27,13 @@
<element name="posterMinimumHeight" type="text" selector="(//div[@data-content-type='banner'])[{{bannerIndex}}]//div[@data-element='overlay'][contains(@style,'min-height: {{minHeight}};')]" parameterized="true"/>
<element name="collageMinimumHeight" type="text" selector="(//div[@data-content-type='banner'])[{{bannerIndex}}]//div[@data-element='wrapper'][contains(@style,'min-height: {{minHeight}};')]" parameterized="true"/>
<!-- Background Configuration -->
<element name="backgroundType" type="text" selector="(//div[@data-content-type='banner'])[{{bannerIndex}}]//div[@data-background-type='{{backgroundType}}']" parameterized="true"/>
<element name="backgroundPosition" type="button" selector="(//div[@data-content-type='banner'])[{{bannerIndex}}]//div[@data-element='wrapper'][contains(@style,'background-position: {{backgroundPosition}};')]" parameterized="true"/>
<element name="backgroundSize" type="button" selector="(//div[@data-content-type='banner'])[{{bannerIndex}}]//div[@data-element='wrapper'][contains(@style,'background-size: {{backgroundSize}};')]" parameterized="true"/>
<element name="backgroundRepeat" type="button" selector="(//div[@data-content-type='banner'])[{{bannerIndex}}]//div[@data-element='wrapper'][contains(@style,'background-repeat: {{backgroundRepeat}};')]" parameterized="true"/>
<element name="backgroundAttachment" type="button" selector="(//div[@data-content-type='banner'])[{{bannerIndex}}]//div[@data-element='wrapper'][contains(@style,'background-attachment: {{backgroundAttachment}};')]" parameterized="true"/>
<element name="backgroundColor" type="button" selector="(//div[@data-content-type='banner'])[{{bannerIndex}}]//div[@data-element='wrapper'][contains(@style,'background-color: {{backgroundColor}};')]" parameterized="true"/>
<element name="backgroundColorElement" type="button" selector="(//div[@data-content-type='banner'])[{{bannerIndex}}]//div[@data-element='wrapper'][contains(@style,'background-color:')]" parameterized="true"/>
<element name="noBackgroundColor" type="button" selector="(//div[@data-content-type='banner'])[{{bannerIndex}}]//div[@data-element='wrapper'][not(contains(@style,'background-color:'))]" parameterized="true"/>
<element name="backgroundImage" type="button" selector="(//div[@data-content-type='banner'])[{{bannerIndex}}]//div[@data-element='wrapper'][contains(@style,'background-image: url(') and contains(@style,'{{backgroundImage}}')]" parameterized="true"/>
<element name="noBackgroundImage" type="button" selector="(//div[@data-content-type='banner'])[{{bannerIndex}}]//div[@data-element='wrapper'][not(contains(@style,'background-image:'))]" parameterized="true"/>
Expand All @@ -53,6 +55,17 @@
<element name="showOverlay" type="text" selector="(//div[@data-content-type='banner'])[{{bannerIndex}}][@data-show-overlay='{{showOverlay}}']" parameterized="true"/>
<element name="overlayBackgroundColor" type="text" selector="(//div[@data-content-type='banner'])[{{bannerIndex}}]//div[@data-element='wrapper']//div[@data-element='overlay'][contains(@style,'background-color: {{overlayBackgroundColor}};')]" parameterized="true"/>
<element name="transparentOverlay" type="text" selector="(//div[@data-content-type='banner'])[{{bannerIndex}}]//div[@data-element='wrapper']//div[@data-element='overlay'][contains(@style,'background-color: transparent;')]" parameterized="true"/>
<!-- Video Background -->
<element name="videoBackgroundJarallaxContainer" type="text" selector="(//div[@data-content-type='banner'])[{{bannerIndex}}]//div[contains(@id,'jarallax-container')]" parameterized="true"/>
<element name="videoBackgroundVideoElement" type="text" selector="(//div[@data-content-type='banner'])[{{bannerIndex}}]//div[contains(@id,'jarallax-container')]//iframe|(//div[@data-content-type='banner'])[{{bannerIndex}}]//div[contains(@id,'jarallax-container')]//video" parameterized="true"/>
<element name="videoBackgroundVideoUrl" type="text" selector="(//div[@data-content-type='banner'])[{{bannerIndex}}]//div[contains(@id,'jarallax-container')]//*[contains(@src,'{{videoURL}}')]" parameterized="true"/>
<element name="videoBackgroundOverlayElement" type="text" selector="(//div[@data-content-type='banner'])[{{bannerIndex}}]//div[@data-element='video_overlay']" parameterized="true"/>
<element name="videoBackgroundInfiniteLoop" type="text" selector="(//div[@data-content-type='banner'])[{{bannerIndex}}]//div[@data-element='wrapper' and @data-video-loop='{{infiniteLoopValue}}']" parameterized="true"/>
<element name="videoBackgroundLazyLoad" type="text" selector="(//div[@data-content-type='banner'])[{{bannerIndex}}]//div[@data-element='wrapper' and @data-video-lazy-load='{{lazyLoadValue}}']" parameterized="true"/>
<element name="videoBackgroundPlayOnlyWhenVisible" type="text" selector="(//div[@data-content-type='banner'])[{{bannerIndex}}]//div[@data-element='wrapper' and @data-video-play-only-visible='{{playOnlyVisibleValue}}']" parameterized="true"/>
<element name="videoBackgroundFallbackImage" type="text" selector="(//div[@data-content-type='banner'])[{{bannerIndex}}]//div[contains(@id,'jarallax-container')]//img" parameterized="true"/>
<element name="videoBackgroundFallbackImageSource" type="text" selector="(//div[@data-content-type='banner'])[{{bannerIndex}}]//div[contains(@id,'jarallax-container')]//img[contains(@src,'{{fileName}}')]" parameterized="true"/>
<element name="videoBackgroundNoFallbackImage" type="text" selector="(//div[@data-content-type='banner'])[{{bannerIndex}}]//div[contains(@id,'jarallax-container')]//div" parameterized="true"/>
<!-- Advanced Configuration -->
<element name="alignment" type="text" selector="(//div[@data-content-type='banner'])[{{bannerIndex}}]//div[@data-element='wrapper'][contains(@style,'text-align: {{alignment}};')]" parameterized="true"/>
<element name="noAlignment" type="text" selector="(//div[@data-content-type='banner'])[{{bannerIndex}}]//div[@data-element='wrapper'][not(contains(@style,'text-align:'))]" parameterized="true"/>
Expand Down Expand Up @@ -96,11 +109,13 @@
<element name="posterMinimumHeight" type="text" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{bannerIndex}}]//div[@data-element='overlay'][contains(@style,'min-height: {{minHeight}};')]" parameterized="true"/>
<element name="collageMinimumHeight" type="text" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{bannerIndex}}]//div[@data-element='wrapper'][contains(@style,'min-height: {{minHeight}};')]" parameterized="true"/>
<!-- Background Configuration -->
<element name="backgroundType" type="text" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{bannerIndex}}]//div[@data-element='wrapper'][@data-background-type='{{backgroundType}}']" parameterized="true"/>
<element name="backgroundPosition" type="button" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{bannerIndex}}]//div[@data-element='wrapper'][contains(@style,'background-position: {{backgroundPosition}};')]" parameterized="true"/>
<element name="backgroundSize" type="button" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{bannerIndex}}]//div[@data-element='wrapper'][contains(@style,'background-size: {{backgroundSize}};')]" parameterized="true"/>
<element name="backgroundRepeat" type="button" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{bannerIndex}}]//div[@data-element='wrapper'][contains(@style,'background-repeat: {{backgroundRepeat}};')]" parameterized="true"/>
<element name="backgroundAttachment" type="button" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{bannerIndex}}]//div[@data-element='wrapper'][contains(@style,'background-attachment: {{backgroundAttachment}};')]" parameterized="true"/>
<element name="backgroundColor" type="button" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{bannerIndex}}]//div[@data-element='wrapper'][contains(@style,'background-color: {{backgroundColor}};')]" parameterized="true"/>
<element name="backgroundColorElement" type="button" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{bannerIndex}}]//div[@data-element='wrapper'][contains(@style,'background-color:')]" parameterized="true"/>
<element name="noBackgroundColor" type="button" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{bannerIndex}}]//div[@data-element='wrapper'][not(contains(@style,'background-color:'))]" parameterized="true"/>
<element name="backgroundImage" type="button" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{bannerIndex}}]//div[@data-element='wrapper'][contains(@style,'background-image: url(') and contains(@style,'{{backgroundImage}}')]" parameterized="true"/>
<element name="noBackgroundImage" type="button" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{bannerIndex}}]//div[@data-element='wrapper'][not(contains(@style,'background-image:'))]" parameterized="true"/>
Expand All @@ -118,6 +133,17 @@
<element name="overlayBackgroundColor" type="button" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{bannerIndex}}]//div[@data-element='overlay'][contains(@style,'background-color: {{overlayBackgroundColor}};')]" parameterized="true"/>
<element name="transparentOverlay" type="button" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{bannerIndex}}]//div[@data-element='overlay'][contains(@style,'background-color: transparent;')]" parameterized="true"/>
<element name="inlineWYSIWYGEditorWithTag" type="text" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{bannerIndex}}]//div[contains(@class,'inline-wysiwyg')]//{{tag}}" parameterized="true"/>
<!-- Video Background -->
<element name="videoBackgroundJarallaxContainer" type="text" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{bannerIndex}}]//div[@data-element='wrapper']//div[contains(@id,'jarallax-container')]" parameterized="true"/>
<element name="videoBackgroundVideoElement" type="text" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{bannerIndex}}]//div[@data-element='wrapper']//div[contains(@id,'jarallax-container')]//iframe|(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{bannerIndex}}]//div[@data-element='wrapper']//div[contains(@id,'jarallax-container')]//video" parameterized="true"/>
<element name="videoBackgroundVideoUrl" type="text" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{bannerIndex}}]//div[@data-element='wrapper']//div[contains(@id,'jarallax-container')]//*[contains(@src,'{{videoURL}}')]" parameterized="true"/>
<element name="videoBackgroundOverlayElement" type="text" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{bannerIndex}}]//div[@data-element='wrapper']//div[@data-element='video_overlay']" parameterized="true"/>
<element name="videoBackgroundInfiniteLoop" type="text" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{bannerIndex}}]//div[@data-element='wrapper'][@data-video-loop='{{infiniteLoopValue}}']" parameterized="true"/>
<element name="videoBackgroundLazyLoad" type="text" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{bannerIndex}}]//div[@data-element='wrapper'][@data-video-lazy-load='{{lazyLoadValue}}']" parameterized="true"/>
<element name="videoBackgroundPlayOnlyWhenVisible" type="text" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{bannerIndex}}]//div[@data-element='wrapper'][@data-video-play-only-visible='{{playOnlyVisibleValue}}']" parameterized="true"/>
<element name="videoBackgroundFallbackImage" type="text" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{bannerIndex}}]//div[@data-element='wrapper']//div[contains(@id,'jarallax-container')]//img" parameterized="true"/>
<element name="videoBackgroundFallbackImageSource" type="text" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{bannerIndex}}]//div[@data-element='wrapper']//div[contains(@id,'jarallax-container')]//img[contains(@src,'{{fileName}}')]" parameterized="true"/>
<element name="videoBackgroundNoFallbackImage" type="text" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{bannerIndex}}]//div[@data-element='wrapper']//div[contains(@id,'jarallax-container')]//div" parameterized="true"/>
<!-- Advanced Configuration -->
<element name="alignment" type="text" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{bannerIndex}}]//div[@data-element='wrapper'][contains(@style,'text-align: {{alignment}};')]" parameterized="true"/>
<element name="noAlignment" type="text" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{bannerIndex}}]//div[@data-element='wrapper'][not(contains(@style,'text-align:'))]" parameterized="true"/>
Expand Down
Loading