Merge branch 'MC-1438' of github.com:magento-trigger/magento2-page-builder into MC-1438

Author: nathanjosiah

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

@@ -40,7 +40,6 @@
         <arguments>
             <argument name="variable" defaultValue=""/>
         </arguments>
-        <comment userInput="Adding Variable To Tiny MCE" stepKey="commentAddVariableToTinyMCE"/>
         <waitForElementVisible selector="{{TextOnConfiguration.insertVariableButton}}" stepKey="waitForInsertVariable1"/>
         <click selector="{{TextOnConfiguration.insertVariableButton}}" stepKey="clickInsertVariable1"/>
         <waitForLoadingMaskToDisappear stepKey="waitForLoadingMaskToDisappear"/>
@@ -98,7 +97,7 @@
         <click selector="{{moveToCE.SelectPageButton}}" stepKey="clickSelectPage"/>
         <waitForLoadingMaskToDisappear stepKey="waitForSelectPageModal"/>
         <waitForElementVisible selector="{{moveToCE.generalFilter('chooser_title')}}" stepKey="waitForGrid"/>
-        <fillField selector="{{moveToCE.generalFilter('chooser_title')}}" userInput="{{page}}" stepKey="enterPageName"/>
+        <fillField selector="{{moveToCE.generalFilter('chooser_identifier')}}" userInput="{{page}}" stepKey="enterPageName"/>
         <click selector="{{AdminProductGridFilterSection.applyFilters}}" stepKey="clickSearch"/>
         <waitForLoadingMaskToDisappear stepKey="waitForLoadingMaskToDisappear3"/>
         <waitForElementVisible selector="//td[contains(@class,'col-url')][contains(text(),'{{page}}')]" stepKey="waitForSearchResult"/>

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

@@ -32,6 +32,8 @@
         <element name="firstSlideNavigationDot" type="button" selector="(//div[contains(@class, 'navigation-dot')])[1]"/>
         <element name="activeSlideTooltip" type="button" selector="//div[contains(@class, 'navigation-dot')]//span[contains(@role, 'tooltip')]"/>
         <element name="slideNavigationDot" type="button" selector="(//div[contains(@class, 'navigation-dot')])[{{arg1}}]" parameterized="true"/>
+        <element name="slideNavigationDragHandle" type="button" selector="a.navigation-dot-anchor"/>
+        <element name="slideNavigationDragHandleByIndex" type="button" selector="(//a[contains(@class, 'navigation-dot-anchor')])[{{arg1}}]" parameterized="true"/>
         <element name="allNavigationDots" type="button" selector="(//div[contains(@class, 'navigation-dot')])"/>
         <element name="activeSlideNavigationDot" type="button" selector="//div[contains(@class, 'navigation-dot active')]"/>
         <element name="slideNavigationDotNameTooltip" type="button" selector="(//span[contains(@class, 'tooltip-content')])"/>

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

@@ -63,7 +63,7 @@
         <element name="contentTypeWithIcon" type="button" selector="//ul[@class='pagebuilder-panel-groups']//span[@class='content-type-icon']//i[@class='icon-pagebuilder-{{arg2}}']/../following-sibling::span[text()='{{arg1}}']" parameterized="true"/>
     </section>
     <section name="PageBuilderContentTypeOptionsMenu">
-        <element name="contentTypeOptionsMenu" type="button" selector='div.pagebuilder-{{arg1}}.pagebuilder-content-type > div.pagebuilder-options' parameterized="true"/>
+        <element name="contentTypeOptionsMenu" type="button" selector='(//div[contains(@class, "pagebuilder-{{arg1}}")]//div[contains(@class, "pagebuilder-options")])[1]' parameterized="true"/>
         <element name="contentTypeOptionsMenuByIndex" type="button" selector='(//div[contains(@class, "pagebuilder-content-type") and contains(@class, "pagebuilder-{{arg1}}")])[{{arg2}}]//div[contains(@class,"pagebuilder-options-visible")]' parameterized="true"/>
         <element name="contentTypeMove" type="button" selector='(//div[contains(@class, "pagebuilder-content-type") and contains(@class, "pagebuilder-{{arg1}}")])[1]/div[contains(@class,"pagebuilder-options-visible")]/descendant::*[@class="move-structural"]' parameterized="true"/>
         <element name="contentTypeMoveByIndex" type="button" selector='(//div[contains(@class, "pagebuilder-content-type") and contains(@class, "pagebuilder-{{arg1}}")])[{{arg2}}]/div[contains(@class,"pagebuilder-options-visible")]/descendant::*[@class="move-structural"]' parameterized="true"/>

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

@@ -64,7 +64,7 @@
         <element name="tabHeader" type="button" selector="(//li[contains(@role, 'tab')])[{{arg1}}]" parameterized="true"/>
         <element name="tabHeaderItemActive" type="button" selector="(//div[@data-role='tabs']//descendant::*[@role='tablist'])/li[{{arg1}}][contains(@class, 'ui-state-active')]" parameterized="true"/>
         <element name="tabPanel" type="button" selector="(//div[@class='tabs-content']//div[@role='tabpanel'])[{{arg1}}]" parameterized="true"/>
-        <element name="tabContent" type="button" selector="(//div[@class='tabs-content']//div[@data-role='tab-item'])[{{arg1}}]" parameterized="true"/>
+        <element name="tabContent" type="button" selector="div.tabs-content div[data-role=tab-item]:nth-child({{arg1}})" parameterized="true"/>
         <element name="tabContentAdvancedStyles" type="button" selector="(//div[@class='tabs-content']//div[@data-role='tab-item'])[{{arg1}}][@style='border-radius: 0px 12px 12px; border: 10px solid rgb(0, 0, 0);']" parameterized="true"/>
         <element name="tabContentMinimumHeight" type="button" selector="(//div[@class='tabs-content']//div[@data-role='tab-item'])[{{arg1}}][contains(@style, 'min-height: {{arg2}}px')]" parameterized="true"/>
         <element name="tabContentBackgroundColor" type="button" selector="(//div[@class='tabs-content']//div[@data-role='tab-item'])[{{arg1}}][contains(@style, 'background-color: {{arg2}}')]" parameterized="true"/>

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

