Skip to content

Commit 5daed7e

Browse files
committed
MC-5432: Right/Left Margin Not Working For Content Types
- add mftf test to check row contained appearance width in block
1 parent b33414f commit 5daed7e

File tree

4 files changed

+175
-0
lines changed

4 files changed

+175
-0
lines changed
Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
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="urn:magento:mftf:Test/etc/actionGroupSchema.xsd">
11+
<!-- Element Position -->
12+
<actionGroup name="validatePositionRightWithinContainer">
13+
<arguments>
14+
<argument name="content" type="string"/>
15+
<argument name="contentMargins" defaultValue="PageBuilderMarginsPropertyDefault"/>
16+
<argument name="container" type="string"/>
17+
<argument name="containerBorder" defaultValue="PageBuilderAdvancedBorderWidthProperty0"/>
18+
<argument name="containerPadding" defaultValue="PageBuilderPaddingPropertyDefault"/>
19+
<argument name="index" defaultValue="1" type="string"/>
20+
<argument name="pixelBuffer" defaultValue="5" type="string"/>
21+
</arguments>
22+
<!-- Validate right edge of content is within parent -->
23+
<comment userInput="Validate right edge of content is within parent" stepKey="commentValidateRightEdgeOfContentIsWithinParent"/>
24+
<executeJS function="return document.querySelectorAll('{{content}}')[{{index}}-1].getBoundingClientRect().right+{{contentMargins.marginRight}}" stepKey="contentRightPosition"/>
25+
<executeJS function="return document.querySelectorAll('{{container}}')[{{index}}-1].getBoundingClientRect().right-{{containerPadding.paddingRight}}-{{containerBorder.value}}" stepKey="parentRightPosition"/>
26+
<executeJS function="return Math.round({$parentRightPosition}-{$contentRightPosition})" stepKey="rightPositionDifference"/>
27+
<assertLessThanOrEqual stepKey="assertRightPositionDifference">
28+
<expectedResult type="int">{{pixelBuffer}}</expectedResult>
29+
<actualResult type="variable">rightPositionDifference</actualResult>
30+
</assertLessThanOrEqual>
31+
<assertGreaterThanOrEqual stepKey="assertRightPositionIsGreaterThanZero">
32+
<expectedResult type="int">0</expectedResult>
33+
<actualResult type="variable">rightPositionDifference</actualResult>
34+
</assertGreaterThanOrEqual>
35+
</actionGroup>
36+
<!-- Element Size -->
37+
<actionGroup name="validateContentWidthEqualToContainerWidth">
38+
<arguments>
39+
<argument name="content" type="string"/>
40+
<argument name="contentIndex" defaultValue="1" type="string"/>
41+
<argument name="contentMargins" defaultValue="PageBuilderMarginsPropertyDefault"/>
42+
<argument name="container" type="string"/>
43+
<argument name="containerBorder" defaultValue="PageBuilderAdvancedBorderWidthProperty0"/>
44+
<argument name="containerIndex" defaultValue="1" type="string"/>
45+
<argument name="containerPadding" defaultValue="PageBuilderPaddingPropertyDefault"/>
46+
<argument name="pixelBuffer" defaultValue="5" type="string"/>
47+
</arguments>
48+
<!-- Validate width of content and width of container are equal -->
49+
<comment userInput="Validate width of content and width of container are equal" stepKey="commentValidateWidthOfContentAndWidthOfContainerAreEqual"/>
50+
<executeJS function="return document.querySelectorAll('{{content}}')[{{contentIndex}}-1].getBoundingClientRect().width+{{contentMargins.marginLeft}}+{{contentMargins.marginRight}}" stepKey="contentWidth"/>
51+
<executeJS function="return document.querySelectorAll('{{container}}')[{{containerIndex}}-1].getBoundingClientRect().width-{{containerPadding.paddingLeft}}-{{containerPadding.paddingRight}}-({{containerBorder.value}}*2)" stepKey="parentWidth"/>
52+
<executeJS function="return Math.round(Math.abs({$contentWidth}-{$parentWidth}))" stepKey="widthDifference"/>
53+
<assertLessThanOrEqual stepKey="assertWidthDifference">
54+
<expectedResult type="int">{{pixelBuffer}}</expectedResult>
55+
<actualResult type="variable">widthDifference</actualResult>
56+
</assertLessThanOrEqual>
57+
</actionGroup>
58+
</actionGroups>

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

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@
1313
<element name="baseJS" type="button" selector="document.querySelectorAll('[data-role=banner] div.pagebuilder-banner-wrapper')[{{arg1}} - 1]" parameterized="true"/>
1414
<element name="hidden" type="button" selector="(//div[@data-role='banner'])[{{arg1}}][contains(@style, 'display: none')]" parameterized="true"/>
1515
<element name="notHidden" type="button" selector="(//div[@data-role='banner'])[{{arg1}}][not(contains(@style, 'display: none'))]" parameterized="true"/>
16+
<element name="appearancePosterCSS" type="button" selector="[data-role=banner][data-appearance=poster]"/>
1617
<element name="wrapperJS" type="button" selector="document.querySelectorAll('[data-role=banner] div.pagebuilder-banner-wrapper')[{{arg1}} - 1]" parameterized="true"/>
1718
<element name="overlay" type="button" selector="(//div[@data-role='banner'])[{{arg1}}]//div[@data-element='overlay']" parameterized="true"/>
1819
<element name="overlayJS" type="button" selector="document.querySelectorAll('[data-role=banner] div.pagebuilder-overlay')[{{arg1}} - 1]" parameterized="true"/>

