:feat: Add steps for imagify template and enable new scenario #129

src/features/ll-lcp.feature

@@ -18,15 +18,22 @@ Feature: Lazyload with LCP
     And I visit the urls and check for lazyload
     Then lcp and atf images are not written to LL format
 
-  #Scenario: Should exclude next-gen lcp/atf from LL
-  #  Given I install plugin 'imagify'
-  #  And plugin 'imagify' is activated
-  #  When I am logged in
-  #  And I go to 'wp-admin/options-general.php?page=imagify'
-  #  And I save imagify API key
-  #  And display next-gen is enabled on imagify
-  #  And I visit page 'lcp_with_imagify' with browser dimension 1600 x 700
-#    And page 'lcp_with_imagify' with images having next-gen avif, webp, avif/webp, no next gen is visited # I didn't get that
+  Scenario: Should exclude next-gen lcp/atf from LL
+    Given I install plugin 'imagify'
+    And plugin 'imagify' is activated
+    When I am logged in
+    And I go to 'wp-admin/options-general.php?page=imagify'
+    And I save imagify API key
+    And display next-gen is enabled on imagify
+    When I log out
+    And I visit page 'lcp_with_imagify' with browser dimension 1600 x 700
+    When I am logged in
+    And I save settings 'media' 'lazyloadCssBgImg'
+    And I clear cache
+    And I visit the 'lcp_with_imagify' and check for lazyload
+    Then lcp and atf images are not written to LL format
+
+
   #  When I clear cache
   #  And I visit page 'lcp_with_imagify' with browser dimension 1600 x 700
   #  Then lcp image markup is not written to LL format

src/support/steps/lcp-beacon-script.ts

@@ -63,7 +63,6 @@ When('I visit the urls and check for lazyload', async function (this: ICustomWor
             }, key);
         }
     }
-
 });
 /**
  * Executes step to visit page based on the form factor(desktop/mobile) and get the LCP/ATF data from DB.
@@ -245,4 +244,28 @@ Then('lcp and atf images are not written to LL format', async function (this: IC
 
     // Fail test when there is expectation mismatch.
     expect(truthy).toBeTruthy();
+});
+
+When('I visit the {string} and check for lazyload', async function (this: ICustomWorld, url: string) {
+    await this.page.setViewportSize({
+        width: 1600,
+        height: 700
+    });
+
+    await this.utils.visitPage(url);
+
+    lcpLLImages = await this.page.evaluate((url) => {
+        const images = document.querySelectorAll('img'),
+            result = {};
+
+        Array.from(images).forEach((img) => {
+            result[url] = {
+                src: img.getAttribute('src'),
+                url: url,
+                lazyloaded: img.classList.contains('lazyloaded')
+            }
+        });
+
+        return result;
+    }, url);
 });