Skip to content

Commit a81e6b1

Browse files
committed
PB-170: TinyMCE Performance is very poor with multiple instances on Stage
- Add partial selection test
1 parent 404efce commit a81e6b1

File tree

5 files changed

+136
-0
lines changed

5 files changed

+136
-0
lines changed

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

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -243,4 +243,15 @@
243243
<waitForPageLoad stepKey="waitForPageLoad1"/>
244244
<click selector="{{PageBuilderPanel.searchPanel}}" stepKey="loseFocusFromEditor"/>
245245
</actionGroup>
246+
<actionGroup name="formatTextInlineTinyMCE">
247+
<arguments>
248+
<!-- Receives pagebuilder_tinymce_format -->
249+
<argument name="format" defaultValue="TinyMCEFormatHeading1"/>
250+
</arguments>
251+
<waitForElementVisible selector="{{WYSIWYGOnPageBuilderInline.formatSelector}}" stepKey="waitForFormatList"/>
252+
<click selector="{{WYSIWYGOnPageBuilderInline.formatSelector}}" stepKey="expandFormatList"/>
253+
<waitForElementVisible selector="{{WYSIWYGOnPageBuilderInline.formatOption(format.label)}}" stepKey="waitForFormatVisible"/>
254+
<click selector="{{WYSIWYGOnPageBuilderInline.formatOption(format.label)}}" stepKey="clickFormat"/>
255+
<waitForElementNotVisible selector="{{WYSIWYGOnPageBuilderInline.formatOption(format.label)}}" stepKey="waitForFormatInvisible"/>
256+
</actionGroup>
246257
</actionGroups>

app/code/Magento/PageBuilder/Test/Mftf/Data/TextData.xml

Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,13 @@
1616
<data key="cmsPageLinkName" unique="suffix">cms-page-link-</data>
1717
<data key="value">test string</data>
1818
</entity>
19+
<entity name="PageBuilderTextHeadingProperty" type="pagebuilder_text_property">
20+
<data key="name">Text</data>
21+
<data key="section">General</data>
22+
<data key="fieldName">text</data>
23+
<data key="cmsPageLinkName" unique="suffix">cms-page-link-</data>
24+
<data key="value">This is a heading</data>
25+
</entity>
1926
<entity name="PageBuilderTextContentTypeDefault" type="pagebuilder_text_property">
2027
<data key="name">Text</data>
2128
<data key="section">General</data>
@@ -72,4 +79,49 @@
7279
<data key="expectedString1">test str</data>
7380
<data key="expectedString2">ing</data>
7481
</entity>
82+
<!-- TinyMCE Formats -->
83+
<entity name="TinyMCEFormatParagraph" type="pagebuilder_tinymce_format">
84+
<data key="label">Paragraph</data>
85+
<data key="tagName">p</data>
86+
</entity>
87+
<entity name="TinyMCEFormatHeading1" type="pagebuilder_tinymce_format">
88+
<data key="label">Heading 1</data>
89+
<data key="tagName">h1</data>
90+
</entity>
91+
<entity name="TinyMCEFormatHeading2" type="pagebuilder_tinymce_format">
92+
<data key="label">Heading 2</data>
93+
<data key="tagName">h2</data>
94+
</entity>
95+
<entity name="TinyMCEFormatHeading3" type="pagebuilder_tinymce_format">
96+
<data key="label">Heading 3</data>
97+
<data key="tagName">h3</data>
98+
</entity>
99+
<entity name="TinyMCEFormatHeading4" type="pagebuilder_tinymce_format">
100+
<data key="label">Heading 4</data>
101+
<data key="tagName">h4</data>
102+
</entity>
103+
<entity name="TinyMCEFormatHeading5" type="pagebuilder_tinymce_format">
104+
<data key="label">Heading 5</data>
105+
<data key="tagName">h5</data>
106+
</entity>
107+
<entity name="TinyMCEFormatHeading6" type="pagebuilder_tinymce_format">
108+
<data key="label">Heading 6</data>
109+
<data key="tagName">h6</data>
110+
</entity>
111+
<entity name="TinyMCEFormatImportant" type="pagebuilder_tinymce_format">
112+
<data key="label">Important</data>
113+
<data key="tagName">div</data>
114+
</entity>
115+
<entity name="TinyMCEFormatPreformatted" type="pagebuilder_tinymce_format">
116+
<data key="label">Preformatted</data>
117+
<data key="tagName">div</data>
118+
</entity>
119+
<!-- TinyMCE Selections -->
120+
<entity name="TinyMCEPartialHeadingSelection" type="pagebuilder_text_selection">
121+
<data key="startX">15</data>
122+
<data key="endX">115</data>
123+
<data key="startY">15</data>
124+
<data key="endY">15</data>
125+
<data key="selection">his is a h</data>
126+
</entity>
75127
</entities>

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

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,8 @@
1414
<element name="notHidden" type="text" selector="(//div[contains(@class,'pagebuilder-text')])[{{arg1}}]/parent::*[contains(@class, 'pagebuilder-content-type-wrapper') and not(contains(@class, 'pagebuilder-content-type-hidden'))][1]" parameterized="true"/>
1515
<element name="textAreaTextContains" type="text" selector="(//div[contains(@class,'pagebuilder-text')])[{{arg1}}]//textarea[contains(@value,'{{arg2}}')]" parameterized="true"/>
1616
<element name="text" type="text" selector="(//div[contains(@class,'pagebuilder-text')])[{{arg1}}]//*[contains(text(),'{{arg2}}')]" parameterized="true"/>
17+
<element name="textWithTag" type="text" selector="(//div[contains(@class,'pagebuilder-text')])[{{arg1}}]//{{tagName}}[contains(text(),'{{text}}')]" parameterized="true"/>
18+
<element name="elementInText" type="text" selector="(//div[contains(@class,'pagebuilder-text')])[{{arg1}}]//{{tagName}}[{{index}}]" parameterized="true"/>
1719
<element name="textAnchorText" type="text" selector="(//div[@data-content-type='text'])[{{arg1}}]//div[contains(@class,'inline-wysiwyg')]//a[text()='{{arg2}}']" parameterized="true"/>
1820
<element name="directive" type="text" selector="(//div[contains(@class,'pagebuilder-text')])[{{arg1}}]/div//span[contains(.,'{{arg2}}')]" parameterized="true"/>
1921
<element name="directiveFocused" type="text" selector="(//div[contains(@class,'pagebuilder-text')])[{{arg1}}]/div//span[contains(.,'{{arg2}}') and @data-mce-selected='1']" parameterized="true"/>

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

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -42,6 +42,7 @@
4242
<element name="imageSelector" type="button" selector=".mce-tinymce-inline div[aria-label='Insert/edit image']"/>
4343
<element name="imageSelectorBrowse" type="button" selector="div[aria-label='Insert/edit image'] i.mce-i-browse"/>
4444
<element name="imageSelectorOk" type="button" selector="//div[contains(@aria-label, 'Insert/edit image')]//span[contains(@class, 'mce-txt')][text()='Ok']"/>
45+
<element name="formatOption" type="text" selector="//div[contains(@class, 'mce-menu')]//span[contains(@class, 'mce-text') and text()='{{label}}']" parameterized="true"/>
4546
</section>
4647
<section name="MediaGallerySection">
4748
<!-- This goes in CE repo -->

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