app/code/Magento/PageBuilder/Test/Mftf/Section/PageBuilderRowSection.xml

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -83,6 +83,7 @@
8383
<element name="rowWidthJS" type="text" selector="document.querySelectorAll('[data-appearance=\'{{arg1}}\']')[{{arg2}}].clientWidth" parameterized="true"/>
8484
<element name="rowH2ChildWidthJS" type="text" selector="document.querySelectorAll('div[data-appearance~=\'{{arg1}}\'] h2')[{{arg2}}].clientWidth" parameterized="true"/>
8585
<element name="appearance" type="text" selector="(//div[@data-role='row'])[{{arg1}}][@data-appearance='{{arg2}}']" parameterized="true"/>
86+
<element name="appearanceContainedCSS" type="text" selector="[data-role=row][data-appearance=contained]"/>
8687
<!-- Background Configuration -->
8788
<element name="backgroundColor" type="button" selector="(//div[@data-role='row'])[{{arg1}}]/div[contains(@style,'background-color: {{arg2}};')]" parameterized="true"/>
8889
<element name="noBackgroundColor" type="button" selector="(//div[@data-role='row'])[{{arg1}}]/div[not(contains(@style,'background-color:'))]" parameterized="true"/>

app/code/Magento/PageBuilder/Test/Mftf/Test/AdminPageBuilderBlockTest.xml

