Skip to content

Commit 1e2993c

Browse files
anthoulaanthoula
committed
MC-4965: Text Wrapping Inside Inline WYSIWYG Editors Will Break On Words (Storefront as well for Slide & Banner)
- add new test for banner poster content word wrap - add new test for banner collage left content word wrap
1 parent ecedef1 commit 1e2993c

File tree

5 files changed

+122
-0
lines changed

5 files changed

+122
-0
lines changed

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

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -161,4 +161,19 @@
161161
<actualResult type="variable">textareaValue</actualResult>
162162
</assertEquals>
163163
</actionGroup>
164+
<actionGroup name="validateContentWordWrap">
165+
<arguments>
166+
<argument name="page"/>
167+
<argument name="height" type="string"/>
168+
<argument name="index" defaultValue="1" type="string"/>
169+
</arguments>
170+
<!-- Validate content height -->
171+
<comment userInput="Validate content height" stepKey="commentValidateContentHeight"/>
172+
<executeJS function="return {{page.contentJS(index)}}.getBoundingClientRect().height" stepKey="elHeight"/>
173+
<executeJS function="return Math.round(({$elHeight}/{{height}})*100)/100" stepKey="contentHeightRatio"/>
174+
<assertEquals stepKey="assertContentHeightRatio">
175+
<expectedResult type="int">1</expectedResult>
176+
<actualResult type="variable">contentHeightRatio</actualResult>
177+
</assertEquals>
178+
</actionGroup>
164179
</actionGroups>

‎app/code/Magento/PageBuilder/Test/Mftf/Data/CommonContentTypeData.xml

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -113,4 +113,12 @@
113113
<data key="name">Box Shadow</data>
114114
<data key="value">rgb(153, 153, 153) 0px 0px 0px 1px</data>
115115
</entity>
116+
<!-- Message -->
117+
<entity name="PageBuilderMessageProperty_WordBreak" type="pagebuilder_message_property">
118+
<data key="name">Message Text</data>
119+
<data key="section">contents</data>
120+
<data key="role">textarea</data>
121+
<data key="fieldName">message</data>
122+
<data key="value">Magento1111111 Page11111111111</data>
123+
</entity>
116124
</entities>

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

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,7 @@
3131
<element name="backgroundImage" type="button" selector="(//div[@data-role='banner'])[{{arg1}}]//div[@data-element='wrapper'][contains(@style,'background-image: url(') and contains(@style,'{{arg2}}')]" parameterized="true"/>
3232
<element name="noBackgroundImage" type="button" selector="(//div[@data-role='banner'])[{{arg1}}]//div[@data-element='wrapper'][not(contains(@style,'background-image:'))]" parameterized="true"/>
3333
<!-- Content Configuration -->
34+
<element name="contentJS" type="text" selector="document.querySelectorAll('[data-role=banner] [data-element=content]')[{{arg1}} - 1]" parameterized="true"/>
3435
<element name="messageContent" type="text" selector="(//div[@data-role='banner'])[{{arg1}}]//div[@data-element='wrapper']//div[@data-element='content']//p[.='{{arg2}}']" parameterized="true"/>
3536
<element name="noMessageContent" type="text" selector="(//div[@data-role='banner'])[{{arg1}}]//div[@data-element='wrapper']//div[@data-element='content'][.='Edit Banner Text'][not(*)]" parameterized="true"/>
3637
<element name="messageContentTextArea" type="text" selector="(//div[@data-role='banner'])[{{arg1}}]//div[@data-element='wrapper']//div[@data-element='content'][.='{{arg2}}']" parameterized="true"/>
@@ -77,6 +78,7 @@
7778
<element name="variablePlaceholder" type="text" selector="(//div[contains(@class,'pagebuilder-banner')])[{{arg}}]//*[contains(@class, 'magento-variable magento-placeholder')]" parameterized="true"/>
7879
<element name="widgetPlaceholder" type="text" selector="(//div[contains(@class,'pagebuilder-banner')])[{{arg}}]//*[contains(@class, 'magento-placeholder magento-widget')]" parameterized="true"/>
7980
<element name="tinymce" type="text" selector="(//div[contains(@class,'pagebuilder-banner')])[{{arg}}]//div[contains(@class, 'inline-wysiwyg')]" parameterized="true"/>
81+
<element name="contentJS" type="text" selector="document.querySelectorAll('[data-role=banner] div.inline-wysiwyg')[{{arg1}} - 1]" parameterized="true"/>
8082
<!-- Appearance Configuration -->
8183
<element name="appearance" type="text" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{arg1}}][@data-appearance='{{arg2}}']" parameterized="true"/>
8284
<element name="posterMinimumHeight" type="text" selector="(//div[contains(@class,'pagebuilder-banner') and @data-element='main'])[{{arg1}}]//div[@data-element='overlay'][contains(@style,'min-height: {{arg2}}px;')]" parameterized="true"/>

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

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -305,6 +305,23 @@
305305
<argument name="pageNamePrefix" value="banner"/>
306306
</actionGroup>
307307
</test>
308+
<test name="BannerCollageLeftContentCanWordWrap" extends="BannerPosterContentCanWordWrap">
309+
<annotations>
310+
<features value="PageBuilder"/>
311+
<stories value="Banner"/>
312+
<title value="Collage Left - Banner content can wrap words to multiple lines"/>
313+
<description value="A user can see banner collage left content word wrap to multiple lines"/>
314+
<severity value="CRITICAL"/>
315+
<useCaseId value="MC-4965"/>
316+
<testCaseId value="MC-5632"/>
317+
<group value="pagebuilder"/>
318+
<group value="pagebuilder-banner"/>
319+
</annotations>
320+
<actionGroup ref="chooseVisualSelectOption" stepKey="enterAppearanceProperty">
321+
<argument name="property" value="PageBuilderAppearance_CollageLeft"/>
322+
</actionGroup>
323+
<dragAndDrop selector1="{{ColumnOnBackend.columnX('1')}} {{ColumnOnBackend.columnResizeHandle}}" selector2="{{ColumnOnBackend.columnResizeGridLine('6')}}" x="$guideWidth" stepKey="resizeColumn"/>
324+
</test>
308325
<test name="BannerCollageLeftButtonNeverShow">
309326
<annotations>
310327
<features value="PageBuilder"/>

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

