Skip to content

Commit a1cd9af

Browse files
author
Cari Spruiell
authored
Merge pull request #160 from magento-obsessive-owls/cms-team-1-delivery
[CMS Team 1] PageBuilder Bug Fixes
2 parents 6cd8656 + 58a72ee commit a1cd9af

File tree

115 files changed

+2753
-1883
lines changed

Some content is hidden

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

115 files changed

+2753
-1883
lines changed

app/code/Magento/PageBuilder/Controller/Adminhtml/ContentType/Image/Upload.php

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,12 +5,12 @@
55
*/
66
namespace Magento\PageBuilder\Controller\Adminhtml\ContentType\Image;
77

8-
use Magento\Framework\Controller\ResultFactory;
8+
use Magento\Framework\App\Action\HttpPostActionInterface;
99

1010
/**
1111
* Class Upload
1212
*/
13-
class Upload extends \Magento\Backend\App\Action
13+
class Upload extends \Magento\Backend\App\Action implements HttpPostActionInterface
1414
{
1515
const UPLOAD_DIR = 'wysiwyg';
1616

@@ -94,7 +94,12 @@ public function execute()
9494
$fileUploader->setAllowRenameFiles(true);
9595
$fileUploader->setAllowedExtensions(['jpeg','jpg','png','gif']);
9696
$fileUploader->setAllowCreateFolders(true);
97+
9798
try {
99+
if (!$fileUploader->checkMimeType(['image/png', 'image/jpeg', 'image/gif'])) {
100+
throw new \Magento\Framework\Exception\LocalizedException(__('File validation failed.'));
101+
}
102+
98103
$result = $fileUploader->save($this->getUploadDir());
99104
$baseUrl = $this->storeManager->getStore()->getBaseUrl(\Magento\Framework\UrlInterface::URL_TYPE_MEDIA);
100105
$result['id'] = $this->cmsWysiwygImages->idEncode($result['file']);

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/Setup/DataConverter/Renderer/Driver.php

Lines changed: 14 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -33,6 +33,7 @@ class Driver implements RendererInterface
3333
private $serializer;
3434

3535
/**
36+
* Driver constructor.
3637
* @param StyleExtractorInterface $styleExtractor
3738
* @param EavAttributeLoaderInterface $eavAttributeLoader
3839
* @param Json $serializer
@@ -88,30 +89,23 @@ public function render(array $itemData, array $additionalData = []) : string
8889
'data-href' => $eavData['link_url'] ?? '',
8990
'data-target' => isset($eavData['target_blank']) && $eavData['target_blank'] ? '_blank' : '',
9091
];
92+
9193
$imageAttributes = [
92-
'data-element' => 'desktop_image',
93-
'style' => 'background-image: url('
94-
. "'{{media url=wysiwyg"
94+
'data-element' => 'wrapper',
95+
'data-background-images' => '{\&quot;'
96+
. 'desktop_image\&quot;:\&quot;'
97+
. '{{media url=wysiwyg'
98+
. $eavData['image']
99+
. '}}\&quot;,\&quot;'
100+
. 'mobile_image\&quot;:\&quot;'
101+
. '{{media url=wysiwyg'
95102
. $eavData['image']
96-
. "}}'); "
97-
. 'min-height: 300px; background-size: auto; background-repeat: no-repeat; '
98-
. 'background-attachment: scroll;'
103+
. '}}\&quot;}',
104+
'style' => 'min-height: 300px; background-size: auto; '
105+
. 'background-repeat: no-repeat; background-attachment: scroll;'
99106
. $textAlign,
100-
'class' => 'pagebuilder-banner-wrapper pagebuilder-mobile-hidden'
101-
];
102-
$mobileImageAttributes = [
103-
'data-element' => 'mobile_image',
104-
'style' => 'background-image: url('
105-
. "'{{media url=wysiwyg"
106-
. (isset($eavData['image']) ? $eavData['image'] : $eavData['mobile_image'])
107-
. "}}'); "
108-
. 'min-height: 300px; background-size: auto; background-repeat: no-repeat; '
109-
. 'background-attachment: scroll;'
110-
. $textAlign
107+
'class' => 'pagebuilder-banner-wrapper'
111108
];
112-
$mobileImageElementHtml = '<div'
113-
. $this->printAttributes($mobileImageAttributes)
114-
. ' class="pagebuilder-banner-wrapper pagebuilder-mobile-only">';
115109

116110
$imageElementHtml = '<div' . $this->printAttributes($imageAttributes) . '>';
117111
$overlayElementHtml = '<div '
@@ -136,7 +130,6 @@ public function render(array $itemData, array $additionalData = []) : string
136130
. '<div class="pagebuilder-poster-content"><div data-element="content"></div>'
137131
. $buttonHtml
138132
. '</div></div></div>'
139-
. $mobileImageElementHtml
140133
. $overlayElementHtml
141134
. '<div class="pagebuilder-poster-content"><div data-element="content"></div>'
142135
. $buttonHtml

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

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -36,4 +36,55 @@
3636
<seeElement selector="{{BlockOnStage.title(index,block.title)}}" stepKey="seeOptionMenuTitle"/>
3737
<see selector="{{BlockOnStage.content(index)}}" userInput="{{block.content}}" stepKey="seeBlockContentOnStage"/>
3838
</actionGroup>
39+
<actionGroup name="verifyVerticalAlignmentBottomInBlock">
40+
<arguments>
41+
<argument name="block" defaultValue="BlockOnStorefront"/>
42+
<argument name="container"/>
43+
<argument name="content"/>
44+
<argument name="minHeight"/>
45+
<argument name="padding"/>
46+
<argument name="index" defaultValue="1" type="string"/>
47+
<!-- Remove storefrontBugOffset when MC-5079 is resolved -->
48+
<argument name="storefrontBugOffset" defaultValue="0" type="string"/>
49+
</arguments>
50+
<executeJS function="return document.querySelectorAll('{{block.baseCSS}} {{container.baseCSS}}')[{{index}}-1].clientHeight;" stepKey="containerHeight"/>
51+
<executeJS function="return {$containerHeight}-{{storefrontBugOffset}}" stepKey="minusBugOffset"/>
52+
<assertGreaterThanOrEqual stepKey="assertContainerHeightGreaterThanOrEqualMinHeight">
53+
<expectedResult type="string">{{minHeight}}</expectedResult>
54+
<actualResult type="variable">minusBugOffset</actualResult>
55+
</assertGreaterThanOrEqual>
56+
<executeJS function="return document.querySelectorAll('{{block.baseCSS}} {{container.baseCSS}}')[{{index}}-1].getBoundingClientRect().bottom-{{padding.paddingBottom}}" stepKey="containerBottomPositionMinusPadding"/>
57+
<executeJS function="return document.querySelectorAll('{{block.baseCSS}} {{content.baseCSS}}')[{{index}}-1].getBoundingClientRect().bottom" stepKey="contentBottomPosition"/>
58+
<executeJS function="return Math.round(({$containerBottomPositionMinusPadding}/{$contentBottomPosition})*100)/100" stepKey="bottomPositionRatio"/>
59+
<assertEquals stepKey="assertBottomPositionRatio">
60+
<expectedResult type="int">1</expectedResult>
61+
<actualResult type="variable">bottomPositionRatio</actualResult>
62+
</assertEquals>
63+
</actionGroup>
64+
<actionGroup name="verifyAlignmentRightInBlock">
65+
<arguments>
66+
<argument name="block" defaultValue="BlockOnStorefront"/>
67+
<argument name="container" type="string"/>
68+
<argument name="content" type="string"/>
69+
<argument name="containerPadding"/>
70+
<argument name="index" defaultValue="1" type="string"/>
71+
</arguments>
72+
<!-- Verify container width is larger than content width -->
73+
<comment userInput="Verify container width is larger than content width" stepKey="commentVerifyWidth"/>
74+
<executeJS function="return document.querySelectorAll('{{block.baseCSS}} {{container}}')[{{index}}-1].clientWidth;" stepKey="containerWidth"/>
75+
<executeJS function="return document.querySelectorAll('{{block.baseCSS}} {{content}}')[{{index}}-1].clientWidth;" stepKey="contentWidth"/>
76+
<assertGreaterThan stepKey="assertContainerHeightIsGreater">
77+
<expectedResult type="variable">contentWidth</expectedResult>
78+
<actualResult type="variable">containerWidth</actualResult>
79+
</assertGreaterThan>
80+
<!-- Verify position right of container matches content -->
81+
<comment userInput="Verify position right of container matches content" stepKey="commentVerifyRightPosition"/>
82+
<executeJS function="return document.querySelectorAll('{{block.baseCSS}} {{container}}')[{{index}}-1].getBoundingClientRect().right-{{containerPadding.paddingRight}};" stepKey="containerRightMinusPadding"/>
83+
<executeJS function="return document.querySelectorAll('{{block.baseCSS}} {{content}}')[{{index}}-1].getBoundingClientRect().right;" stepKey="contentRight"/>
84+
<executeJS function="return Math.round(({$containerRightMinusPadding}/{$contentRight})*100)/100" stepKey="rightPositionRatio"/>
85+
<assertEquals stepKey="assertRightPositionRatio">
86+
<expectedResult type="int">1</expectedResult>
87+
<actualResult type="variable">rightPositionRatio</actualResult>
88+
</assertEquals>
89+
</actionGroup>
3990
</actionGroups>

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

Lines changed: 0 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -28,17 +28,6 @@
2828
<waitForElementVisible time="10" selector="{{PageBuilderStage.contentTypeInStageByIndex(contentType.role, contentTypeNumber)}}" stepKey="waitForContentTypeInStage" />
2929
<waitForPageLoad stepKey="waitForToolbarsToLoad" time="30"/>
3030
</actionGroup>
31-
<actionGroup name="dragContentTypeToStageAndExpectEditPanel">
32-
<arguments>
33-
<argument name="contentType"/>
34-
</arguments>
35-
<dragAndDrop selector1="{{PageBuilderPanel.draggableContentTypeInPanel(contentType.name)}}" selector2="{{PageBuilderStage.dropAreaInStage}}" stepKey="dropContentTypeIntoStage"/>
36-
<waitForPageLoad time="30" stepKey="waitForStageToLoad"/>
37-
<waitForElementVisible time="10" selector="{{PageBuilderStage.contentTypeInStage(contentType.role)}}" stepKey="waitForContentTypeInStage" />
38-
<waitForElementVisible time="10" selector="{{EditPanelForm.editFormTitle}}" stepKey="waitForContentTypeNameInEditFormTitle" />
39-
<see userInput="Edit {{contentType.editPanelName}}" selector="{{EditPanelForm.editFormTitle}}" stepKey="seeContentTypeNameInEditFormTitle"/>
40-
<waitForPageLoad stepKey="waitForEditFormLoad" time="30"/>
41-
</actionGroup>
4231
<actionGroup name="dragContentTypeToContainer">
4332
<arguments>
4433
<argument name="contentType"/>
@@ -71,20 +60,6 @@
7160
<waitForElementNotVisible time="10" selector="{{PageBuilderStage.contentTypeInStageByIndex(contentType.role, contentTypeIndex)}}" stepKey="waitForContentTypeNotOnStage" />
7261
<dontSeeElementInDOM selector="{{PageBuilderStage.contentTypeInStageByIndex(contentType.role, contentTypeIndex)}}" stepKey="dontSeeElementInContainer" />
7362
</actionGroup>
74-
<actionGroup name="dragContentTypeToContainerAndExpectEditPanel">
75-
<arguments>
76-
<argument name="contentType"/>
77-
<argument name="contentTypeIndex" defaultValue="1" type="string"/>
78-
<argument name="containerTargetType"/>
79-
<argument name="containerTargetIndex" defaultValue="1" type="string"/>
80-
</arguments>
81-
<scrollTo selector="{{CmsNewPagePageActionsSection.contentSectionName}}" stepKey="scrollToTopOfStage"/>
82-
<dragAndDrop selector1="{{PageBuilderPanel.draggableContentTypeInPanel(contentType.name)}}" selector2="{{PageBuilderStage.contentTypeContainer(containerTargetType.role, containerTargetIndex)}}" stepKey="dropContentTypeIntoStage"/>
83-
<waitForPageLoad time="30" stepKey="waitForStageToLoad"/>
84-
<waitForElementVisible time="30" selector="{{PageBuilderStage.contentTypeInStageByIndex(contentType.role, contentTypeIndex)}}" stepKey="waitForContentTypeInContainer"/>
85-
<waitForElementVisible time="30" selector="{{EditPanelForm.editFormTitle}}" stepKey="waitForContentTypeNameInEditFormTitle"/>
86-
<see userInput="Edit {{contentType.editPanelName}}" selector="{{EditPanelForm.editFormTitle}}" stepKey="seeContentTypeNameInEditFormTitle"/>
87-
</actionGroup>
8863
<!-- Test to ensure a content block doesn't receive drop events -->
8964
<actionGroup name="dragContentTypeToContentType">
9065
<arguments>

0 commit comments

Comments
 (0)