Skip to content

Commit a8a307f

Browse files
tjwiebelltjwiebell
authored
Merge pull request #85 from magento-obsessive-owls/cms-team-2-sprint-10
[CMS Team 2 - Sprint 10] Map Style and Banner Background Attributes
2 parents eb0daa1 + a3c5ef1 commit a8a307f

File tree

93 files changed

+5796
-1438
lines changed

Some content is hidden

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

93 files changed

+5796
-1438
lines changed

‎app/code/Magento/PageBuilder/Block/GoogleMapsApiBlock.php renamed to ‎app/code/Magento/PageBuilder/Block/GoogleMapsApi.php

Lines changed: 13 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,20 +10,31 @@
1010
/**
1111
* @api
1212
*/
13-
class GoogleMapsApiBlock extends \Magento\Framework\View\Element\Template
13+
class GoogleMapsApi extends \Magento\Framework\View\Element\Template
1414
{
1515
const GOOGLE_MAPS_API_KEY_PATH = 'cms/pagebuilder/google_maps_api_key';
1616
const GOOGLE_MAPS_LIBRARY_URL = 'https://maps.googleapis.com/maps/api/js?v=3&key=%s';
17+
const GOOGLE_MAPS_STYLE_PATH = 'cms/pagebuilder/google_maps_style';
1718

1819
/**
1920
* Generate URL for retrieving Google Maps Javascript API
2021
*
2122
* @return string
2223
*/
23-
public function getGoogleMapsApiPath(): string
24+
public function getLibraryUrl(): string
2425
{
2526
$apiKey = $this->_scopeConfig->getValue(self::GOOGLE_MAPS_API_KEY_PATH);
2627
$libraryUrlWithKey = sprintf(self::GOOGLE_MAPS_LIBRARY_URL, $apiKey);
2728
return $libraryUrlWithKey;
2829
}
30+
31+
/**
32+
* Retrieve Google Maps Styles from Configurations
33+
*
34+
* @return string|null
35+
*/
36+
public function getStyle(): ?string
37+
{
38+
return $this->_scopeConfig->getValue(self::GOOGLE_MAPS_STYLE_PATH);
39+
}
2940
}

‎app/code/Magento/PageBuilder/Setup/DataConverter/Renderer/Driver.php

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -53,8 +53,8 @@ public function render(array $itemData, array $additionalData = [])
5353
$rootElementAttributes = [
5454
'data-role' => 'banner',
5555
'data-appearance' => 'poster',
56-
'data-show-button' => 'never_show',
57-
'data-show-overlay' => 'never_show',
56+
'data-show-button' => 'never',
57+
'data-show-overlay' => 'never',
5858
'class' => $eavData['css_classes'] ?? ''
5959
];
6060

‎app/code/Magento/PageBuilder/Setup/DataConverter/Renderer/Map.php

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -65,11 +65,6 @@ public function render(array $itemData, array $additionalData = [])
6565

6666
$style = $this->styleExtractor->extractStyle($formData);
6767
if ($style) {
68-
if (isset($eavData['map'])) {
69-
$style .= ' display: inline-block;';
70-
} else {
71-
$style .= ' display: none;';
72-
}
7368
$this->rootElementAttributes['style'] = $style;
7469
}
7570
}

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