@@ -10,8 +10,11 @@
     <section name="TextOnStage">
         <element name="base" type="text" selector="(//div[contains(@class,'pagebuilder-text')])[{{arg1}}]/div" parameterized="true"/>
         <element name="textAreaText" type="text" selector="(//div[contains(@class,'pagebuilder-text')])[{{arg1}}]//div[.='{{arg2}}']" parameterized="true"/>
+        <element name="textAreaTextContains" type="text" selector="(//div[contains(@class,'pagebuilder-text')])[{{arg1}}]//textarea[contains(@value,'{{arg2}}')]" parameterized="true"/>
         <element name="text" type="text" selector="(//div[contains(@class,'pagebuilder-text')])[{{arg1}}]/div//*[contains(.,'{{arg2}}')]" parameterized="true"/>
         <element name="mcePlaceholder" type="text" selector="(//div[contains(@class,'pagebuilder-text')])[{{arg1}}]/div//*[starts-with(@id, '{{arg2}}')]" parameterized="true"/>
+        <element name="variablePlaceholder" type="text" selector="(//div[contains(@class,'pagebuilder-text')])[{{arg}}]//*[@data-bind='html: data.main.html']//*[contains(@class, 'magento-variable magento-placeholder')]" parameterized="true"/>
+        <element name="widgetPlaceholder" type="text" selector="(//div[contains(@class,'pagebuilder-text')])[{{arg}}]//*[@data-bind='html: data.main.html']//*[contains(@class, 'magento-placeholder magento-widget')]" parameterized="true"/>
         <element name="placeholder" type="text" selector="(//div[contains(@class,'pagebuilder-text')])[{{arg1}}]//div[contains(@class, 'placeholder-text') and text()='Edit Text']" parameterized="true"/>
         <element name="textArea" type="text" selector="(//div[contains(@class,'pagebuilder-text')])[{{arg}}]//textarea[contains(@class,'inline-wysiwyg-textarea')]" parameterized="true"/>
         <element name="textareaPlaceholder" type="text" selector="(//div[contains(@class,'pagebuilder-text')])[{{arg1}}]//textarea[contains(@class, 'inline-wysiwyg-textarea') and contains(@placeholder,'Edit Text')]" parameterized="true"/>
@@ -62,6 +65,7 @@
         <element name="empty" type="text" selector="//div[@data-role='text'][{{arg1}}][not(*)]" parameterized="true"/>
         <element name="image" type="text" selector="//div[@data-role='text'][{{arg1}}]//img[contains(@src,'{{arg2}}')]" parameterized="true"/>
         <element name="textInImportantStyle" type="text" selector="//div[contains(normalize-space(@class), 'cms-content-important') and text()='{{arg1}}']" parameterized="true"/>
+        <element name="emptyTextInImportantStyle" type="text" selector="//div[@data-role='text'][{{arg1}}]//div[@class='cms-content-important'][not(*)]" parameterized="true"/>
         <!-- Advanced Configuration -->
         <element name="alignment" type="text" selector="(//div[@data-role='text'])[{{arg1}}][contains(@style,'text-align: {{arg2}};')]" parameterized="true"/>
         <element name="noAlignment" type="text" selector="(//div[@data-role='text'])[{{arg1}}][not(contains(@style,'text-align:'))]" parameterized="true"/>

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

@@ -1956,7 +1956,7 @@
             <argument name="buttonGroupPage" value="ButtonGroupOnStorefront"/>
             <argument name="buttonItemPage" value="ButtonItemOnStorefront"/>
         </actionGroup>
-        <executeJS function="return parseInt(window.getComputedStyle(document.querySelectorAll('{{TabOnStorefront.all}}')[0]).width)" stepKey="tabWidthStorefront"/>
+        <executeJS function="return document.querySelectorAll('{{TabOnStorefront.all}}')[0].offsetWidth" stepKey="tabWidthStorefront"/>
         <executeJS function="return parseInt(window.getComputedStyle({{ButtonItemOnStorefront.jsButtonSelector('1')}}).width)" stepKey="buttonWidthStorefront"/>
         <assertLessThan stepKey="assertButtonSmallerThanTabStorefront">
             <expectedResult type="variable">$tabWidthStorefront</expectedResult>
@@ -1969,7 +1969,7 @@
             <argument name="buttonGroupPage" value="ButtonGroupOnStorefront"/>
             <argument name="buttonItemPage" value="ButtonItemOnStorefront"/>
         </actionGroup>
-        <executeJS function="return parseInt(window.getComputedStyle(document.querySelectorAll('{{TabOnStorefront.all}}')[0]).width)" stepKey="tabWidthStorefrontMobile"/>
+        <executeJS function="return document.querySelectorAll('{{TabOnStorefront.all}}')[0].offsetWidth" stepKey="tabWidthStorefrontMobile"/>
         <executeJS function="return parseInt(window.getComputedStyle({{ButtonItemOnStorefront.jsButtonSelector('1')}}).width)" stepKey="buttonWidthStorefrontMobile"/>
         <assertLessThan stepKey="assertButtonSmallerThanTabStorefrontMobile">
             <expectedResult type="variable">$tabWidthStorefrontMobile</expectedResult>