PB-582: Fix Page Builder builds

Author: omiroshnichenko

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

@@ -334,7 +334,7 @@
             <argument name="productGroupIndex" defaultValue="1" type="string"/>
             <argument name="navigationDotIndex" defaultValue="2" type="string"/>
         </arguments>
-        <waitForElementVisible selector="{{page.carouselNavigationDot(productGroupIndex, navigationDotIndex)}}" stepKey="waitForNavigationDot"/>
+        <waitForElementVisible selector="{{page.carouselNavigationDotButton(productGroupIndex, navigationDotIndex)}}" stepKey="waitForNavigationDot"/>
         <click selector="{{page.carouselNavigationDotButton(productGroupIndex, navigationDotIndex)}}" stepKey="clickNavigationDot"/>
         <waitForElementVisible selector="{{page.carouselActiveProductNavigationDotByIndex(productGroupIndex, navigationDotIndex)}}" stepKey="waitForCarouselNavigation"/>
         <seeElement selector="{{page.carouselActiveProductNavigationDotByIndex(productGroupIndex, navigationDotIndex)}}" stepKey="seeClickedNavigationDotIsActive"/>

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

@@ -72,7 +72,7 @@
         <element name="showDots" type="button" parameterized="true" selector="(//div[contains(@class,'pagebuilder-products')]//div[contains(@data-appearance,'carousel')])[{{indexOfProductGroup}}][@data-show-dots='{{showDots}}']"/>
         <element name="carouselNavigationDotsArea" type="button" parameterized="true" selector="(//div[contains(@class,'pagebuilder-products')]//div[contains(@data-appearance,'carousel')])[{{indexOfProductGroup}}]//*[contains(@class,'slick-dots')]"/>
         <element name="carouselNavigationDots" type="button" parameterized="true" selector="(//div[contains(@class,'pagebuilder-products')]//div[contains(@data-appearance,'carousel')])[{{indexOfProductGroup}}]//*[contains(@class,'slick-dots')]//li"/>
-        <element name="carouselNavigationDot" type="button" parameterized="true" selector="((//div[contains(@class,'pagebuilder-products')]//div[contains(@data-appearance,'carousel')])[{{indexOfProductGroup}}]//*[contains(@class,'slick-dots')]//li)[{{indexOfNavigationDot}}]"/>
+        <element name="carouselNavigationDot" type="button" parameterized="true" selector="((//div[contains(@class,'pagebuilder-products')]//div[contains(@data-appearance,'carousel')])[{{indexOfProductGroup}}]//*[contains(@class,'slick-dots')]//li)[{{indexOfNavigationDot}}]" deprecated="New element was introduced. Please use 'ProductsCarouselOnStage.carouselNavigationDotButton'"/>
         <element name="carouselNavigationDotButton" type="button" parameterized="true" selector="((//div[contains(@class,'pagebuilder-products')]//div[contains(@data-appearance,'carousel')])[{{indexOfProductGroup}}]//*[contains(@class,'slick-dots')]//li)[{{indexOfNavigationDot}}]//button"/>
         <element name="carouselActiveProductNavigationDot" type="button" parameterized="true" selector="(//div[contains(@class,'pagebuilder-products')]//div[contains(@data-appearance,'carousel')])[{{indexOfProductGroup}}]//*[contains(@class,'slick-dots')]//*[contains(@class,'slick-active')]"/>
         <element name="carouselActiveProductNavigationDotByIndex" type="button" parameterized="true" selector="((//div[contains(@class,'pagebuilder-products')]//div[contains(@data-appearance,'carousel')])[{{indexOfProductGroup}}]//*[contains(@class,'slick-dots')]//li)[{{indexOfNavigationDot}}][contains(@class,'slick-active')]"/>
@@ -149,7 +149,8 @@
         <element name="showDots" type="button" parameterized="true" selector="(//div[contains(@data-content-type,'products')])[{{indexOfProductGroup}}][@data-show-dots='{{showDots}}']"/>
         <element name="carouselNavigationDotsArea" type="button" parameterized="true" selector="(//div[contains(@data-content-type,'products')])[{{indexOfProductGroup}}]//*[contains(@class,'slick-dots')]"/>
         <element name="carouselNavigationDots" type="button" parameterized="true" selector="(//div[contains(@data-content-type,'products')])[{{indexOfProductGroup}}]//*[contains(@class,'slick-dots')]//button"/>
-        <element name="carouselNavigationDot" type="button" parameterized="true" selector="((//div[contains(@data-content-type,'products')])[{{indexOfProductGroup}}]//*[contains(@class,'slick-dots')]//button)[{{indexOfNavigationDot}}]"/>
+        <element name="carouselNavigationDot" type="button" parameterized="true" selector="((//div[contains(@data-content-type,'products')])[{{indexOfProductGroup}}]//*[contains(@class,'slick-dots')]//button)[{{indexOfNavigationDot}}]" deprecated="New element was introduced. Please use 'ProductsOnStorefront.carouselNavigationDotButton'"/>
+        <element name="carouselNavigationDotButton" type="button" parameterized="true" selector="((//div[contains(@data-content-type,'products')])[{{indexOfProductGroup}}]//*[contains(@class,'slick-dots')]//button)[{{indexOfNavigationDot}}]"/>
         <element name="carouselActiveProductNavigationDot" type="button" parameterized="true" selector="(//div[contains(@data-content-type,'products')])[{{indexOfProductGroup}}]//*[contains(@class,'slick-dots')]//*[contains(@class,'slick-active')]"/>
         <element name="carouselActiveProductNavigationDotByIndex" type="button" parameterized="true" selector="((//div[contains(@data-content-type,'products')])[{{indexOfProductGroup}}]//*[contains(@class,'slick-dots')]//li)[{{indexOfNavigationDot}}][contains(@class,'slick-active')]"/>
         <element name="carouselPreviousProductNavigationArrow" type="button" parameterized="true" selector="(//div[contains(@data-content-type,'products')])[{{indexOfProductGroup}}]//button[contains(@class,'slick-arrow') and contains(@class,'slick-prev')]"/>