Skip to content

Commit 0a7e189

Browse files
committed
Merge branch 'MC-4116-slider-images' into cms-team-1-delivery
2 parents 466c219 + 2d4ce5c commit 0a7e189

File tree

56 files changed

+821
-753
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

56 files changed

+821
-753
lines changed

app/code/Magento/PageBuilder/Setup/DataConverter/Renderer/AdvancedSliderItem.php

Lines changed: 18 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -59,11 +59,23 @@ public function render(array $itemData, array $additionalData = []) : string
5959
];
6060

6161
$formData = $itemData['formData'] ?? [];
62-
$formData['background_image'] = '';
62+
$backgroundImages = '';
63+
$backgroundImagesAttr = '{}';
64+
6365
if (isset($eavData['background_image'])) {
64-
$formData['background_image'] = $eavData['background_image'];
66+
$backgroundImages = $eavData['background_image'];
6567
} elseif (isset($eavData['image'])) {
66-
$formData['background_image'] = $eavData['image'];
68+
$backgroundImages = $eavData['image'];
69+
}
70+
71+
if ($backgroundImages) {
72+
$backgroundImagesAttr = '{\"'
73+
. 'desktop_image\":\"'
74+
. '{{media url=wysiwyg'
75+
. $backgroundImages
76+
. '}}\",\"'
77+
. 'mobile_image\":\"'
78+
. '{}\"}';
6779
}
6880

6981
$margin = $this->styleExtractor->extractStyle($formData, ['margin']);
@@ -72,8 +84,9 @@ public function render(array $itemData, array $additionalData = []) : string
7284
}
7385

