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

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

Author: anthoula

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

@@ -11,6 +11,7 @@
     <section name="ColumnOnBackend">
         <element name="base" type="button" selector="(//div[contains(@class,'pagebuilder-column') and contains(@class,'pagebuilder-content-type')])[{{arg1}}]" parameterized="true"/>
         <element name="baseJS" type="text" selector="document.querySelectorAll('[data-role=column]')[{{arg1}} - 1]" parameterized="true"/>
+        <element name="baseCSS" type="text" selector="div.pagebuilder-content-type.pagebuilder-column"/>
         <element name="allColumns" type="text" selector="//div[contains(@class, 'pagebuilder-content-type') and contains(@class, 'pagebuilder-column')]"/>
         <element name="default" type="button" selector="(//div[contains(@class,'pagebuilder-content-type') and contains(@class,'pagebuilder-column')])[{{arg1}}][@style='border: {{arg2}}; border-radius: {{arg3}}px; margin: {{arg4}}px; padding: {{arg5}}px; width: {{arg6}}; background-size: {{arg7}}; background-repeat: {{arg8}}; background-attachment: {{arg9}}; align-self: {{arg10}};']" parameterized="true"/>
         <element name="empty" type="button" selector="(//div[contains(@class,'empty-container')]//div[contains(@class,'element-children') and contains(@class,'column-container')])[{{arg1}}]" parameterized="true"/>
@@ -52,6 +53,7 @@
     <section name="ColumnOnFrontend">
         <element name="base" type="block" selector="(//div[@data-role='column'])[{{arg1}}]" parameterized="true"/>
         <element name="baseJS" type="text" selector="document.querySelectorAll('[data-role=column]')[{{arg1}} - 1]" parameterized="true"/>
+        <element name="baseCSS" type="text" selector="[data-role=column]"/>
         <element name="columnGroup" type="block" selector=".pagebuilder-column-group"/>
         <element name="allColumns" type="block" selector="(//div[@data-role='column'])"/>
         <element name="columnX" type="block" selector="[data-role=column]:nth-child({{arg1}})" parameterized="true"/>

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

@@ -177,6 +177,45 @@
         <actionGroup ref="saveEditPanelSettings" stepKey="saveEditPanelSettings"/>
         <waitForElementVisible selector="{{ColumnOnBackend.base('1')}}" stepKey="waitForColumnOnStage" />
     </test>
+    <test name="ColumnWithBordersAndPaddingEqualToMinHeight" extends="RowWithBordersAndPaddingEqualToMinHeight">
+        <annotations>
+            <features value="PageBuilder"/>
+            <stories value="Column"/>
+            <title value="Column height is equal to minimum height"/>
+            <description value="A user can see Column height with borders and padding is equal to min height"/>
+            <severity value="CRITICAL"/>
+            <useCaseId value="MC-5079"/>
+            <testCaseId value="MC-5771"/>
+            <group value="pagebuilder"/>
+            <group value="pagebuilder-column"/>
+        </annotations>
+        <actionGroup ref="addPageBuilderPageTitle" stepKey="enterPageTitle">
+            <argument name="contentType" value="PageBuilderColumnContentType"/>
+        </actionGroup>
+        <actionGroup ref="dragContentTypeToStage" after="commentConfigureContentType" stepKey="dragContentTypeToStage">
+            <argument name="contentType" value="PageBuilderColumnContentType"/>
+        </actionGroup>
+        <actionGroup ref="openPageBuilderEditPanelByIndex" stepKey="openEditPanel">
+            <argument name="contentType" value="PageBuilderColumnContentType"/>
+            <argument name="contentTypeIndex" value="1"/>
+        </actionGroup>
+        <actionGroup ref="validateContentTypeHeightEqualToMinHeight" stepKey="validateContentTypeHeightBeforeSave">
+            <argument name="content" value="{{ColumnOnBackend.baseCSS}}"/>
+            <argument name="border" value="PageBuilderAdvancedBorderWidthProperty10"/>
+            <argument name="padding" value="PageBuilderPaddingProperty10"/>
+        </actionGroup>
+        <actionGroup ref="validateContentTypeHeightEqualToMinHeight" stepKey="validateContentTypeHeightAfterSave">
+            <argument name="content" value="{{ColumnOnBackend.baseCSS}}"/>
+            <argument name="border" value="PageBuilderAdvancedBorderWidthProperty10"/>
+            <argument name="padding" value="PageBuilderPaddingProperty10"/>
+        </actionGroup>
+        <actionGroup ref="navigateToStoreFront" stepKey="navigateToStoreFront">
+            <argument name="contentType" value="PageBuilderColumnContentType"/>
+        </actionGroup>
+        <actionGroup ref="validateContentTypeHeightEqualToMinHeight" stepKey="validateContentTypeHeightStorefront">
+            <argument name="content" value="{{ColumnOnFrontend.baseCSS}}"/>
+        </actionGroup>
+    </test>
     <test name="ColumnConfigurationHasVerticalAlignment">
         <annotations>
             <features value="PageBuilder"/>