Skip to content

Commit 0bc05da

Browse files
hannahnidahannahnida
committed
#628: Page Builder Wysiwyg Editor Element blocks view to content area - Added changes to new Mftf test
1 parent aafd943 commit 0bc05da

File tree

2 files changed

+51
-6
lines changed

2 files changed

+51
-6
lines changed

‎app/code/Magento/PageBuilder/Test/Mftf/Section/PageBuilderWYSIWYGSection/WYSIWYGOnPageBuilderInlineSection.xml

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@
99
xsi:noNamespaceSchemaLocation="urn:magento:mftf:Page/etc/SectionObject.xsd">
1010
<section name="WYSIWYGOnPageBuilderInline">
1111
<element name="toolbar" type="button" selector=".mce-tinymce.mce-tinymce-inline"/>
12+
<element name="toolbarPath" type="text" selector="(//div[contains(@class,'pagebuilder-text')])[{{arg}}]//div[contains(@class, 'mce-tinymce-inline')]" parameterized="true"/>
1213
<element name="inlineCss" type="button" selector=".mce-tinymce.mce-tinymce-inline"/>
1314
<element name="notCss" type="button" selector=".mce-tinymce:not(.mce-tinymce-inline)"/>
1415
<element name="undo" type="button" selector=".mce-tinymce-inline div[aria-label='Undo']"/>
@@ -32,6 +33,7 @@
3233
<element name="tableMenuFirstItem" type="text" selector="(//i[contains(@class, 'mce-i-table')])[{{arg1}}]" parameterized="true"/>
3334
<element name="tableGrid" type="text" selector="//a[@data-mce-x={{arg1}}][@data-mce-y={{arg2}}]" parameterized="true"/>
3435
<element name="tableToolbar" type="text" selector=".mce-tinymce-inline.mce-arrow.mce-container.mce-floatpanel[aria-label='Inline toolbar']"/>
36+
<element name="insertRowAfterButton" type="text" selector="div[aria-label='Insert row after'] button"/>
3537
<element name="specialCharacter" type="button" selector=".mce-tinymce-inline div[aria-label='Special character']"/>
3638
<element name="insertWidget" type="button" selector=".mce-tinymce-inline div[aria-label='Insert Widget']"/>
3739
<element name="insertVariable" type="button" selector=".mce-tinymce-inline div[aria-label='Insert Variable']"/>

‎app/code/Magento/PageBuilder/Test/Mftf/Test/AdminPageBuilderTextTest/TextVerifyTinyMCE4TableToolbarOnPageBuilderStageTest.xml