Lines changed: 36 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -555,6 +555,15 @@
555555
<waitForLoadingMaskToDisappear stepKey="waitForLoading"/>
556556
<waitForElementVisible time="10" selector="{{PageBuilderActionsSection.editFormUploadedImage(property.section, property.fieldName)}}" stepKey="waitForImageUploaded"/>
557557
</actionGroup>
558+
<actionGroup name="clickSelectFromGallerySlideOut">
559+
<arguments>
560+
<argument name="property"/>
561+
</arguments>
562+
<waitForElementVisible selector="{{EditPanelForm.selectFromGalleryBtn(property.section, property.fieldName)}}" stepKey="waitForSelectFromGalleryBtn"/>
563+
<click selector="{{EditPanelForm.selectFromGalleryBtn(property.section, property.fieldName)}}" stepKey="clickSelectFromGalleryBtn"/>
564+
<waitForPageLoad stepKey="waitForPageLoad"/>
565+
<waitForLoadingMaskToDisappear stepKey="waitForLoadingMaskToDisappear"/>
566+
</actionGroup>
558567
<actionGroup name="conditionalClickSlideOutPanelFieldGeneral">
559568
<arguments>
560569
<argument name="property"/>
@@ -600,7 +609,7 @@
600609
<argument name="property"/>
601610
</arguments>
602611
<waitForElement selector="{{PageBuilderActionsSection.panelFieldControl(property.section, property.fieldName)}}" stepKey="waitForElement" />
603-
<waitForElementVisible selector="{{PageBuilderActionsSection.editFormUploadedImageSource(property.section, property.fieldName, property.fileName, property.fileType)}}" stepKey="seeUploadedFile"/>
612+
<waitForElementVisible selector="{{PageBuilderActionsSection.editFormUploadedImageSource(property.section, property.fieldName, property.fileName, property.extension)}}" stepKey="seeUploadedFile"/>
604613
</actionGroup>
605614
<actionGroup name="seeNoImageUploadedOnSlideOut">
606615
<arguments>
@@ -677,11 +686,20 @@
677686
<waitForElement time="2" selector="{{PageBuilderColumnSection.panelFieldControl(property.section, property.fieldName)}}" stepKey="waitForElementVisible"/>
678687
<dontSeeCheckboxIsChecked selector="{{PageBuilderColumnSection.panelFieldControl(property.section, property.fieldName)}}" stepKey="dontSeeOptionIsCheckedProperty"/>
679688
</actionGroup>
689+
<actionGroup name="openAndValidateColorPickerValue">
690+
<arguments>
691+
<argument name="color" type="string"/>
692+
</arguments>
693+
<waitForElementVisible selector="{{PageBuilderActionsSection.panelColorSwatch(PageBuilderBackgroundColor_Default.section, PageBuilderBackgroundColor_Default.fieldName)}}" stepKey="waitForColorSwatch"/>
694+
<click selector="{{PageBuilderActionsSection.panelColorSwatch(PageBuilderBackgroundColor_Default.section, PageBuilderBackgroundColor_Default.fieldName)}}" stepKey="clickColorSwatch"/>
695+
<waitForElementVisible selector="{{ColorPicker.colorPickerWindow}}" stepKey="waitForColorPickerWindow"/>
696+
<seeInField selector="{{ColorPicker.inputField}}" userInput="{{color}}" stepKey="seeExpectedColor"/>
697+
</actionGroup>
680698
<actionGroup name="seeColorInColorSwatch">
681699
<arguments>
682700
<argument name="property"/>
683701
</arguments>
684-
<waitForElementVisible selector="{{PageBuilderActionsSection.panelColorSwatchColor(property.section, property.fieldName, property.rgb)}}" stepKey="waitForColorSwatch"/>
702+
<waitForElementVisible selector="{{PageBuilderActionsSection.panelColorSwatchColor(property.section, property.fieldName, property.rgb)}}" stepKey="waitForColorSwatchColor"/>
685703
</actionGroup>
686704
<actionGroup name="seeNoColorInColorSwatch">
687705
<arguments>
@@ -695,12 +713,25 @@
695713
</arguments>
696714
<attachFile userInput="{{property.value}}" selector='{{PageBuilderColumnSection.panelFieldControl(property.section, property.fieldName)}}' stepKey="attachBackgroundImageFile"/>
697715
<waitForLoadingMaskToDisappear stepKey="waitForLoading"/>
698-
<waitForElementVisible selector="{{PageBuilderColumnSection.backgroundImagePreview}}" stepKey="waitForImageUpload"/>
716+
<waitForElementVisible selector="{{EditPanelForm.backgroundImagePreview}}" stepKey="waitForImageUpload"/>
717+
</actionGroup>
718+
<actionGroup name="attachInvalidFileOnSlideOut">
719+
<arguments>
720+
<argument name="property"/>
721+
</arguments>
722+
<attachFile userInput="{{property.value}}" selector='{{PageBuilderColumnSection.panelFieldControl(property.section, property.fieldName)}}' stepKey="attachBackgroundImageFile"/>
723+
<waitForPageLoad stepKey="waitForPageLoad"/>
724+
<waitForElementVisible selector="{{EditPanelForm.invalidUploadTitle}}" stepKey="waitForInvalidUploadTitle"/>
725+
<waitForElementVisible selector="{{EditPanelForm.invalidUploadMessage(property.errorMessage)}}" stepKey="waitForInvalidUploadMessage"/>
726+
<waitForElementVisible selector="{{EditPanelForm.invalidUploadOkBtn}}" stepKey="waitForInvalidUploadBtn"/>
727+
<click selector="{{EditPanelForm.invalidUploadOkBtn}}" stepKey="clickInvalidUploadBtn"/>
728+
<waitForElementNotVisible selector="{{EditPanelForm.invalidUploadTitle}}" stepKey="waitForModalGone"/>
729+
<dontSeeElementInDOM selector="{{EditPanelForm.backgroundImagePreview}}" stepKey="dontSeeImage"/>
699730
</actionGroup>
700731
<actionGroup name="saveEditPanelSettings">
701732
<waitForLoadingMaskToDisappear stepKey="waitForLoadingMask"/>
702-
<waitForElementVisible time="5" selector="{{PageBuilderActionsSection.editFormSave}}" stepKey="waitForColumnSaveButton"/>
703-
<click selector="{{PageBuilderActionsSection.editFormSave}}" stepKey="clickSaveColumn"/>
733+
<waitForElementVisible time="5" selector="{{PageBuilderActionsSection.editFormSave}}" stepKey="waitForSaveButton"/>
734+
<click selector="{{PageBuilderActionsSection.editFormSave}}" stepKey="clickSaveButton"/>
704735
<waitForPageLoad time="30" stepKey="waitForStageToLoad"/>
705736
<waitForElementNotVisible time="5" selector="{{PageBuilderActionsSection.editForm}}" stepKey="waitForEditFormNotVisible"/>
706737
<waitForElementVisible time="10" selector="{{CmsNewPagePageActionsSection.saveAndContinueEdit}}" stepKey="waitForCmsPageSaveButton"/>

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

