Merge pull request #78 from magento-trigger/team3-delivery-tech-debt

[Team 3] Tech Debt for Image

Author: irenelagno

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

@@ -46,7 +46,8 @@
         <element name="base" type="text" selector="(//div[contains(@class,'pagebuilder-content-type') and contains(@class,'pagebuilder-image')])[{{arg1}}]" parameterized="true"/>
         <element name="attachImageBtn" type="button" selector="//div[@class='pagebuilder-image-uploader-container']//input[@name='image']" />
         <element name="imageContentTypeByIndex" type="button" selector="//div[contains(@class, 'pagebuilder-content-type') and contains(@class, 'pagebuilder-image')][1]//img[contains(@src,'{{var1}}')]" parameterized="true"/>
-        <element name="imagePreview" type="button" selector="//div[@class='preview-image-container']" />
+        <element name="imageEmptyPreview" type="text" selector="//div[contains(concat(' ', normalize-space(@class), ' '), ' pagebuilder-image-empty-preview ')]" />
+        <element name="imagePreview" type="text" selector="//img[contains(concat(' ', normalize-space(@class), ' '), ' preview-image ')]" />
         <element name="imageSourceOnStage" type="text" selector="//img[contains(@src,'{{var1}}')]" parameterized="true" />
         <element name="selectFromGalleryBtn" type="button" selector="//figure//div[@class='file-uploader-area']//label[text()='Select from Gallery']"/>
         <element name="selectFromGalleryImageBtn" type="button" selector="//ul[@class='pagebuilder-options-links']//label[text()='Select from Gallery']"/>

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

@@ -593,7 +593,7 @@
         </actionGroup>
         <!-- Validate Stage -->
         <comment userInput="Validate Stage" stepKey="commentValidateStage"/>
-        <seeElement selector="{{ImageOnStage.imagePreview}}" stepKey="seeImagePreview"/>
+        <seeElement selector="{{ImageOnStage.imageEmptyPreview}}" stepKey="seeImageEmptyPreview"/>
         <actionGroup ref="saveAndContinueEditCmsPage" stepKey="saveAndContinueEditCmsPage"/>
         <actionGroup ref="navigateToStoreFront" stepKey="navigateToStoreFront">
             <argument name="contentType" value="PageBuilderImageContentType"/>

app/code/Magento/PageBuilder/view/adminhtml/web/template/content-type/image/full-width/preview.html

@@ -7,17 +7,15 @@
 
 <div class="pagebuilder-content-type pagebuilder-image type-nested" event="{ mouseover: onMouseOver, mouseout: onMouseOut }, mouseoverBubble: false">
     <render args="getOptions().template" />
-    <figure ko-style="data.main.style" attr="data.main.attributes" css="data.main.css">
+    <figure attr="data.main.attributes" ko-style="data.main.style" css="data.main.css">
         <scope args="getUploader().getUiComponent()">
             <render />
         </scope>
-        <div class="preview-image-container">
-            <img if="data.desktop_image.attributes().src"
-                 attr="data.desktop_image.attributes"
-                 class="preview-image"
-                 css="data.desktop_image.css"
-                 ko-style="data.desktop_image.style" />
-        </div>
+        <img if="data.desktop_image.attributes().src"
+             attr="data.desktop_image.attributes"
+             class="preview-image"
+             css="data.desktop_image.css"
+             ko-style="data.desktop_image.style" />
         <figcaption if="data.caption.html()"
                     attr="data.caption.attributes"
                     css="data.caption.css"