Lines changed: 49 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -18,13 +18,14 @@
1818
<group value="pagebuilder-tinyMCE"/>
1919
</annotations>
2020
<before>
21+
<magentoCLI command="config:set cms/wysiwyg/enabled enabled" stepKey="enableWYSIWYG"/>
22+
<magentoCLI command="cache:clean config" stepKey="flushCache"/>
2123
<actionGroup ref="AdminLoginActionGroup" stepKey="loginAsAdmin"/>
22-
<magentoCLI command="config:set cms/wysiwyg/editor mage/adminhtml/wysiwyg/tiny_mce/tinymce4Adapter" stepKey="switchToTinyMCE4"/>
23-
<actionGroup ref="navigateToAPageWithPageBuilder" stepKey="navigateToAPageWithPageBuilder"/>
2424
</before>
2525
<after>
2626
<actionGroup ref="AdminLogoutActionGroup" stepKey="logout"/>
2727
</after>
28+
<actionGroup ref="navigateToAPageWithPageBuilder" stepKey="navigateToAPageWithPageBuilder"/>
2829
<actionGroup ref="switchToPageBuilderStage" stepKey="switchToPageBuilderStage"/>
2930
<actionGroup ref="dragContentTypeToStage" stepKey="dragRowToRootContainer">
3031
<argument name="contentType" value="PageBuilderColumnContentType"/>
@@ -39,6 +40,7 @@
3940
<actionGroup ref="dragContentTypeToStage" stepKey="dragTextToColumnContentType">
4041
<argument name="contentType" value="PageBuilderTextContentType"/>
4142
<argument name="containerTargetType" value="PageBuilderColumnContentType"/>
43+
<argument name="containerTargetIndex" value="2"/>
4244
</actionGroup>
4345
<!-- Add table to Text Editor -->
4446
<clickWithLeftButton x="10" y="10" selector="{{TextOnStage.tinymce('1')}}" stepKey="focusOnTextEditorArea"/>
@@ -53,11 +55,52 @@
5355
<seeElement selector="{{TextOnStage.elementInText('1', 'td', '7')}}" stepKey="see7TableTd"/>
5456
<dontSeeElement selector="{{TextOnStage.elementInText('1', 'td', '8')}}" stepKey="dontSeeMoreThan7TableTr"/>
5557
<!-- Validate that textarea is visible -->
56-
58+
<seeElement selector="{{TextOnStage.tinymceInFocus('1')}}" stepKey="seeFocusedTinyMCE"/>
59+
<seeElement selector="{{WYSIWYGOnPageBuilderInline.tableToolbar}}" stepKey="seeTableToolbar"/>
60+
<executeJS function="return document.querySelector(&quot;{{WYSIWYGOnPageBuilderInline.tableToolbar}}&quot;).getBoundingClientRect().top" stepKey="grabTableToolbarTopPosition"/>
61+
<executeJS function="return document.evaluate(&quot;{{WYSIWYGOnPageBuilderInline.toolbarPath('1')}}&quot;, document.body).iterateNext().getBoundingClientRect().top" stepKey="grabToolbarTopPosition"/>
62+
<executeJS function="return Math.abs({$grabTableToolbarTopPosition} - {$grabToolbarTopPosition})" stepKey="topPositionDifference"/>
63+
<assertLessThanOrEqual stepKey="assertTopPositionDifference">
64+
<expectedResult type="int">2</expectedResult>
65+
<actualResult type="variable">topPositionDifference</actualResult>
66+
</assertLessThanOrEqual>
67+
<!-- Add new rows to table and verify that toolbar and textarea changed their position -->
68+
<waitForElementVisible selector="{{WYSIWYGOnPageBuilderInline.insertRowAfterButton}}" stepKey="waitForInsertRowButton"/>
69+
<click selector="{{WYSIWYGOnPageBuilderInline.insertRowAfterButton}}" stepKey="clickInsertRowButton"/>
70+
<waitForElementVisible selector="{{TextOnStage.elementInText('1', 'tr', '2')}}" stepKey="waitForTableSecondRow"/>
71+
<executeJS function="return document.querySelector(&quot;{{WYSIWYGOnPageBuilderInline.tableToolbar}}&quot;).getBoundingClientRect().top" stepKey="grabTableToolbarTopPosition2"/>
72+
<executeJS function="return document.evaluate(&quot;{{WYSIWYGOnPageBuilderInline.toolbarPath('1')}}&quot;, document.body).iterateNext().getBoundingClientRect().top" stepKey="grabToolbarTopPosition2"/>
73+
<executeJS function="return Math.abs({$grabTableToolbarTopPosition} - {$grabToolbarTopPosition})" stepKey="topPositionDifference2"/>
74+
<assertLessThanOrEqual stepKey="assertTopPositionDifference2">
75+
<expectedResult type="int">2</expectedResult>
76+
<actualResult type="variable">topPositionDifference2</actualResult>
77+
</assertLessThanOrEqual>
5778
<!-- Resize column to 4/12 and check toolbar position -->
58-
79+
<click selector="{{PageBuilderPanel.searchPanel}}" stepKey="unFocusEditor"/>
80+
<actionGroup ref="duplicateContentType" stepKey="duplicateColumnContentType">
81+
<argument name="contentType" value="PageBuilderColumnContentType"/>
82+
</actionGroup>
83+
<actionGroup ref="removeContentTypeFromStageByIndex" stepKey="removeColumnContentTypeFromStage">
84+
<argument name="contentType" value="PageBuilderColumnContentType"/>
85+
<argument name="contentTypeNumber" value="2"/>
86+
</actionGroup>
87+
<executeJS function="return document.querySelector(&quot;{{WYSIWYGOnPageBuilderInline.tableToolbar}}&quot;).getBoundingClientRect().top" stepKey="grabTableToolbarTopPosition3"/>
88+
<executeJS function="return document.evaluate(&quot;{{WYSIWYGOnPageBuilderInline.toolbarPath('1')}}&quot;, document.body).iterateNext().getBoundingClientRect().top" stepKey="grabToolbarTopPosition3"/>
89+
<executeJS function="return Math.abs({$grabTableToolbarTopPosition} - {$grabToolbarTopPosition})" stepKey="topPositionDifference3"/>
90+
<assertLessThanOrEqual stepKey="assertTopPositionDifference3">
91+
<expectedResult type="int">2</expectedResult>
92+
<actualResult type="variable">topPositionDifference3</actualResult>
93+
</assertLessThanOrEqual>
5994
<!-- Resize column back to 3/12 and check toolbar and textarea are visible -->
60-
61-
95+
<executeJS function="return document.querySelector('{{ColumnOnBackend.columnResizeGridLine('1')}}').clientWidth" stepKey="guideWidth"/>
96+
<dragAndDrop selector1="{{ColumnOnBackend.columnX('1')}} {{ColumnOnBackend.columnResizeHandle}}" selector2="{{ColumnOnBackend.columnResizeGridLine('3')}}" x="$guideWidth" stepKey="dragColumn1"/>
97+
<waitForPageLoad stepKey="waitForDragAndDrop"/>
98+
<executeJS function="return document.querySelector(&quot;{{WYSIWYGOnPageBuilderInline.tableToolbar}}&quot;).getBoundingClientRect().top" stepKey="grabTableToolbarTopPosition4"/>
99+
<executeJS function="return document.evaluate(&quot;{{WYSIWYGOnPageBuilderInline.toolbarPath('1')}}&quot;, document.body).iterateNext().getBoundingClientRect().top" stepKey="grabToolbarTopPosition4"/>
100+
<executeJS function="return Math.abs({$grabTableToolbarTopPosition} - {$grabToolbarTopPosition})" stepKey="topPositionDifference4"/>
101+
<assertLessThanOrEqual stepKey="assertTopPositionDifference4">
102+
<expectedResult type="int">2</expectedResult>
103+
<actualResult type="variable">topPositionDifference4</actualResult>
104+
</assertLessThanOrEqual>
62105
</test>
63106
</tests>

0 commit comments

Comments
 (0)