Lines changed: 118 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,118 @@
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+
9+
<actionGroups xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
10+
xsi:noNamespaceSchemaLocation="../../../../../../../dev/tests/acceptance/vendor/magento/magento2-functional-testing-framework/src/Magento/FunctionalTestingFramework/Test/etc/actionGroupSchema.xsd">
11+
<actionGroup name="validateBackgroundAttributesWithNoImageOrColor">
12+
<arguments>
13+
<argument name="section"/>
14+
<argument name="backgroundPosition" defaultValue="PageBuilderBackgroundPosition_Default"/>
15+
<argument name="backgroundSize" defaultValue="PageBuilderBackgroundSize_Default"/>
16+
<argument name="backgroundRepeat" defaultValue="PageBuilderBackgroundRepeat_Default"/>
17+
<argument name="backgroundAttachment" defaultValue="PageBuilderBackgroundAttachment_Default"/>
18+
<argument name="index" defaultValue="1" type="string"/>
19+
</arguments>
20+
<comment userInput="validateBackgroundAttributesWithNoImageOrColor" stepKey="comment"/>
21+
<waitForElementVisible selector="{{section.base(index)}}" stepKey="waitForBaseElement"/>
22+
<waitForElementVisible selector="{{section.noBackgroundColor(index)}}" stepKey="waitForBackgroundColor"/>
23+
<waitForElementVisible selector="{{section.noBackgroundImage(index)}}" stepKey="waitForBackgroundImage"/>
24+
<waitForElementVisible selector="{{section.backgroundPosition(index, backgroundPosition.styleValue)}}" stepKey="waitForBackgroundPosition"/>
25+
<waitForElementVisible selector="{{section.backgroundSize(index, backgroundSize.value)}}" stepKey="waitForBackgroundSize"/>
26+
<waitForElementVisible selector="{{section.backgroundRepeat(index, backgroundRepeat.styleValue)}}" stepKey="waitForBackgroundRepeat"/>
27+
<waitForElementVisible selector="{{section.backgroundAttachment(index, backgroundAttachment.value)}}" stepKey="waitForBackgroundAttachment"/>
28+
</actionGroup>
29+
<actionGroup name="validateBackgroundAttributesWithNoColor">
30+
<arguments>
31+
<argument name="section"/>
32+
<argument name="backgroundImage"/>
33+
<argument name="backgroundPosition" defaultValue="PageBuilderBackgroundPosition_Default"/>
34+
<argument name="backgroundSize" defaultValue="PageBuilderBackgroundSize_Default"/>
35+
<argument name="backgroundRepeat" defaultValue="PageBuilderBackgroundRepeat_Default"/>
36+
<argument name="backgroundAttachment" defaultValue="PageBuilderBackgroundAttachment_Default"/>
37+
<argument name="index" defaultValue="1" type="string"/>
38+
</arguments>
39+
<comment userInput="validateBackgroundAttributesWithNoColor" stepKey="comment"/>
40+
<waitForElementVisible selector="{{section.base(index)}}" stepKey="waitForBaseElement"/>
41+
<waitForElementVisible selector="{{section.noBackgroundColor(index)}}" stepKey="waitForBackgroundColor"/>
42+
<waitForElementVisible selector="{{section.backgroundImage(index, backgroundImage.fileName)}}" stepKey="waitForBackgroundImage"/>
43+
<waitForElementVisible selector="{{section.backgroundPosition(index, backgroundPosition.styleValue)}}" stepKey="waitForBackgroundPosition"/>
44+
<waitForElementVisible selector="{{section.backgroundSize(index, backgroundSize.value)}}" stepKey="waitForBackgroundSize"/>
45+
<waitForElementVisible selector="{{section.backgroundRepeat(index, backgroundRepeat.styleValue)}}" stepKey="waitForBackgroundRepeat"/>
46+
<waitForElementVisible selector="{{section.backgroundAttachment(index, backgroundAttachment.value)}}" stepKey="waitForBackgroundAttachment"/>
47+
</actionGroup>
48+
<actionGroup name="validateBackgroundAttributesWithNoImage">
49+
<arguments>
50+
<argument name="section"/>
51+
<argument name="backgroundColor"/>
52+
<argument name="backgroundPosition" defaultValue="PageBuilderBackgroundPosition_Default"/>
53+
<argument name="backgroundSize" defaultValue="PageBuilderBackgroundSize_Default"/>
54+
<argument name="backgroundRepeat" defaultValue="PageBuilderBackgroundRepeat_Default"/>
55+
<argument name="backgroundAttachment" defaultValue="PageBuilderBackgroundAttachment_Default"/>
56+
<argument name="index" defaultValue="1" type="string"/>
57+
</arguments>
58+
<comment userInput="validateBackgroundAttributesWithNoImage" stepKey="comment"/>
59+
<waitForElementVisible selector="{{section.base(index)}}" stepKey="waitForBaseElement"/>
60+
<waitForElementVisible selector="{{section.backgroundColor(index, backgroundColor.rgb)}}" stepKey="waitForBackgroundColor"/>
61+
<waitForElementVisible selector="{{section.backgroundPosition(index, backgroundPosition.styleValue)}}" stepKey="waitForBackgroundPosition"/>
62+
<waitForElementVisible selector="{{section.backgroundSize(index, backgroundSize.value)}}" stepKey="waitForBackgroundSize"/>
63+
<waitForElementVisible selector="{{section.backgroundRepeat(index, backgroundRepeat.styleValue)}}" stepKey="waitForBackgroundRepeat"/>
64+
<waitForElementVisible selector="{{section.backgroundAttachment(index, backgroundAttachment.value)}}" stepKey="waitForBackgroundAttachment"/>
65+
</actionGroup>
66+
<actionGroup name="validateBackgroundImage">
67+
<arguments>
68+
<argument name="section"/>
69+
<argument name="pageNamePrefix" defaultValue="admin" type="string"/>
70+
<argument name="backgroundImage"/>
71+
<argument name="index" defaultValue="1" type="string"/>
72+
</arguments>
73+
<comment userInput="validateBackgroundImage" stepKey="comment"/>
74+
<waitForElementVisible selector="{{section.base(index)}}" stepKey="waitForBaseElement"/>
75+
<waitForElementVisible selector="{{section.backgroundImage(index, backgroundImage.fileName)}}" stepKey="waitForBackgroundImage"/>
76+
<grabAttributeFrom selector="{{section.backgroundImage(index, backgroundImage.fileName)}}" userInput="style" stepKey="contentTypeStyle"/>
77+
<!-- Grab base URL -->
78+
<executeJS function="return '{{pageNamePrefix}}'" stepKey="pageNamePrefix"/>
79+
<grabFromCurrentUrl regex="/(^.+(?=\/$pageNamePrefix))/" stepKey="baseURL"/>
80+
<!-- Return the string value of background-image -->
81+
<executeJS function="return '$contentTypeStyle'.match(/((?&lt;=(background-image: url\((&quot;|\'))).+(?=(&quot;|\')\);))/)[0]" stepKey="backgroundImageValue"/>
82+
<!-- Convert all characters in string variables to regex friendly strings -->
83+
<executeJS function="return '$baseURL'.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\\\^\\$\|]/g, '\\\\$&amp;')" stepKey="regexBaseURL"/>
84+
<executeJS function="return '{{backgroundImage.path}}'.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\\\^\\$\|]/g, '\\\\$&amp;')" stepKey="regexFilePath"/>
85+
<assertRegExp stepKey="assertBackgroundImageContainsFileInformation">
86+
<expectedResult type="string">/{$regexBaseURL}\/pub\/media.*{$regexFilePath}\/{{backgroundImage.fileName}}(_\d+)?\.{{backgroundImage.extension}}/</expectedResult>
87+
<actualResult type="variable">$backgroundImageValue</actualResult>
88+
</assertRegExp>
89+
</actionGroup>
90+
<actionGroup name="validateBackgroundMobileImage">
91+
<arguments>
92+
<argument name="section"/>
93+
<argument name="pageNamePrefix" type="string"/>
94+
<argument name="backgroundMobileImage"/>
95+
<argument name="index" defaultValue="1" type="string"/>
96+
</arguments>
97+
<comment userInput="validateBackgroundMobileImage" stepKey="comment"/>
98+
<waitForElementVisible selector="{{section.base(index)}}" stepKey="waitForBaseElement"/>
99+
<waitForElement selector="{{section.backgroundMobileImage(index, backgroundMobileImage.fileName)}}" stepKey="waitForBackgroundMobileImage"/>
100+
<dontSeeElement selector="{{section.backgroundMobileImage(index, backgroundMobileImage.fileName)}}" stepKey="dontSeeBackgroundMobileImage"/>
101+
<grabAttributeFrom selector="{{section.backgroundMobileImage(index, backgroundMobileImage.fileName)}}" userInput="style" stepKey="contentTypeStyle"/>
102+
<!-- Grab base URL -->
103+
<executeJS function="return '{{pageNamePrefix}}'" stepKey="pageNamePrefix"/>
104+
<grabFromCurrentUrl regex="/(^.+(?=\/$pageNamePrefix))/" stepKey="baseURL"/>
105+
<!-- Return the string value of background-image -->
106+
<executeJS function="return '$contentTypeStyle'.match(/((?&lt;=(background-image: url\((&quot;|\'))).+(?=(&quot;|\')\);))/)[0]" stepKey="backgroundMobileImageValue"/>
107+
<!-- Convert all characters in string variables to regex friendly strings -->
108+
<executeJS function="return '$baseURL'.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\\\^\\$\|]/g, '\\\\$&amp;')" stepKey="regexBaseURL"/>
109+
<executeJS function="return '{{backgroundMobileImage.path}}'.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\\\^\\$\|]/g, '\\\\$&amp;')" stepKey="regexFilePath"/>
110+
<assertRegExp stepKey="assertBackgroundMobileImageContainsFileInformation">
111+
<expectedResult type="string">/{$regexBaseURL}\/pub\/media.*{$regexFilePath}\/{{backgroundMobileImage.fileName}}(_\d+)?\.{{backgroundMobileImage.extension}}/</expectedResult>
112+
<actualResult type="variable">$backgroundMobileImageValue</actualResult>
113+
</assertRegExp>
114+
<resizeWindow width="767" height="1000" stepKey="resizeWindowToMobile"/>
115+
<waitForElementVisible selector="{{section.backgroundMobileImage(index, backgroundMobileImage.fileName)}}" stepKey="waitForBackgroundMobileImageVisible"/>
116+
<resizeWindow width="1280" height="1024" stepKey="resizeWindowToDesktop"/>
117+
</actionGroup>
118+
</actionGroups>

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

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,9 +21,11 @@
2121
<arguments>
2222
<argument name="contentType"/>
2323
<argument name="section"/>
24+
<argument name="offsetXCoordinate" defaultValue="null" type="string"/>
25+
<argument name="offsetYCoordinate" defaultValue="null" type="string"/>
2426
</arguments>
2527
<comment userInput="Hover uploaded image to check Upload New Image button and Select From Gallery button" stepKey="commentHover"/>
26-
<moveMouseOver selector="{{PageBuilderActionsSection.contentTypeInStage(contentType.role)}}" x="10" y="0" stepKey="onMouseOverBannerContentTypeStage"/>
28+
<moveMouseOver selector="{{PageBuilderActionsSection.contentTypeInStage(contentType.role)}}" x="{{offsetXCoordinate}}" y="{{offsetYCoordinate}}" stepKey="onMouseOverBannerContentTypeStage"/>
2729
<waitForElementVisible selector="{{section.uploadNewImageBtn}}" stepKey="waitForUploadNewImageBtn" />
2830
<waitForElementVisible selector="{{section.selectFromGalleryImageBtn}}" stepKey="seeSelectFromGalleryBtn2" />
2931
</actionGroup>

0 commit comments

Comments
 (0)