Lines changed: 70 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3004,4 +3004,74 @@
30043004
</actionGroup>
30053005
<seeElement selector="{{TextOnStage.textAnchorText('1', PageBuilderTextProperty.value)}}" stepKey="seeAnchorInWysiwyg"/>
30063006
</test>
3007+
<test name="TextVerifySelectionInlineWYSIWYG">
3008+
<annotations>
3009+
<features value="PageBuilder"/>
3010+
<stories value="Text"/>
3011+
<title value="TinyMCE4 selection is preserved after initiation"/>
3012+
<description value="Verify that a users selection is not lost between select and initiation"/>
3013+
<severity value="MAJOR"/>
3014+
<useCaseId value=""/>
3015+
<testCaseId value=""/>
3016+
<!-- <group value="pagebuilder"/>-->
3017+
<group value="pagebuilder-text"/>
3018+
</annotations>
3019+
<before>
3020+
<createData entity="_defaultCmsPage" stepKey="createCMSPage" />
3021+
<magentoCLI command="config:set cms/wysiwyg/editor mage/adminhtml/wysiwyg/tiny_mce/tinymce4Adapter" stepKey="switchToTinyMCE4"/>
3022+
<actionGroup ref="LoginAsAdmin" stepKey="loginAsAdmin"/>
3023+
</before>
3024+
<after>
3025+
<deleteData createDataKey="createCMSPage" stepKey="deletePreReqCMSPage" />
3026+
<actionGroup ref="logout" stepKey="logout"/>
3027+
</after>
3028+
<actionGroup ref="navigateToCreatedCMSPage" stepKey="navigateToCreatedCMSPage1">
3029+
<argument name="CMSPage" value="$$createCMSPage$$"/>
3030+
</actionGroup>
3031+
<actionGroup ref="expandPageBuilderPanelMenuSection" stepKey="expandPageBuilderPanelMenuSection1">
3032+
<argument name="contentType" value="PageBuilderTextContentType"/>
3033+
</actionGroup>
3034+
<actionGroup ref="dragContentTypeToStage" stepKey="dragButtonsOntoStage">
3035+
<argument name="contentType" value="PageBuilderTextContentType"/>
3036+
</actionGroup>
3037+
<click selector="{{TextOnStage.tinymce('1')}}" stepKey="focusOnTextEditorArea"/>
3038+
<!-- Create new Heading 2 -->
3039+
<actionGroup ref="formatTextInlineTinyMCE" stepKey="formatTextHeading2">
3040+
<argument name="format" value="TinyMCEFormatHeading2"/>
3041+
</actionGroup>
3042+
<pressKey selector="{{TextOnStage.tinymce('1')}}" userInput="{{PageBuilderTextHeadingProperty.value}}" stepKey="addHeadingText"/>
3043+
<waitForElementVisible selector="{{TextOnStage.textWithTag('1', TinyMCEFormatHeading2.tagName, PageBuilderTextHeadingProperty.value)}}" stepKey="waitForHeadingVisible"/>
3044+
<seeElement selector="{{TextOnStage.textWithTag('1', TinyMCEFormatHeading2.tagName, PageBuilderTextHeadingProperty.value)}}" stepKey="seeHeadingElement"/>
3045+
<!-- Add basic text -->
3046+
<pressKey selector="{{TextOnStage.tinymce('1')}}" parameterArray="[\Facebook\WebDriver\WebDriverKeys::ENTER]" stepKey="goToNewLine"/>
3047+
<pressKey selector="{{TextOnStage.tinymce('1')}}" userInput="{{PageBuilderTextProperty.value}}" stepKey="addParagraphText"/>
3048+
<waitForElementVisible selector="{{TextOnStage.text('1', PageBuilderTextProperty.value)}}" stepKey="waitForText"/>
3049+
<seeElement selector="{{TextOnStage.text('1', PageBuilderTextProperty.value)}}" stepKey="seeText"/>
3050+
<!-- Add a variable on the previous line -->
3051+
<pressKey selector="{{TextOnStage.tinymce('1')}}" parameterArray="[\Facebook\WebDriver\WebDriverKeys::HOME, \Facebook\WebDriver\WebDriverKeys::ENTER, \Facebook\WebDriver\WebDriverKeys::ARROW_UP]" stepKey="goToPreviousLine"/>
3052+
<actionGroup ref="addVariableToTinyMCEInline" stepKey="addVariableToTinyMCE">
3053+
<argument name="variable" value="TinyMCEVariableBaseURL"/>
3054+
</actionGroup>
3055+
<waitForElementVisible selector="{{TextOnStage.text('1', TinyMCEVariableBaseURL.editPanelValue)}}" stepKey="waitForVariable"/>
3056+
<seeElement selector="{{TextOnStage.text('1', TinyMCEVariableBaseURL.editPanelValue)}}" stepKey="seeVariableOnStage"/>
3057+
<actionGroup ref="saveAndContinueEditCmsPage" stepKey="saveAndContinueEditCmsPage"/>
3058+
<actionGroup ref="switchToPageBuilderStage" stepKey="switchToPageBuilderStage"/>
3059+
<scrollTo selector="{{TextOnStage.tinymce('1')}}" stepKey="scrollToTinyMCE"/>
3060+
<!-- Select portion of Heading "his is a h" -->
3061+
<executeInSelenium function="function ($webdriver) use ($I) {
3062+
$heading = $webdriver->findElement(\Facebook\WebDriver\WebDriverBy::xpath('//div[contains(@class, \'inline-wysiwyg\')]//h2'));
3063+
$actions = new \Facebook\WebDriver\Interactions\WebDriverActions($webdriver);
3064+
$actions->moveToElement($heading, {{TinyMCEPartialHeadingSelection.startX}}, {{TinyMCEPartialHeadingSelection.startY}})
3065+
->clickAndHold()
3066+
->moveToElement($heading, {{TinyMCEPartialHeadingSelection.endX}}, {{TinyMCEPartialHeadingSelection.endY}})
3067+
->release()
3068+
->perform();
3069+
}" stepKey="selectTextInTinyMCE"/>
3070+
<waitForElementVisible selector="{{TextOnStage.tinymceInFocus('1')}}" stepKey="waitForTinyMCEFocus"/>
3071+
<executeJS function="return window.getSelection().toString()" stepKey="selectionString"/>
3072+
<assertEquals stepKey="assertSelectionText">
3073+
<expectedResult type="string">{{TinyMCEPartialHeadingSelection.selection}}</expectedResult>
3074+
<actualResult type="variable">selectionString</actualResult>
3075+
</assertEquals>
3076+
</test>
30073077
</tests>

0 commit comments

Comments
 (0)