Resolve MFTF Test failues due to wrong selectors

Author: glo24157

app/code/Magento/Catalog/Test/Mftf/ActionGroup/AssertProductImageStorefrontProductPageActionGroup.xml

@@ -19,7 +19,7 @@
 
         <seeInCurrentUrl url="/{{product.urlKey}}.html" stepKey="checkUrl"/>
         <waitForPageLoad stepKey="waitForPageLoad"/>
-        <waitForElement selector="{{StorefrontProductMediaSection.imageFile(image.filename)}}" stepKey="waitForImage"/>
-        <seeElement selector="{{StorefrontProductMediaSection.imageFile(image.filename)}}" stepKey="seeImage"/>
+        <waitForElement selector="{{StorefrontProductMediaSection.imageFileInGallery(image.filename)}}" stepKey="waitForImage"/>
+        <seeElement selector="{{StorefrontProductMediaSection.imageFileInGallery(image.filename)}}" stepKey="seeImage"/>
     </actionGroup>
 </actionGroups>

app/code/Magento/Catalog/Test/Mftf/Section/StorefrontProductMediaSection.xml

@@ -16,6 +16,7 @@
         <element name="productImageFullscreen" type="text" selector="//*[@data-gallery-role='gallery' and contains(@class, 'fullscreen')]//img[contains(@src, '{{filename}}') and contains(@class, 'full')]" parameterized="true" />
         <element name="closeFullscreenImage" type="button" selector="//*[@data-gallery-role='gallery' and contains(@class, 'fullscreen')]//*[@data-gallery-role='fotorama__fullscreen-icon']" />
         <element name="imageFile" type="text" selector="//div[contains(@class, 'fotorama__active')]//img[contains(@src, '{{filename}}')]" parameterized="true"/>
+        <element name="imageFileInGallery" type="text" selector="//div[contains(@class, 'fotorama__loaded--img')]//img[contains(@src, '{{filename}}')]" parameterized="true"/>
         <element name="productImageActive" type="text" selector=".product.media div[data-active=true] > img[src*='{{filename}}']" parameterized="true"/>
         <element name="productImageInFotorama" type="file" selector=".fotorama__nav__shaft img[src*='{{imageName}}']" parameterized="true" timeout="30"/>
         <element name="fotoramaPrevButton" type="button" selector="//*[@data-gallery-role='gallery']//*[@data-gallery-role='nav-wrap']//*[@data-gallery-role='arrow' and contains(@class, 'fotorama__thumb__arr--left')]" timeout="30"/>

app/code/Magento/Catalog/Test/Mftf/Test/AdminSimpleProductImagesTest/AdminSimpleProductImagesTest.xml

@@ -110,12 +110,12 @@
         <waitForPageLoad stepKey="waitForStorefront"/>
 
         <!-- See all of the images that we uploaded -->
-        <seeElementInDOM selector="{{StorefrontProductMediaSection.imageFile('small')}}" stepKey="seeSmall"/>
-        <seeElementInDOM selector="{{StorefrontProductMediaSection.imageFile('medium')}}" stepKey="seeMedium"/>
-        <seeElementInDOM selector="{{StorefrontProductMediaSection.imageFile('large')}}" stepKey="seeLarge"/>
-        <seeElementInDOM selector="{{StorefrontProductMediaSection.imageFile('gif')}}" stepKey="seeGif"/>
-        <seeElementInDOM selector="{{StorefrontProductMediaSection.imageFile('jpg')}}" stepKey="seeJpg"/>
-        <seeElementInDOM selector="{{StorefrontProductMediaSection.imageFile('png')}}" stepKey="seePng"/>
+        <seeElementInDOM selector="{{StorefrontProductMediaSection.imageFileInGallery('small')}}" stepKey="seeSmall"/>
+        <seeElementInDOM selector="{{StorefrontProductMediaSection.imageFileInGallery('medium')}}" stepKey="seeMedium"/>
+        <seeElementInDOM selector="{{StorefrontProductMediaSection.imageFileInGallery('large')}}" stepKey="seeLarge"/>
+        <seeElementInDOM selector="{{StorefrontProductMediaSection.imageFileInGallery('gif')}}" stepKey="seeGif"/>
+        <seeElementInDOM selector="{{StorefrontProductMediaSection.imageFileInGallery('jpg')}}" stepKey="seeJpg"/>
+        <seeElementInDOM selector="{{StorefrontProductMediaSection.imageFileInGallery('png')}}" stepKey="seePng"/>
 
         <!-- Go to the category page and see a placeholder image for the second product -->
         <amOnPage url="$$category.custom_attributes[url_key]$$.html" stepKey="goToCategoryPage"/>