MC-3735: Allow inline WYSIWYG editing of slides

- Fix tests

Author: omiroshnichenko

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

@@ -25,7 +25,7 @@
     </actionGroup>
     <actionGroup name="addSlide">
         <waitForElementVisible time="10" selector="{{SliderInAdmin.sliderContainer}}" stepKey="waitForContentTypeInStageVisible" />
-        <click stepKey="focusOnSlider" selector="{{SliderInAdmin.sliderContainer}}"/>
+        <click selector="{{PageBuilderPanel.searchPanel}}" stepKey="clickOutsideLiveEdit"/>
         <scrollTo selector="div.pagebuilder-header" x="0" y="-100" stepKey="scrollToTop"/>
         <moveMouseOver selector="{{SliderInAdmin.sliderContainer}}" x="10" y="10" stepKey="onMouseOverContentTypeStage"/>
         <waitForPageLoad stepKey="waitForPageLoad1"/>

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

@@ -486,7 +486,7 @@
         <!-- Validate Slider Edit Panel Defaults -->
         <comment userInput="Validate Slider Edit Panel Defaults" stepKey="commentSliderEditPanel"/>
         <scrollTo selector="{{CmsNewPagePageActionsSection.pageTitle}}" stepKey="scrollToTop"/>
-        <click selector="{{SliderInAdmin.slideWrapper}}" stepKey="clickSliderInStage"/>
+        <click selector="{{PageBuilderPanel.searchPanel}}" stepKey="unFocusSlider"/>
         <actionGroup ref="openPageBuilderEditPanelByIndex" stepKey="openEditMenu">
             <argument name="contentType" value="PageBuilderSliderContentType"/>
         </actionGroup>
@@ -632,7 +632,8 @@
         <scrollTo selector="{{CmsNewPagePageActionsSection.content}}" stepKey="scrollToContent"/>
         <moveMouseOver selector="{{SliderInAdmin.sliderContainer}}" x="10" y="10" stepKey="onMouseOverContentTypeStage"/>
         <wait time="0.5" stepKey="waitForMouseOverAnimation" />
-        <click stepKey="focusOnSlider" selector="{{SliderInAdmin.sliderContainer}}"/>
+        <click stepKey="focusOut" selector="{{PageBuilderPanel.searchPanel}}"/>
+        <moveMouseOver selector="{{SliderInAdmin.sliderContainer}}" x="10" y="10" stepKey="onMouseOverContentTypeStage1"/>
 
         <waitForElementVisible time="5" selector="{{PageBuilderContentTypeOptionsMenu.contentTypeOptionsMenu(PageBuilderSliderContentType.role)}}" stepKey="seeContentTypeOptionsMenu"/>
         <moveMouseOver selector="{{PageBuilderContentTypeOptionsMenu.contentTypeOptionsMenu(PageBuilderSliderContentType.role)}}" stepKey="onMouseOverOptionsMenu"/>
@@ -673,7 +674,7 @@
         <actionGroup ref="saveEditPanelSettings" stepKey="saveEditPanel2Settings"/>
 
         <comment userInput="User hovers each slide dot, user sees tooltip displayed with Slide name" stepKey="AC15"/>
-        <click stepKey="unfocusNavigation" selector="{{SliderInAdmin.sliderContainer}}"/>
+        <click stepKey="unfocusNavigation" selector="{{PageBuilderPanel.searchPanel}}"/>
         <moveMouseOver selector="{{SliderInAdmin.activeSlideNavigationDot}}" stepKey="mouseOverActiveSlide2"/>
         <see userInput="{{PageBuilderSlideItemName2.value}}" selector="{{SliderInAdmin.slideNavigationDotNameTooltip}}" stepKey="seeSlideName2InTooltip"/>
         <moveMouseOver selector="{{SliderInAdmin.slideNavigationDot('1')}}" stepKey="moveMouseOverFirstSlideNavigationDot"/>
@@ -720,7 +721,7 @@
             <argument name="section" value="SlideOnConfigurationPanel"/>
         </actionGroup>
         <actionGroup ref="saveEditPanelSettings" stepKey="saveEditPanelSettings"/>