7486
$wrapperDivElementAttributes = [
75-
'data-element' => 'mobile_image',
76-
'class' => 'pagebuilder-slide-wrapper pagebuilder-mobile-only'
87+
'data-element' => 'wrapper',
88+
'data-background-images' => $backgroundImagesAttr,
89+
'class' => 'pagebuilder-slide-wrapper'
7790
];
7891
$style = $this->styleExtractor->extractStyle($formData);
7992
if ($style) {
@@ -122,22 +135,6 @@ public function render(array $itemData, array $additionalData = []) : string
122135
. $buttonElementHtml
123136
. '</div></div></div>';
124137

125-
// non-mobile wrapper div
126-
$wrapperDivElementAttributes['data-element'] = 'desktop_image';
127-
$wrapperDivElementAttributes['class'] = 'pagebuilder-slide-wrapper ' .
128-
'pagebuilder-mobile-hidden';
129-
$rootElementHtml .= '<div'
130-
. $this->printAttributes($wrapperDivElementAttributes)
131-
. '><div'
132-
. $this->printAttributes($overlayDivElementAttributes)
133-
. '><div class="pagebuilder-poster-content">'
134-
. '<div data-element="content"><h3>'
135-
. ($eavData['title'] ?? $eavData['title_tag'] ?? '')
136-
. '</h3>'
137-
. '<div>' . ($eavData['textarea'] ?? '') . '</div></div>'
138-
. $buttonElementHtml
139-
. '</div></div></div>';
140-
141138
$rootElementHtml .= '</div></div>';
142139

143140
return $rootElementHtml;

app/code/Magento/PageBuilder/Test/Mftf/ActionGroup/OverlayActionGroup.xml

Lines changed: 53 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,50 @@
88

99
<actionGroups xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
1010
xsi:noNamespaceSchemaLocation="urn:magento:mftf:Test/etc/actionGroupSchema.xsd">
11+
<!-- Poster Appearance -->
12+
<actionGroup name="validateOverlayPositionPoster">
13+
<arguments>
14+
<argument name="page"/>
15+
<argument name="index" defaultValue="1" type="string"/>
16+
<argument name="padding" defaultValue="PageBuilderPaddingProperty40"/>
17+
</arguments>
18+
<!-- Validate top edge of overlay -->
19+
<comment userInput="Validate top edge of overlay" stepKey="commentValidateTopEdgeOfOverlayWithPadding"/>
20+
<executeJS function="return {{page.wrapperJS(index)}}.getBoundingClientRect().top" stepKey="wrapperTopPosition"/>
21+
<executeJS function="return {{page.overlayJS(index)}}.getBoundingClientRect().top" stepKey="overlayTopPosition"/>
22+
<executeJS function="return Math.round(({$overlayTopPosition}/{$wrapperTopPosition})*100)/100" stepKey="overlayTopRatio"/>
23+
<assertEquals stepKey="assertOverlayTopRatio">
24+
<expectedResult type="int">1</expectedResult>
25+
<actualResult type="variable">overlayTopRatio</actualResult>
26+
</assertEquals>
27+
<!-- Validate right edge of overlay -->
28+
<comment userInput="Validate right edge of overlay" stepKey="commentValidateRightEdgeOfOverlay"/>
29+
<executeJS function="return {{page.wrapperJS(index)}}.getBoundingClientRect().right" stepKey="wrapperRightPosition"/>
30+
<executeJS function="return {{page.overlayJS(index)}}.getBoundingClientRect().right" stepKey="overlayRightPosition"/>
31+
<executeJS function="return Math.round(({$wrapperRightPosition}/{$overlayRightPosition})*100)/100" stepKey="overlayRightRatio"/>
32+
<assertEquals stepKey="assertOverlayRightRatio">
33+
<expectedResult type="int">1</expectedResult>
34+
<actualResult type="variable">overlayRightRatio</actualResult>
35+
</assertEquals>
36+
<!-- Validate bottom edge of overlay -->
37+
<comment userInput="Validate bottom edge of overlay" stepKey="commentValidateBottomEdgeOfOverlay"/>
38+
<executeJS function="return {{page.wrapperJS(index)}}.getBoundingClientRect().bottom" stepKey="wrapperBottomPosition"/>
39+
<executeJS function="return {{page.overlayJS(index)}}.getBoundingClientRect().bottom" stepKey="overlayBottomPosition"/>
40+
<executeJS function="return Math.round(({$wrapperBottomPosition}/{$overlayBottomPosition})*100)/100" stepKey="overlayBottomRatio"/>
41+
<assertEquals stepKey="assertOverlayBottomRatio">
42+
<expectedResult type="int">1</expectedResult>
43+
<actualResult type="variable">overlayBottomRatio</actualResult>
44+
</assertEquals>
45+
<!-- Validate left edge of overlay -->
46+
<comment userInput="Validate left edge of overlay" stepKey="commentValidateLeftEdgeOfOverlay"/>
47+
<executeJS function="return {{page.wrapperJS(index)}}.getBoundingClientRect().left" stepKey="wrapperLeftPosition"/>
48+
<executeJS function="return {{page.overlayJS(index)}}.getBoundingClientRect().left" stepKey="overlayLeftPosition"/>
49+
<executeJS function="return Math.round(({$wrapperLeftPosition}/{$overlayLeftPosition})*100)/100" stepKey="overlayLeftRatio"/>
50+
<assertEquals stepKey="assertOverlayLeftRatio">
51+
<expectedResult type="int">1</expectedResult>
52+
<actualResult type="variable">overlayLeftRatio</actualResult>
53+
</assertEquals>
54+
</actionGroup>
1155
<!-- Collage Appearances -->
1256
<!-- Checks the position of the overlay with small padding value. This action group may not work with large padding values -->
1357
<actionGroup name="validateOverlayPositionCollageLeft">
@@ -108,20 +152,20 @@
108152
<argument name="index" defaultValue="1" type="string"/>
109153
<argument name="padding" defaultValue="PageBuilderPaddingProperty40"/>
110154
</arguments>
111-
<!-- Bottom edge validation is skipped until MC-4116 -->
112155
<!-- Validate bottom edge of overlay -->
113-
<!--<comment userInput="Validate bottom edge of overlay" stepKey="commentValidateBottomEdgeOfOverlay"/>-->
114-
<!--<executeJS function="return {{page.wrapperJS(index)}}.getBoundingClientRect().top+{{padding.paddingTop}}+120" stepKey="wrapperTopPaddingContent"/>-->
156+
<comment userInput="Validate bottom edge of overlay" stepKey="commentValidateBottomEdgeOfOverlay"/>
157+
<executeJS function="return {{page.wrapperJS(index)}}.getBoundingClientRect().top+{{padding.paddingTop}}+120" stepKey="wrapperTopPaddingContent"/>
115158
<executeJS function="return {{page.overlayJS(index)}}.getBoundingClientRect().bottom" stepKey="overlayBottomPosition"/>
116-
<!--<assertEquals stepKey="assertOverlayBottomRatio">-->
117-
<!--<expectedResult type="variable">wrapperTopPaddingContent</expectedResult>-->
118-
<!--<actualResult type="variable">overlayBottomPosition</actualResult>-->
119-
<!--</assertEquals>-->
159+
<executeJS function="return Math.round(({$wrapperTopPaddingContent}/{$overlayBottomPosition})*100)/100" stepKey="overlayBottomRatio"/>
160+
<assertEquals stepKey="assertOverlayBottomRatio">
161+
<expectedResult type="int">1</expectedResult>
162+
<actualResult type="variable">overlayBottomRatio</actualResult>
163+
</assertEquals>
120164
<!-- Validate bottom edge of overlay is within parent -->
121165
<comment userInput="Validate bottom edge of overlay is within parent" stepKey="commentValidateBottomEdgeOfOverlayIsWithinParent"/>
122-
<executeJS function="return {{page.wrapperJS(index)}}.getBoundingClientRect().bottom" stepKey="wrapperBottomPosition"/>
166+
<executeJS function="return {{page.wrapperJS(index)}}.getBoundingClientRect().bottom-{{padding.paddingBottom}}" stepKey="wrapperBottomPositionNoPadding"/>
123167
<assertLessThanOrEqual stepKey="assertOverlayBottomIsWithinParent">
124-
<expectedResult type="variable">wrapperBottomPosition</expectedResult>
168+
<expectedResult type="variable">wrapperBottomPositionNoPadding</expectedResult>
125169
<actualResult type="variable">overlayBottomPosition</actualResult>
126170
</assertLessThanOrEqual>
127171
</actionGroup>

app/code/Magento/PageBuilder/Test/Mftf/Data/SlideData.xml

Lines changed: 7 additions & 55 deletions
Large diffs are not rendered by default.

0 commit comments

Comments
 (0)