Merge pull request #427 from LambdaTest/dev

DevToMaster

Author: abhishek-lambda

accessibility/plugin/index.js

@@ -1,5 +1,29 @@
 const fs = require("fs");
 const path = require('path');
+
+function getImageResolution(buffer) {
+  try {
+    if (buffer.length < 24) {
+      return { width: 0, height: 0 };
+    }
+    
+    const pngSignature = [0x89, 0x50, 0x4E, 0x47, 0x0D, 0x0A, 0x1A, 0x0A];
+    for (let i = 0; i < 8; i++) {
+      if (buffer[i] !== pngSignature[i]) {
+        return { width: 0, height: 0 };
+      }
+    }
+  
+    const width = buffer.readUInt32BE(16);
+    const height = buffer.readUInt32BE(20);
+    
+    return { width, height };
+  } catch (error) {
+    console.error(`Error extracting image resolution: ${error.message}`);
+    return { width: 0, height: 0 };
+  }
+}
+
 const Accessibility = (on, config) => {
 
     on('task', {
@@ -25,6 +49,43 @@ const Accessibility = (on, config) => {
           } else {
             return { exists: false, content: null }; // Return null if the file doesn't exist
           }
+        },
+        convertScreenshotToBase64(filePath) {
+          try {
+            const fullPath = path.resolve(filePath);
+            
+            if (fs.existsSync(fullPath)) {
+              const imageBuffer = fs.readFileSync(fullPath);
+              const base64String = imageBuffer.toString('base64');
+              
+              const imageResolution = getImageResolution(imageBuffer);
+              return {
+                base64: base64String,
+                resolution: imageResolution
+              };
+            } else {
+              console.log(`Screenshot file not found at: ${fullPath}`);
+              return null;
+            }
+          } catch (error) {
+            console.error(`Error converting screenshot to base64: ${error.message}`);
+            return null;
+          }
+        },
+        deleteFile(filePath) {
+          try {
+            const fullPath = path.resolve(filePath);
+            if (fs.existsSync(fullPath)) {
+              fs.unlinkSync(fullPath);
+              return true;
+            } else {
+              console.log(`File not found for deletion: ${filePath}`);
+              return false;
+            }
+          } catch (error) {
+            console.error(`Error deleting file: ${error.message}`);
+            return false;
+          }
         }
   })
 