-        <click stepKey="unfocusNavigation" selector="{{SliderInAdmin.sliderContainer}}"/>
+        <click stepKey="unfocusNavigation" selector="{{PageBuilderPanel.searchPanel}}"/>
         <waitForPageLoad stepKey="waitForOptionsHide"/>
         <actionGroup ref="hideContentType" stepKey="hideContentType">
             <argument name="section" value="SliderInAdmin"/>
@@ -791,7 +792,7 @@
             <argument name="contentType" value="PageBuilderSliderContentType"/>
         </actionGroup>
         <actionGroup ref="closeEditPanelSettings" stepKey="closeSlideEditPanel"/>
-        <click selector="{{SliderInAdmin.slideWrapper}}" stepKey="clickSliderInStage"/>
+        <click selector="{{PageBuilderPanel.searchPanel}}" stepKey="unFocusSlide"/>
         <actionGroup ref="removeContentTypeFromStage" stepKey="removeEmptyContentTypeFromStage">
             <argument name="contentType" value="PageBuilderSliderContentType"/>
         </actionGroup>
@@ -895,7 +896,7 @@
             <argument name="contentType" value="PageBuilderSliderContentType"/>
         </actionGroup>
         <actionGroup ref="closeEditPanelSettings" stepKey="closeEditPanelSettings"/>
-        <click selector="{{SliderInAdmin.slideWrapper}}" stepKey="clickSliderInStage"/>
+        <click selector="{{PageBuilderPanel.searchPanel}}" stepKey="unFocusSlider"/>
         <actionGroup ref="openPageBuilderEditPanel" stepKey="openEditMenuOnStage">
             <argument name="contentType" value="PageBuilderSliderContentType"/>
         </actionGroup>
@@ -1604,7 +1605,7 @@
         </actionGroup>
         <actionGroup ref="closeEditPanelSettings" stepKey="closeEditPanelSettings"/>
         <!--Verify there are 2 buttons when hovering-->
-        <click selector="{{SliderInAdmin.slideWrapper}}" stepKey="clickSliderInStage1"/>
+        <click selector="{{PageBuilderPanel.searchPanel}}" stepKey="clickSearchPanel"/>
         <comment userInput="Verify there are 2 buttons when hovering" stepKey="commentVerifyButtons" />
         <actionGroup ref="verifyUploadImageButtons" stepKey="verifyUploadImageButtons" >
             <argument name="contentType" value="PageBuilderSliderContentType"/>
@@ -1617,7 +1618,8 @@
         <waitForElementVisible selector="{{ImageOnConfigurationPanel.imageSource(PageBuilderImageProperty_JPG.fileName)}}" stepKey="waitForMainImageSource1"/>
         <!--Upload image from Media Gallery Storage -->
         <comment userInput="Upload image from Media Gallery Storage" stepKey="commentUploadImageFromStorage"/>
-        <click selector="{{SliderInAdmin.slideWrapper}}" stepKey="clickSliderInStage"/>
+        <click selector="{{PageBuilderPanel.searchPanel}}" stepKey="clickSearchPanel1"/>
+        <moveMouseOver selector="{{SliderInAdmin.sliderContainer}}" x="10" y="10" stepKey="onMouseOverContentTypeStage"/>
         <waitForElementVisible selector="{{ImageOnStage.selectFromGalleryImageBtn}}" stepKey="seeSelectFromGalleryBtn2" />
         <click selector="{{ImageOnStage.selectFromGalleryImageBtn}}" stepKey="clickSelectFromGallery" />
         <waitForPageLoad stepKey="waitForPageLoad2" />
@@ -1681,7 +1683,8 @@
             <argument name="property" value="PageBuilderSlideCollageLeftProperty"/>
         </actionGroup>
         <actionGroup ref="saveEditPanelSettings" stepKey="saveEditPanelSettings1"/>