Lines changed: 80 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -455,6 +455,86 @@
455455
<resizeWindow width="767" height="1000" stepKey="resizeWindowToMobile"/>
456456
<seeElement selector="{{BannerOnFrontend.wysiwygLinkUrl('1', ExternalLink.googleUrl)}}" stepKey="waitForBannerStorefrontMobile"/>
457457
</test>
458+
<test name="BannerPosterContentCanWordWrap">
459+
<annotations>
460+
<features value="PageBuilder"/>
461+
<stories value="Banner"/>
462+
<title value="Poster - Banner content can wrap words to multiple lines"/>
463+
<description value="A user can see banner poster content word wrap to multiple lines"/>
464+
<severity value="CRITICAL"/>
465+
<useCaseId value="MC-4965"/>
466+
<testCaseId value="MC-5631"/>
467+
<group value="pagebuilder"/>
468+
<group value="pagebuilder-banner"/>
469+
</annotations>
470+
<before>
471+
<resizeWindow width="1280" height="1024" stepKey="resetWindowToDesktopBefore"/>
472+
<actionGroup ref="LoginAsAdmin" stepKey="loginAsAdmin"/>
473+
<actionGroup ref="navigateToAPageWithPageBuilder" stepKey="navigateToAPageWithPageBuilder"/>
474+
<actionGroup ref="switchToPageBuilderStage" stepKey="switchToPageBuilderStage"/>
475+
</before>
476+
<after>
477+
<resizeWindow width="1280" height="1024" stepKey="resizeWindowToDesktopAfter"/>
478+
<actionGroup ref="logout" stepKey="logout"/>
479+
</after>
480+
<actionGroup ref="addPageBuilderPageTitle" stepKey="enterPageTitle">
481+
<argument name="contentType" value="PageBuilderBannerContentType"/>
482+
</actionGroup>
483+
<!-- Add Column to Stage -->
484+
<comment userInput="Add Column to Stage" stepKey="addColumnToStage"/>
485+
<actionGroup ref="dragContentTypeToStage" stepKey="dragColumnIntoStage">
486+
<argument name="contentType" value="PageBuilderColumnContentType"/>
487+
</actionGroup>
488+
<!-- Add content type to Column -->
489+
<comment userInput="Add content type to Column" stepKey="addContentTypeToColumn"/>
490+
<actionGroup ref="expandPageBuilderPanelGroup" stepKey="expandGroupElements">
491+
<argument name="group" value="PageBuilderBannerContentType"/>
492+
</actionGroup>
493+
<actionGroup ref="dragContentTypeToContainer" stepKey="dragIntoStage">
494+
<argument name="contentType" value="PageBuilderBannerContentType"/>
495+
<argument name="containerTargetType" value="PageBuilderColumnContentType"/>
496+
</actionGroup>
497+
<actionGroup ref="inlineEditWYSIWYGFromStage" stepKey="inlineEdit">
498+
<argument name="contentType" value="PageBuilderBannerContentType"/>
499+
<argument name="content" value="{{PageBuilderMessageProperty_WordBreak.value}}"/>
500+
</actionGroup>
501+
<actionGroup ref="openPageBuilderEditPanel" stepKey="openEditMenuOnStage">
502+
<argument name="contentType" value="PageBuilderBannerContentType"/>
503+
</actionGroup>
504+
<actionGroup ref="chooseVisualSelectOption" stepKey="enterAppearanceProperty">
505+
<argument name="property" value="PageBuilderAppearance_Poster"/>
506+
</actionGroup>
507+
<actionGroup ref="saveEditPanelSettings" stepKey="saveEditPanelSettings"/>
508+
<click selector="{{PageBuilderPanel.searchPanel}}" stepKey="unFocusEditor"/>
509+
<!-- Resize Columns -->
510+
<comment userInput="Resize Columns" stepKey="commentResizeColumns"/>
511+
<executeJS function="return document.querySelector('{{ColumnOnBackend.columnResizeGridLine('1')}}').clientWidth" stepKey="guideWidth"/>
512+
<dragAndDrop selector1="{{ColumnOnBackend.columnX('1')}} {{ColumnOnBackend.columnResizeHandle}}" selector2="{{ColumnOnBackend.columnResizeGridLine('3')}}" x="$guideWidth" stepKey="resizeColumn"/>
513+
<waitForPageLoad stepKey="waitForDragAndDrop"/>
514+
<!-- Validate Height Before Save -->
515+
<comment userInput="Validate Height Before Save" stepKey="commentValidateBeforeSave"/>
516+
<actionGroup ref="validateContentWordWrap" stepKey="validateContentWordWrapStage">
517+
<argument name="page" value="BannerOnBackend"/>
518+
<argument name="height" value="110"/>
519+
</actionGroup>
520+
<actionGroup ref="saveAndContinueEditCmsPage" stepKey="saveAndContinueEditCmsPage"/>
521+
<actionGroup ref="switchToPageBuilderStage" stepKey="switchToPageBuilderStage2"/>
522+
<!-- Validate Height After Save -->
523+
<comment userInput="Validate Height After Save" stepKey="commentValidateAfterSave"/>
524+
<actionGroup ref="validateContentWordWrap" stepKey="validateContentWordWrapAfterSave">
525+
<argument name="page" value="BannerOnBackend"/>
526+
<argument name="height" value="110"/>
527+
</actionGroup>
528+
<actionGroup ref="navigateToStoreFront" stepKey="navigateToStoreFront">
529+
<argument name="contentType" value="PageBuilderBannerContentType"/>
530+
</actionGroup>
531+
<!-- Validate Height Storefront -->
532+
<comment userInput="Validate Height Storefront" stepKey="commentValidateStorefront"/>
533+
<actionGroup ref="validateContentWordWrap" stepKey="validateContentWordWrapStorefront">
534+
<argument name="page" value="BannerOnFrontend"/>
535+
<argument name="height" value="50"/>
536+
</actionGroup>
537+
</test>
458538
<test name="BannerPosterButtonNeverShow">
459539
<annotations>
460540
<features value="PageBuilder"/>

0 commit comments

Comments
 (0)