@@ -70,6 +131,7 @@ const Accessibility = (on, config) => {
       config.env.ACCESSIBILITY = process.env.ACCESSIBILITY;
       config.env.TEST_ID = process.env.TEST_ID;
       config.env.ACCESSIBILITY_OVERIDE_COMMANDS = process.env.ACCESSIBILITY_OVERIDE_COMMANDS;
+      config.env.CAPTURE_SCREENSHOT_ENABLED = process.env.CAPTURE_SCREENSHOT_ENABLED;
       config.env.GENERATE_REPORT_API = process.env.GENERATE_REPORT_API || "NA";
       console.log(`parameter for accessibility report ACCESSIBILITY - ` + config.env.ACCESSIBILITY)
       console.log(`parameter for accessibility report WCAG_CRITERIA - ` + config.env.WCAG_CRITERIA)
@@ -80,7 +142,7 @@ const Accessibility = (on, config) => {
       console.log(`parameter for accessibility report ACCESSIBILITY_EXTENSION_PATH -` + process.env.ACCESSIBILITY_EXTENSION_PATH)
       console.log(`parameter for accessibility report ACCESSIBILITY_OVERIDE_COMMANDS -` + config.env.ACCESSIBILITY_OVERIDE_COMMANDS)
       console.log(`parameter for accessibility report GENERATE_REPORT_API -` + config.env.GENERATE_REPORT_API)
-
+      console.log(`parameter for accessibility report CAPTURE_SCREENSHOT_ENABLED -` + config.env.CAPTURE_SCREENSHOT_ENABLED)
 
       return config;
 }

accessibility/scanner/index.js

@@ -4,6 +4,9 @@ const LambdatestLog = (message) => {
     cy.task('lambdatest_log', message);
 }
 
+let globalScreenshots = null;
+const captureScreenshotEnabled = Cypress.env("CAPTURE_SCREENSHOT_ENABLED") === "true";
+
 const commandsToOverride = [
     'visit', 'click', 'type', 'request', 'dblclick', 'rightclick', 'clear', 'check',
     'uncheck', 'select', 'trigger', 'selectFile', 'scrollIntoView', 'scrollTo',
@@ -40,7 +43,43 @@ const performNewLambdaScan = (originalFn, Subject, stateType, ...args) => {
             if (subjectChainFn !== null && subjectChainFn !== void 0) {
                 cypressCommandChain = subjectChainFn.call(cy);
             }
-            cycustomChaining.performScanSubjectQuery(cypressCommandChain, setTimeout).then({timeout: 30000}, (newSubject) => originalFn(...updateSubj(args, stateType, newSubject)));
+                
+            if (captureScreenshotEnabled) {
+                cy.log('Starting performScanSubjectQuery');
+                cycustomChaining
+                .performScanSubjectQuery(cypressCommandChain, setTimeout)
+                .then({ timeout: 30000 }, (newSubject) => {
+                    const updatedArgs = updateSubj(args, stateType, newSubject);
+                    const screenshotId= crypto.randomUUID();
+                    const screenshotName = 'accessibility-screenshot-'+ screenshotId;
+                    cy.screenshot(screenshotName, { capture: 'fullPage' });
+                    cy.task('convertScreenshotToBase64', `cypress/screenshots/${Cypress.spec.name}/${screenshotName}.png`).then((result) => {
+                        if (result && result.base64) {
+                            const imageUrl = `data:image/png;base64,${result.base64}`;
+                            const imageResolution = result.resolution;
+                            // Create screenshots array
+                            const screenshots = [
+                                {
+                                    image_url: imageUrl,
+                                    image_resolution: `${imageResolution.width}x${imageResolution.height}`,
+                                    screenshotId: screenshotId
+                                }
+                            ];
+                            // Store globally for use in processAccessibilityReport
+                            globalScreenshots = screenshots;                            
+                            
+                            cy.task('deleteFile', `cypress/screenshots/${Cypress.spec.name}/${screenshotName}.png`).then((_) => {
+                            }); 
+                    } else {
+                        cy.log('Failed to process screenshot');
+                    }
+                });
+                const result = originalFn(...updatedArgs);
+                return result;
+              });
+            } else {
+                cycustomChaining.performScanSubjectQuery(cypressCommandChain, setTimeout).then({timeout: 30000}, (newSubject) => originalFn(...updateSubj(args, stateType, newSubject)));
+            }
         }
     }
     runCustomizedChainingCommand();
@@ -124,12 +163,14 @@ const processAccessibilityReport = async (windowNew) => {
         let wcagCriteriaValue = Cypress.env("WCAG_CRITERIA") || "wcag21a";
         let bestPracticeValue = Cypress.env("BEST_PRACTICE") === "true";
         let needsReviewValue = Cypress.env("NEEDS_REVIEW") !== "false"; // Default to true
+        let captureScreenshotEnabled = Cypress.env("CAPTURE_SCREENSHOT_ENABLED") === "true";
 
         const payloadToSend = {
             message: 'SET_CONFIG',
             wcagCriteria: wcagCriteriaValue,
             bestPractice: bestPracticeValue,
-            needsReview: needsReviewValue
+            needsReview: needsReviewValue,
+            captureScreenshotEnabled: captureScreenshotEnabled
         };
 
         console.log('log', "SET SCAN: Payload to send: ", payloadToSend);
@@ -146,6 +187,25 @@ const processAccessibilityReport = async (windowNew) => {
             const payload = {message: 'GET_LATEST_SCAN_DATA'};
             scanData = await getScanData(windowNew, payload);
             LambdatestLog("GET SCAN:LambdaTest Accessibility: Scanning URL");
+            if(captureScreenshotEnabled){
+                if (scanData && scanData.data && scanData.data.length > 0 && globalScreenshots) {
+                    const firstDataItem = scanData.data[0];
+                    if (firstDataItem.events && firstDataItem.events.length > 0) {
+                        const firstEvent = firstDataItem.events[0];
+                        if (firstEvent.issues && firstEvent.issues.length > 0) {
+                            // Update screenshotId with the actual screenshotId
+                            globalScreenshots[0].screenshotId=firstEvent.issues[0].screenshotId;
+                        }
+                    }
+                    for (let i = 0; i < scanData.data.length; i++) {
+                        if (scanData.data[i].screenshots && Array.isArray(scanData.data[i].screenshots)) {
+                            scanData.data[i].screenshots = globalScreenshots;
+                            break;
+                        }
+                    }
+                }
+                globalScreenshots = null;
+            }
         } catch (err) {
             console.error("GET SCAN:Error while setting scan", err);
             return ;

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "lambdatest-cypress-cli",
-  "version": "3.0.38",
+  "version": "3.0.39",
   "description": "The lambdatest-cypress-cli is LambdaTest's command-line interface (CLI) aimed to help you run your Cypress tests on LambdaTest platform.",
   "homepage": "https://github.com/LambdaTest/lambdatest-cypress-cli",
   "author": "LambdaTest <[email protected]>",