-        <click selector="{{SlideOnBackend.collageOverlayGeneral}}" stepKey="clickSliderInStage1"/>
+        <click selector="{{PageBuilderPanel.searchPanel}}" stepKey="clickSearchPanel"/>
+        <moveMouseOver selector="{{SliderInAdmin.sliderContainer}}" x="10" y="10" stepKey="onMouseOverContentTypeStage"/>
         <comment userInput="Verify there are 2 buttons when hovering" stepKey="commentVerifyButtons1" />
         <actionGroup ref="verifyUploadImageButtons" stepKey="verifyUploadImageButtons1" >
             <argument name="contentType" value="PageBuilderSliderContentType"/>
@@ -1695,7 +1698,8 @@
             <argument name="property" value="PageBuilderSlideCollageCenteredProperty"/>
         </actionGroup>
         <actionGroup ref="saveEditPanelSettings" stepKey="saveEditPanelSettings2"/>
-        <click selector="{{SlideOnBackend.collageOverlayGeneral}}" stepKey="clickSliderInStage2"/>
+        <click selector="{{PageBuilderPanel.searchPanel}}" stepKey="clickSearchPanel1"/>
+        <moveMouseOver selector="{{SliderInAdmin.sliderContainer}}" x="10" y="10" stepKey="onMouseOverContentTypeStage1"/>
         <comment userInput="Verify there are 2 buttons when hovering" stepKey="commentVerifyButtons2" />
         <actionGroup ref="verifyUploadImageButtons" stepKey="verifyUploadImageButtons2" >
             <argument name="contentType" value="PageBuilderSliderContentType"/>
@@ -1710,7 +1714,8 @@
         </actionGroup>
         <actionGroup ref="saveEditPanelSettings" stepKey="saveEditPanelSettings3"/>
         <!--Verify there are 2 buttons when hovering-->
-        <click selector="{{SlideOnBackend.collageOverlayGeneral}}" stepKey="clickSliderInStage3"/>
+        <click selector="{{PageBuilderPanel.searchPanel}}" stepKey="clickSearchPanel2"/>
+        <moveMouseOver selector="{{SliderInAdmin.sliderContainer}}" x="10" y="10" stepKey="onMouseOverContentTypeStage2"/>
         <comment userInput="Verify there are 2 buttons when hovering" stepKey="commentVerifyButtons3" />
         <actionGroup ref="verifyUploadImageButtons" stepKey="verifyUploadImageButtons3" >
             <argument name="contentType" value="PageBuilderSliderContentType"/>
@@ -2028,7 +2033,7 @@
             <argument name="section" value="SlideOnConfigurationPanel"/>
         </actionGroup>
         <actionGroup ref="saveEditPanelSettings" stepKey="saveEditPanelSettings"/>
-        <click stepKey="unfocusNavigation" selector="{{SliderInAdmin.sliderContainer}}"/>
+        <click stepKey="unfocusNavigation" selector="{{PageBuilderPanel.searchPanel}}"/>
         <waitForPageLoad stepKey="waitForOptionsHide"/>
         <actionGroup ref="hideContentType" stepKey="hideContentType">
             <argument name="section" value="SliderInAdmin"/>
@@ -2591,7 +2596,7 @@
 
         <!-- Validate first slide -->
         <comment userInput="User sees Slide on stage with updated title and content." stepKey="checkFilledData"/>
-        <click stepKey="unfocusNavigation" selector="{{SliderInAdmin.sliderContainer}}"/>
+        <click stepKey="unfocusNavigation" selector="{{PageBuilderPanel.searchPanel}}"/>
         <moveMouseOver selector="{{SliderInAdmin.activeSlideNavigationDot}}" stepKey="mouseOverActiveSlide"/>
         <see userInput="{{PageBuilderSlideItemName1.value}}" selector="{{SliderInAdmin.slideNavigationDotNameTooltip}}" stepKey="seeSlideNameInTooltip"/>
         <see userInput="{{PageBuilderSlideItemContent1.value}}" selector="{{SlideOnBackend.slideContent('0')}}" stepKey="seeSlide1ContentDisplayedAdmin"/>
@@ -2613,7 +2618,7 @@
 
         <!-- Validate second slide data -->
         <comment userInput="User sees Second Slide on stage with updated title and content." stepKey="checkFilledData2"/>