Lines changed: 115 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1311,6 +1311,121 @@
13111311
<argument name="storefrontBugOffset" value="20"/>
13121312
</actionGroup>
13131313
</test>
1314+
<test name="BlockRowContainedAppearanceHasEqualWidthToContents">
1315+
<annotations>
1316+
<features value="PageBuilder"/>
1317+
<stories value="Block"/>
1318+
<title value="Row contained appearance has equal width to contents in Block"/>
1319+
<description value="A user can see a row contained appearance has equal width to contents in a Block"/>
1320+
<severity value="MAJOR"/>
1321+
<useCaseId value="MC-5432"/>
1322+
<testCaseId value="MC-5958"/>
1323+
<group value="pagebuilder"/>
1324+
<group value="pagebuilder-block"/>
1325+
<group value="pagebuilder-row"/>
1326+
<group value="pagebuilder-banner"/>
1327+
<group value="pagebuilder-bannerPoster"/>
1328+
</annotations>
1329+
<before>
1330+
<actionGroup ref="LoginAsAdmin" stepKey="loginAsAdmin" />
1331+
<createData entity="_defaultBlock" stepKey="createPreReqBlock" />
1332+
<actionGroup ref="navigateToCreatedCMSBlockPage" stepKey="navigateToCreatedCMSBlockPage">
1333+
<argument name="CMSBlockPage" value="$$createPreReqBlock$$" />
1334+
</actionGroup>
1335+
</before>
1336+
<after>
1337+
<deleteData createDataKey="createPreReqBlock" stepKey="deletePreReqBlock" />
1338+
<actionGroup ref="logout" stepKey="logout"/>
1339+
</after>
1340+
<!-- Edit Block and configure Row -->
1341+
<comment userInput="Edit Block and configure Row" stepKey="commentConfigureRowInBlock"/>
1342+
<actionGroup ref="openPageBuilderEditPanel" stepKey="openEditMenuOnStage">
1343+
<argument name="contentType" value="PageBuilderRowContentType"/>
1344+
</actionGroup>
1345+
<actionGroup ref="chooseVisualSelectOption" stepKey="enterAppearanceRow1">
1346+
<argument name="property" value="PageBuilderRowAppearance_Contained"/>
1347+
</actionGroup>
1348+
<actionGroup ref="saveEditPanelSettings" stepKey="saveEditPanelSettingsInBlock"/>
1349+
<!-- Edit Block and configure Banner -->
1350+
<comment userInput="Edit Block and configure Banner" stepKey="commentConfigureBannerInBlock"/>
1351+
<actionGroup ref="expandPageBuilderPanelGroup" stepKey="expandGroupElements">
1352+
<argument name="group" value="PageBuilderBannerContentType"/>
1353+
</actionGroup>
1354+
<actionGroup ref="dragContentTypeToContainer" stepKey="dragIntoStage">
1355+
<argument name="contentType" value="PageBuilderBannerContentType"/>
1356+
<argument name="containerTargetType" value="PageBuilderRowContentType"/>
1357+
</actionGroup>
1358+
<actionGroup ref="openPageBuilderEditPanel" stepKey="openEditMenuOnStage2">
1359+
<argument name="contentType" value="PageBuilderBannerContentType"/>
1360+
</actionGroup>
1361+
<actionGroup ref="chooseVisualSelectOption" stepKey="enterAppearanceProperty">
1362+
<argument name="property" value="PageBuilderAppearance_Poster"/>
1363+
</actionGroup>
1364+
<actionGroup ref="fillSlideOutPanelFieldGeneral" stepKey="enterBannerMinHeight">
1365+
<argument name="property" value="PageBuilderBannerMinimumHeightProperty"/>
1366+
</actionGroup>
1367+
<actionGroup ref="attachFileSlideOutProperty" stepKey="attachImage">
1368+
<argument name="property" value="PageBuilderBackgroundImage_JPG"/>
1369+
</actionGroup>
1370+
<actionGroup ref="chooseVisualSelectOption" stepKey="selectBackgroundSize">
1371+
<argument name="property" value="PageBuilderBackgroundSize_Contain"/>
1372+
</actionGroup>
1373+
<actionGroup ref="saveEditPanelSettings" stepKey="saveEditPanelSettingsInBlock2"/>
1374+
<click selector="{{CmsNewBlockBlockActionsSection.savePage}}" stepKey="saveBlock"/>
1375+
<waitForPageLoad time="30" stepKey="waitForStageToLoad"/>
1376+
<actionGroup ref="navigateToAPageWithPageBuilder" stepKey="navigateToAPageWithPageBuilder"/>
1377+
<actionGroup ref="switchToPageBuilderStage" stepKey="switchToPageBuilderStage"/>
1378+
<!-- Go to CMS page and choose Block -->
1379+
<comment userInput="Go to CMS page and choose Block" stepKey="commentGoToCMSPage"/>
1380+
<actionGroup ref="addPageBuilderPageTitle" stepKey="enterPageTitle1">
1381+
<argument name="contentType" value="PageBuilderBlockContentType"/>
1382+
</actionGroup>
1383+
<actionGroup ref="expandPageBuilderPanelGroup" stepKey="expandGroupAddContent">
1384+
<argument name="group" value="PageBuilderBlockContentType"/>
1385+
</actionGroup>
1386+
<actionGroup ref="dragContentTypeToStage" stepKey="dragBlockIntoStage">
1387+
<argument name="contentType" value="PageBuilderBlockContentType"/>
1388+
</actionGroup>
1389+
<actionGroup ref="openPageBuilderEditPanel" stepKey="openEditAfterDrop">
1390+
<argument name="contentType" value="PageBuilderBlockContentType"/>
1391+
</actionGroup>
1392+
<actionGroup ref="searchBlockInGrid" stepKey="searchBlockInGrid">
1393+
<argument name="block" value="$$createPreReqBlock$$"/>
1394+
</actionGroup>
1395+
<actionGroup ref="saveEditPanelSettings" stepKey="saveEditPanelSettings"/>
1396+
<!-- Validate width before save -->
1397+
<comment userInput="Validate width before save" stepKey="commentValidateBeforeSave"/>
1398+
<actionGroup ref="validateContentWidthEqualToContainerWidth" stepKey="validateContentWidthEqualToContainerWidthBeforeSave">
1399+
<argument name="content" value="{{BannerOnFrontend.appearancePosterCSS}}"/>
1400+
<argument name="contentIndex" value="1"/>
1401+
<argument name="container" value="{{RowOnStorefront.appearanceContainedCSS}}"/>
1402+
<argument name="containerIndex" value="2"/>
1403+
<argument name="containerPadding" value="PageBuilderPaddingPropertyRowDefault"/>
1404+
</actionGroup>
1405+
<actionGroup ref="saveAndContinueEditCmsPage" stepKey="saveAndContinueEditCmsPage"/>
1406+
<actionGroup ref="switchToPageBuilderStage" stepKey="switchToPageBuilderStage2"/>
1407+
<!-- Validate width after save -->
1408+
<comment userInput="Validate width after save" stepKey="commentValidateAfterSave"/>
1409+
<actionGroup ref="validateContentWidthEqualToContainerWidth" stepKey="validateContentWidthEqualToContainerWidthAfterSave">
1410+
<argument name="content" value="{{BannerOnFrontend.appearancePosterCSS}}"/>
1411+
<argument name="contentIndex" value="1"/>
1412+
<argument name="container" value="{{RowOnStorefront.appearanceContainedCSS}}"/>
1413+
<argument name="containerIndex" value="2"/>
1414+
<argument name="containerPadding" value="PageBuilderPaddingPropertyRowDefault"/>
1415+
</actionGroup>
1416+
<actionGroup ref="navigateToStoreFront" stepKey="navigateToStoreFront">
1417+
<argument name="contentType" value="PageBuilderBlockContentType"/>
1418+
</actionGroup>
1419+
<!-- Validate width storefront -->
1420+
<comment userInput="Validate width storefront" stepKey="commentValidateStorefront"/>
1421+
<actionGroup ref="validateContentWidthEqualToContainerWidth" stepKey="validateContentWidthEqualToContainerWidthStorefront">
1422+
<argument name="content" value="{{BannerOnFrontend.appearancePosterCSS}}"/>
1423+
<argument name="contentIndex" value="1"/>
1424+
<argument name="container" value="{{RowOnStorefront.appearanceContainedCSS}}"/>
1425+
<argument name="containerIndex" value="2"/>
1426+
<argument name="containerPadding" value="PageBuilderPaddingPropertyRowDefault"/>
1427+
</actionGroup>
1428+
</test>
13141429
<test name="BlockBannerPosterContentCanWordWrap">
13151430
<annotations>
13161431
<features value="PageBuilder"/>

0 commit comments

Comments
 (0)