MC-5079: Add Box Sizing to Storefront Styles (Border & Height Storefront Issues)

- add new test to assert map with borders and padding is equal to height
- add new map css selectors

Author: anthoula

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

@@ -10,6 +10,7 @@
           xsi:noNamespaceSchemaLocation="urn:magento:mftf:Page/etc/SectionObject.xsd">
     <section name="MapOnStage">
         <element name="base" type="button" selector="(//div[contains(@class,'pagebuilder-map')])[{{arg1}}]" parameterized="true"/>
+        <element name="mainCSS" type="button" selector="[data-role=map][data-element=main]"/>
         <element name="clickablePin" type="button" selector="((//div[contains(@class,'pagebuilder-map')])[{{arg1}}]//map//area)[{{arg2}}]" parameterized="true"/>
         <element name="allPins" type="button" selector="(//div[contains(@class,'pagebuilder-map')])[{{arg1}}]//img[not(@usemap) and contains(@src,'spotlight-poi2_hdpi.png')]|(//div[contains(@class,'pagebuilder-map')])[{{arg1}}]//img[not(@usemap) and contains(@src,'spotlight-poi2.png')]" parameterized="true"/>
         <element name="pinLocations" type="button" selector="(//div[contains(@class,'pagebuilder-map')])[{{arg1}}]//div[contains(@style,'transform: matrix(1, 0, 0, 1, ')]" parameterized="true"/>
@@ -51,6 +52,7 @@
     <section name="MapOnStorefront">
         <element name="emptyMap" type="button" selector="(//div[@data-role='map'])[{{arg1}}][not(@src) and contains(@style,'display: none;')]" parameterized="true"/>
         <element name="base" type="button" selector="(//div[@data-role='map'])[{{arg1}}]" parameterized="true"/>
+        <element name="baseCSS" type="button" selector="[data-role=map][data-element=main]"/>
         <element name="baseJS" type="text" selector="document.querySelectorAll('div[data-role=\'map\']')[{{arg1}}]" parameterized="true"/>
         <element name="allPins" type="button" selector="(//div[@data-role='map'])[{{arg1}}]//img[not(@usemap) and contains(@src,'spotlight-poi2_hdpi.png')]|(//div[@data-role='map'])[{{arg1}}]//img[not(@usemap) and contains(@src,'spotlight-poi2.png')]" parameterized="true"/>
         <element name="clickablePin" type="button" selector="((//div[@data-role='map'])[{{arg1}}]//map//area)[{{arg2}}]" parameterized="true"/>

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

@@ -990,6 +990,53 @@
             <argument name="pinIndex" value="2"/>
         </actionGroup>
     </test>
+    <test name="MapWithBordersAndPaddingEqualToHeight" extends="RowWithBordersAndPaddingEqualToMinHeight">
+        <annotations>
+            <features value="PageBuilder"/>
+            <stories value="Map"/>
+            <title value="Map height with borders and padding is equal to height"/>
+            <description value="A user can see Map height with borders and padding is equal to height"/>
+            <severity value="CRITICAL"/>
+            <useCaseId value="MC-5079"/>
+            <testCaseId value="MC-5793"/>
+            <group value="pagebuilder"/>
+            <group value="pagebuilder-map"/>
+            <group value="pagebuilder-mapCommon"/>
+        </annotations>
+        <actionGroup ref="addPageBuilderPageTitle" stepKey="enterPageTitle">
+            <argument name="contentType" value="PageBuilderMapContentType"/>
+        </actionGroup>
+        <actionGroup ref="expandPageBuilderPanelGroup" after="enterPageTitle" stepKey="expandGroup">
+            <argument name="group" value="PageBuilderMapContentType"/>
+        </actionGroup>
+        <actionGroup ref="dragContentTypeToStage" after="commentConfigureContentType" stepKey="dragContentTypeToStage">
+            <argument name="contentType" value="PageBuilderMapContentType"/>
+        </actionGroup>
+        <actionGroup ref="openPageBuilderEditPanel" stepKey="openEditPanel">
+            <argument name="contentType" value="PageBuilderMapContentType"/>
+        </actionGroup>
+        <actionGroup ref="clickAddLocationButton" after="openEditPanel" stepKey="clickAddLocationButton"/>
+        <actionGroup ref="clickMapToAddOrMovePin" after="clickAddLocationButton" stepKey="addMapPin"/>
+        <actionGroup ref="fillSlideOutPanelFieldGeneral" after="addMapPin" stepKey="enterLocationName">
+            <argument name="property" value="PageBuilderMapLocationName_TestLocation"/>
+        </actionGroup>
+        <actionGroup ref="saveLocationForm" after="enterLocationName" stepKey="saveLocationForm"/>
+        <actionGroup ref="fillSlideOutPanelFieldGeneral" stepKey="enterMinHeightProperty">
+            <argument name="property" value="PageBuilderMapHeightDefaultProperty"/>
+        </actionGroup>
+        <actionGroup ref="validateContentTypeHeightEqualToMinHeight" stepKey="validateContentTypeHeightBeforeSave">
+            <argument name="content" value="{{MapOnStage.mainCSS}}"/>
+        </actionGroup>
+        <actionGroup ref="validateContentTypeHeightEqualToMinHeight" stepKey="validateContentTypeHeightAfterSave">
+            <argument name="content" value="{{MapOnStage.mainCSS}}"/>
+        </actionGroup>
+        <actionGroup ref="navigateToStoreFront" stepKey="navigateToStoreFront">
+            <argument name="contentType" value="PageBuilderMapContentType"/>
+        </actionGroup>
+        <actionGroup ref="validateContentTypeHeightEqualToMinHeight" stepKey="validateContentTypeHeightStorefront">
+            <argument name="content" value="{{MapOnStorefront.baseCSS}}"/>
+        </actionGroup>
+    </test>
     <test name="MapDuplicate">
         <annotations>
             <features value="PageBuilder"/>