-        <click stepKey="unfocusNavigation2" selector="{{SliderInAdmin.sliderContainer}}"/>
+        <click stepKey="unfocusNavigation2" selector="{{PageBuilderPanel.searchPanel}}"/>
         <moveMouseOver selector="{{SliderInAdmin.activeSlideNavigationDot}}" stepKey="mouseOverActiveSlide2"/>
         <see userInput="{{PageBuilderSlideItemName2.value}}" selector="{{SliderInAdmin.slideNavigationDotNameTooltip}}" stepKey="seeSlideName2InTooltip"/>
         <see userInput="{{PageBuilderSlideItemContent2.value}}" selector="{{SlideOnBackend.slideContent('1')}}" stepKey="seeSlide2ContentDisplayedAdmin"/>
@@ -2627,7 +2632,7 @@
         <comment userInput="Validate saved data" stepKey="validateSavedData"/>
         <actionGroup ref="switchToPageBuilderStage" stepKey="switchToPageBuilderStage1"/>
         <see userInput="{{PageBuilderSlideItemContent1.value}}" selector="{{SlideOnBackend.slideContent('0')}}" stepKey="seeSlideContentAfterSave"/>
-        <click selector="{{SliderInAdmin.sliderContainer}}" stepKey="unfocusNavigationAfterSave"/>
+        <click selector="{{PageBuilderPanel.searchPanel}}" stepKey="unfocusNavigationAfterSave"/>
         <moveMouseOver selector="{{SliderInAdmin.activeSlideNavigationDot}}" stepKey="mouseOverActiveSlide1AfterSave"/>
         <see userInput="{{PageBuilderSlideItemName1.value}}" selector="{{SliderInAdmin.slideNavigationDotNameTooltip}}" stepKey="seeSlideName1InTooltipAfterSave"/>
         <moveMouseOver selector="{{SliderInAdmin.slideNavigationDot('2')}}" stepKey="moveMouseOverSecondSlideNavigationDotAfterSave"/>
@@ -2650,7 +2655,7 @@
 
         <!-- Validate Side names after sorting -->
         <comment userInput="User hovers each slide dot, user sees tooltip displayed with Slide name after sorting" stepKey="checkAfterSort"/>
-        <click selector="{{SliderInAdmin.sliderContainer}}" stepKey="unfocusNavigationAfterSort"/>
+        <click selector="{{PageBuilderPanel.searchPanel}}" stepKey="unfocusNavigationAfterSort"/>
         <moveMouseOver selector="{{SliderInAdmin.activeSlideNavigationDot}}" stepKey="mouseOverActiveSlide2AfterSort"/>
         <see userInput="{{PageBuilderSlideItemName2.value}}" selector="{{SliderInAdmin.slideNavigationDotNameTooltip}}" stepKey="seeSlideName2InTooltipAfterSort"/>
         <moveMouseOver selector="{{SliderInAdmin.slideNavigationDot('2')}}" stepKey="moveMouseOverSecondSlideNavigationDot"/>
@@ -2665,7 +2670,7 @@
         <comment userInput="Validate saved data" stepKey="validateSavedData2"/>
         <actionGroup ref="switchToPageBuilderStage" stepKey="switchToPageBuilderStage2"/>
         <see userInput="{{PageBuilderSlideItemContent2.value}}" selector="{{SlideOnBackend.slideContent('0')}}" stepKey="seeSlide2ContentAfterSave"/>
-        <click selector="{{SliderInAdmin.sliderContainer}}" stepKey="unfocusNavigationAfterSave2"/>
+        <click selector="{{PageBuilderPanel.searchPanel}}" stepKey="unfocusNavigationAfterSave2"/>
         <moveMouseOver selector="{{SliderInAdmin.activeSlideNavigationDot}}" stepKey="mouseOverActiveSlide2AfterSave"/>
         <see userInput="{{PageBuilderSlideItemName2.value}}" selector="{{SliderInAdmin.slideNavigationDotNameTooltip}}" stepKey="seeSlideName2InTooltipAfterSave2"/>
         <moveMouseOver selector="{{SliderInAdmin.slideNavigationDot('2')}}" stepKey="moveMouseOverSecondSlideNavigationDotAfterSave2"/>