@applitools/eyes-playwright 1.40.7 → 1.41.0

package/CHANGELOG.md

@@ -1,5 +1,43 @@
 # Changelog
 
+## [1.41.0](https://github.com/Applitools-Dev/sdk/compare/js/eyes-playwright@1.40.7...js/eyes-playwright@1.41.0) (2025-11-03)
+
+
+### Features
+
+* new plugin to support legacy playwright and pw 1-55 and above html reporter ([#3302](https://github.com/Applitools-Dev/sdk/issues/3302)) ([946d971](https://github.com/Applitools-Dev/sdk/commit/946d971abd0c7b86c1254bd5a7759eb1729fc7cb))
+
+
+### Dependencies
+
+* @applitools/dom-snapshot bumped to 4.14.0
+  #### Features
+
+  * logging errors from dom snapshot to the backend | AD-11641 ([#3291](https://github.com/Applitools-Dev/sdk/issues/3291)) ([7f5b487](https://github.com/Applitools-Dev/sdk/commit/7f5b48701ff93bf980924c9346a8241ed87f5a56))
+
+
+  #### Bug Fixes
+
+  * sandbox prototype pollution | FLD-3738 ([#3310](https://github.com/Applitools-Dev/sdk/issues/3310)) ([3185558](https://github.com/Applitools-Dev/sdk/commit/31855586851d5372169aae7bf0268cec139abc59))
+
+
+  #### Code Refactoring
+
+  * blob generation error handling ([#2501](https://github.com/Applitools-Dev/sdk/issues/2501)) ([94bc14f](https://github.com/Applitools-Dev/sdk/commit/94bc14faf3de0fd9a8ca24af4870f839756a8aad))
+* @applitools/ufg-client bumped to 1.18.0
+  #### Features
+
+  * logging errors from dom snapshot to the backend | AD-11641 ([#3291](https://github.com/Applitools-Dev/sdk/issues/3291)) ([7f5b487](https://github.com/Applitools-Dev/sdk/commit/7f5b48701ff93bf980924c9346a8241ed87f5a56))
+* @applitools/core bumped to 4.51.0
+  #### Features
+
+  * logging errors from dom snapshot to the backend | AD-11641 ([#3291](https://github.com/Applitools-Dev/sdk/issues/3291)) ([7f5b487](https://github.com/Applitools-Dev/sdk/commit/7f5b48701ff93bf980924c9346a8241ed87f5a56))
+
+
+
+* @applitools/eyes bumped to 1.36.14
+
+
 ## [1.40.7](https://github.com/Applitools-Dev/sdk/compare/js/eyes-playwright@1.40.6...js/eyes-playwright@1.40.7) (2025-10-22)
 
 

package/dist/fixture/report-plugin/core/log.js

@@ -0,0 +1,44 @@
+'use strict';
+Object.defineProperty(exports, "__esModule", { value: true });
+/* eslint no-console: off */
+function isDebugEnabled() {
+    try {
+        // Get query string from the topmost window (parent frame)
+        const topWindow = window.top || window;
+        const urlParams = new URLSearchParams(topWindow.location.search);
+        return urlParams.get('debug') === 'true';
+    }
+    catch (e) {
+        // Cross-origin access may throw an error, fallback to current window
+        try {
+            const urlParams = new URLSearchParams(window.location.search);
+            return urlParams.get('debug') === 'true';
+        }
+        catch (e2) {
+            return false;
+        }
+    }
+}
+function makeLog(prefix = '') {
+    const debugEnabled = isDebugEnabled();
+    return {
+        log: (...args) => {
+            if (!debugEnabled)
+                return;
+            const logArgs = prefix ? [prefix, ...args] : args;
+            console.log(...logArgs);
+        },
+        warn: (...args) => {
+            if (!debugEnabled)
+                return;
+            const logArgs = prefix ? [prefix, ...args] : args;
+            console.warn(...logArgs);
+        },
+        error: (...args) => {
+            // Always show errors regardless of debug mode
+            const logArgs = prefix ? [prefix, ...args] : args;
+            console.error(...logArgs);
+        },
+    };
+}
+exports.default = makeLog;

package/dist/fixture/report-plugin/core/types.js

@@ -0,0 +1,5 @@
+"use strict";
+/**
+ * Shared TypeScript type definitions for Eyes Playwright Reporter Plugin
+ */
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/fixture/report-plugin/data/dataParser.js

@@ -0,0 +1,126 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getTestResults = void 0;
+const jszip_1 = __importDefault(require("jszip"));
+const statusUtils_js_1 = require("../management/statusUtils.js");
+const playwrightStatusUpdater_js_1 = require("../management/playwrightStatusUpdater.js");
+const reportDataManager_js_1 = require("../management/reportDataManager.js");
+const log_js_1 = __importDefault(require("../core/log.js"));
+const logger = (0, log_js_1.default)('[Eyes Data Parser]');
+async function getTestResults() {
+    var _a;
+    // Step 1: Get Playwright report data from window object
+    const reportData = window.playwrightReportBase64;
+    const playwrightReportBase64 = typeof reportData === 'string' ? reportData : (_a = reportData === null || reportData === void 0 ? void 0 : reportData.textContent) !== null && _a !== void 0 ? _a : '';
+    if (!playwrightReportBase64) {
+        logger.error('[Eyes Data Parser] No playwrightReportBase64 found in window');
+        return {
+            testsFiles: {},
+            report: { files: [], stats: { expected: 0, unexpected: 0, flaky: 0, skipped: 0 } },
+            eyesTestResult: {},
+            sessionsByBatchId: {},
+        };
+    }
+    const base64Data = playwrightReportBase64.replace('data:application/zip;base64,', '');
+    // Step 2: Unzip the report data
+    const zip = new jszip_1.default();
+    await zip.loadAsync(base64Data, { base64: true });
+    // Step 3: Extract all test files (except report.json)
+    const resultsByTestFile = await Promise.all(Object.keys(zip.files)
+        .filter(fileName => fileName !== 'report.json')
+        .map(async (fileName) => {
+        const file = zip.files[fileName];
+        const content = await file.async('text');
+        return { [fileName]: JSON.parse(content) };
+    }));
+    const testsFiles = Object.assign({}, ...resultsByTestFile);
+    // Step 4: Extract report.json
+    const reportFileObj = zip.file('report.json');
+    if (!reportFileObj) {
+        throw new Error('[Eyes Data Parser] report.json not found in ZIP');
+    }
+    const reportFile = await reportFileObj.async('text');
+    const report = JSON.parse(reportFile);
+    // Step 5: Merge Eyes data from window.__testResultsMap
+    const { eyesTestResult, sessionsByBatchId } = mergeEyesData(testsFiles, report);
+    // Step 6: Re-zip and update window.playwrightReportBase64 with modified test statuses
+    // This is critical! The test statuses have been modified in memory by updatePlaywrightTestStatus
+    // We need to re-zip the data so Playwright's UI sees the updated statuses
+    await (0, reportDataManager_js_1.refreshReportData)(testsFiles, report);
+    return {
+        testsFiles,
+        report,
+        eyesTestResult,
+        sessionsByBatchId,
+    };
+}
+exports.getTestResults = getTestResults;
+/**
+ * Merge Eyes data from window.__testResultsMap with Playwright tests
+ */
+function mergeEyesData(testsFiles, report) {
+    const sessionsByBatchId = {};
+    const eyesTestResult = {};
+    // Check if Eyes data exists
+    if (!window.__testResultsMap) {
+        logger.warn('[Eyes Data Parser] No window.__testResultsMap found - no Eyes data to merge');
+        return { eyesTestResult, sessionsByBatchId };
+    }
+    // Iterate through all test files
+    Object.values(testsFiles).forEach(testFile => {
+        // Find file in report for status updates
+        const fileInReport = report.files.find(file => file.fileId === testFile.fileId);
+        if (!fileInReport)
+            return;
+        testFile.tests.forEach(test => {
+            const eyesResults = [];
+            const eyesStatuses = [];
+            // Look up Eyes results for each test retry
+            test.results.forEach((_result, index) => {
+                var _a;
+                const lookupKey = `${test.testId}--${index}`;
+                const eyesResultsForRetry = (_a = window.__testResultsMap) === null || _a === void 0 ? void 0 : _a[lookupKey];
+                if (eyesResultsForRetry) {
+                    // Get status for this retry
+                    const status = (0, statusUtils_js_1.getStatus)(eyesResultsForRetry);
+                    eyesStatuses.push(status.status);
+                    eyesResultsForRetry.forEach(eyesResult => {
+                        // Attach retry number to Eyes result
+                        eyesResult.playwrightRetry = _result.retry || 0;
+                        // Add to results array
+                        eyesResults.push(eyesResult);
+                        // Build sessionsByBatchId for polling
+                        if (!sessionsByBatchId[eyesResult.batchId]) {
+                            sessionsByBatchId[eyesResult.batchId] = {
+                                sessions: [],
+                                apiKey: eyesResult.eyesServer.apiKey,
+                                eyesServerUrl: eyesResult.eyesServer.eyesServerUrl,
+                            };
+                        }
+                        sessionsByBatchId[eyesResult.batchId].sessions.push({
+                            id: eyesResult.id,
+                            accessToken: eyesResult.secretToken,
+                        });
+                    });
+                }
+                else {
+                    // No Eyes results for this retry
+                    eyesStatuses.push(null);
+                }
+            });
+            // If test has Eyes results, add to eyesTestResult
+            if (eyesResults.length > 0) {
+                // Update Playwright test status based on Eyes results
+                (0, playwrightStatusUpdater_js_1.updatePlaywrightTestStatus)(test, fileInReport, report.stats, eyesStatuses, true);
+                eyesTestResult[test.testId] = {
+                    ...test,
+                    eyesResults,
+                };
+            }
+        });
+    });
+    return { eyesTestResult, sessionsByBatchId };
+}

package/dist/fixture/report-plugin/data/uiUtils.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createEyesInfo = void 0;
+function createEyesInfo(statusInfo, addVisualIcon = true) {
+    const visualIcon = addVisualIcon ? `<span class="visual-test-icon">${window.__icons.visualTest}</span>` : '';
+    const statusBar = `<div class="status-bar ${statusInfo.status.toLowerCase()}"></div>`;
+    const statusText = `<span class="status-text">${statusInfo.statusText}</span>`;
+    return `${visualIcon}${statusBar}${statusText}`;
+}
+exports.createEyesInfo = createEyesInfo;

package/dist/fixture/report-plugin/data/urlManager.js

@@ -0,0 +1,53 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.fixEyesUrl = exports.isTestDetailMode = exports.isListMode = exports.getTestIdFromUrl = exports.getHashValueFromUrl = exports.getHashFromUrl = exports.getHashFromUrlString = exports.getHashFromCurrentUrl = void 0;
+const log_1 = __importDefault(require("../core/log"));
+const logger = (0, log_1.default)();
+function getHashFromCurrentUrl() {
+    return getHashFromUrl(window.location);
+}
+exports.getHashFromCurrentUrl = getHashFromCurrentUrl;
+function getHashFromUrlString(urlString) {
+    const url = new URL(urlString);
+    return getHashFromUrl(url);
+}
+exports.getHashFromUrlString = getHashFromUrlString;
+function getHashFromUrl(url) {
+    const hash = new URLSearchParams(url.hash.replace('#', '').replace('?', ''));
+    return hash;
+}
+exports.getHashFromUrl = getHashFromUrl;
+function getHashValueFromUrl(urlString, key) {
+    const hash = getHashFromUrlString(urlString);
+    return hash.get(key);
+}
+exports.getHashValueFromUrl = getHashValueFromUrl;
+function getTestIdFromUrl(urlString) {
+    return getHashValueFromUrl(urlString, 'testId');
+}
+exports.getTestIdFromUrl = getTestIdFromUrl;
+function isListMode() {
+    const hash = getHashFromCurrentUrl();
+    return !hash.get('testId');
+}
+exports.isListMode = isListMode;
+function isTestDetailMode() {
+    return !isListMode();
+}
+exports.isTestDetailMode = isTestDetailMode;
+function fixEyesUrl(url) {
+    try {
+        const urlObj = new URL(url);
+        urlObj.hostname = urlObj.hostname.replace('eyesapi', 'eyes');
+        const fixedUrl = urlObj.href;
+        return fixedUrl.endsWith('/') ? fixedUrl : `${fixedUrl}/`;
+    }
+    catch (error) {
+        logger.warn('[URL Manager] Invalid URL:', url);
+        return url;
+    }
+}
+exports.fixEyesUrl = fixEyesUrl;

package/dist/fixture/report-plugin/handlers/domChangesHandler.js

@@ -0,0 +1,58 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DomChangesHandler = void 0;
+const urlManager_js_1 = require("../data/urlManager.js");
+class DomChangesHandler {
+    constructor(waitForResults, filterManager, eyesResultsBatchLinkUI, navigationUI, testListUI) {
+        this._navigationReadyCalled = false;
+        this.handleDomChanges = (mutations) => {
+            mutations.forEach(mutation => {
+                mutation.addedNodes.forEach(node => {
+                    if (!(node instanceof HTMLElement))
+                        return;
+                    if (node.classList.contains('eyes-batch-link')) {
+                        return;
+                    }
+                    if (node.classList.contains('htmlreport')) {
+                        const hash = (0, urlManager_js_1.getHashFromCurrentUrl)();
+                        this.filterManager.applyFiltersFromUrl(hash);
+                    }
+                    if (node.classList.contains('chip')) {
+                        this.waitForResults.then(testResults => {
+                            this.eyesResultsBatchLinkUI.createLinkToBatch(testResults);
+                        });
+                    }
+                    const isHeaderElement = node.classList.contains('header-view-status-container') ||
+                        node.getElementsByClassName('header-view-status-container').length > 0;
+                    if (isHeaderElement) {
+                        this.onNavigationReady();
+                    }
+                    const hasTestRows = node.getElementsByClassName('test-file-details-row').length > 0;
+                    if (hasTestRows) {
+                        this.waitForResults.then(testResults => {
+                            this.testListUI.addEyesDetailsToTests(node, testResults);
+                        });
+                    }
+                });
+            });
+        };
+        this.waitForResults = waitForResults;
+        this.filterManager = filterManager;
+        this.eyesResultsBatchLinkUI = eyesResultsBatchLinkUI;
+        this.navigationUI = navigationUI;
+        this.testListUI = testListUI;
+    }
+    onNavigationReady() {
+        if (this._navigationReadyCalled) {
+            return;
+        }
+        this._navigationReadyCalled = true;
+        this.waitForResults.then(testResults => {
+            setTimeout(() => {
+                this.navigationUI.createFilters(testResults);
+                this.navigationUI.updateActiveStates();
+            }, 200);
+        });
+    }
+}
+exports.DomChangesHandler = DomChangesHandler;

package/dist/fixture/report-plugin/handlers/statusUpdateHandler.js

@@ -0,0 +1,52 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.StatusUpdateHandler = void 0;
+const urlManager_js_1 = require("../data/urlManager.js");
+const log_1 = __importDefault(require("../core/log"));
+const logger = (0, log_1.default)();
+class StatusUpdateHandler {
+    constructor(scrollPreserver, eyesResultsBatchLinkUI, navigationUI, testListUI, testDetailUI) {
+        this.handleStatusUpdate = async (testResults) => {
+            // Capture scroll position before triggering window.onload
+            this.scrollPreserver.captureScrollPosition();
+            if (typeof window.onload === 'function') {
+                const onloadHandler = window.onload;
+                onloadHandler(new Event('load'));
+            }
+            setTimeout(() => {
+                const hash = (0, urlManager_js_1.getHashFromCurrentUrl)();
+                const testId = hash.get('testId');
+                if (!testId) {
+                    this.eyesResultsBatchLinkUI.createLinkToBatch(testResults);
+                }
+                this.navigationUI.resetFilters();
+                this.navigationUI.createFilters(testResults);
+                this.navigationUI.updateActiveStates();
+                if (!testId) {
+                    const rootElement = document.getElementById('root');
+                    if (rootElement) {
+                        this.testListUI.addEyesDetailsToTests(rootElement, testResults);
+                    }
+                }
+                if (testId) {
+                    logger.log('[Status Update Handler] Updating Eyes test result UI for testId:', testId);
+                    const test = testResults.eyesTestResult[testId];
+                    if (test) {
+                        this.testDetailUI.createEyesTestResults(test);
+                    }
+                }
+                // Restore scroll position after React has re-rendered
+                this.scrollPreserver.restoreScrollPosition();
+            }, 200);
+        };
+        this.scrollPreserver = scrollPreserver;
+        this.eyesResultsBatchLinkUI = eyesResultsBatchLinkUI;
+        this.navigationUI = navigationUI;
+        this.testListUI = testListUI;
+        this.testDetailUI = testDetailUI;
+    }
+}
+exports.StatusUpdateHandler = StatusUpdateHandler;

package/dist/fixture/report-plugin/handlers/urlChangeHandler.js

@@ -0,0 +1,52 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.UrlChangeHandler = void 0;
+const urlManager_js_1 = require("../data/urlManager.js");
+const log_1 = __importDefault(require("../core/log"));
+const logger = (0, log_1.default)();
+class UrlChangeHandler {
+    constructor(waitForResults, navigationState, filterManager, eyesResultsBatchLinkUI, navigationUI, testDetailUI) {
+        this.handleUrlChange = () => {
+            const hash = (0, urlManager_js_1.getHashFromCurrentUrl)();
+            const testId = hash.get('testId');
+            const previousTestId = this.navigationState.activeTestId;
+            const fromTestToMain = !testId && previousTestId;
+            if (!testId) {
+                this.filterManager.applyFiltersFromUrl(hash);
+                this.navigationUI.updateActiveStates();
+            }
+            this.waitForResults.then(testResults => {
+                logger.log('[URL Change Handler] Handling URL change. testId:', testId);
+                this.eyesResultsBatchLinkUI.createLinkToBatch(testResults);
+                if (testId) {
+                    const test = testResults.eyesTestResult[testId];
+                    if (test) {
+                        // Don't set activeTestId here - let TestDetailUI own the state setting
+                        this.testDetailUI.createEyesTestResults(test);
+                    }
+                    else {
+                        this.testDetailUI.cleanupExistingChips();
+                        this.navigationState.clearActiveTestId();
+                    }
+                }
+                else if (fromTestToMain) {
+                    this.testDetailUI.cleanupExistingChips();
+                    this.testDetailUI.cancelPendingOperations();
+                }
+            });
+        };
+        this.waitForResults = waitForResults;
+        this.navigationState = navigationState;
+        this.filterManager = filterManager;
+        this.eyesResultsBatchLinkUI = eyesResultsBatchLinkUI;
+        this.navigationUI = navigationUI;
+        this.testDetailUI = testDetailUI;
+    }
+    get activeTestId() {
+        return this.navigationState.activeTestId;
+    }
+}
+exports.UrlChangeHandler = UrlChangeHandler;

package/dist/fixture/report-plugin/management/playwrightStatusUpdater.js

@@ -0,0 +1,73 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.updateAllPlaywrightTestStatuses = exports.updatePlaywrightTestStatus = exports.getRunStatusFromEyesStatuses = exports.getOutcomeFromEyesStatuses = void 0;
+const statusUtils_js_1 = require("./statusUtils.js");
+function getOutcomeFromEyesStatuses(eyesStatuses, testOutcome) {
+    return eyesStatuses.every(status => status === 'unresolved' || status === 'failed')
+        ? 'unexpected'
+        : eyesStatuses.some(status => status === 'unresolved' || status === 'failed')
+            ? 'flaky'
+            : testOutcome;
+}
+exports.getOutcomeFromEyesStatuses = getOutcomeFromEyesStatuses;
+function getRunStatusFromEyesStatuses(eyesStatus, runStatus) {
+    return eyesStatus === 'unresolved' || eyesStatus === 'failed' ? 'failed' : runStatus;
+}
+exports.getRunStatusFromEyesStatuses = getRunStatusFromEyesStatuses;
+function updatePlaywrightTestStatus(test, fileInReport, reportStats, eyesStatuses, updateOriginalOutcome = false) {
+    var _a, _b;
+    if (eyesStatuses.filter(status => status !== null).length > 0 &&
+        // test outcome: 'skipped' | 'expected' | 'unexpected' | 'flaky'
+        ['expected', 'flaky'].includes((_a = test.originalOutcome) !== null && _a !== void 0 ? _a : test.outcome)) {
+        test.results.forEach((_result, index) => {
+            var _a, _b;
+            const eyesStatus = eyesStatuses[index];
+            // run status: 'passed' | 'failed' | 'timedOut' | 'skipped' | 'interrupted'
+            if (((_a = _result.originalStatus) !== null && _a !== void 0 ? _a : _result.status) === 'passed' && eyesStatus !== null) {
+                if (updateOriginalOutcome)
+                    _result.originalStatus = _result.status;
+                _result.status = getRunStatusFromEyesStatuses(eyesStatus, (_b = _result.originalStatus) !== null && _b !== void 0 ? _b : _result.status);
+            }
+        });
+        const testInReport = fileInReport.tests.find(t => t.testId === test.testId);
+        if (!testInReport)
+            return;
+        if (updateOriginalOutcome) {
+            testInReport.originalOutcome = test.originalOutcome = test.outcome;
+        }
+        const newOutcome = getOutcomeFromEyesStatuses(eyesStatuses.filter((status) => status !== null), (_b = test.originalOutcome) !== null && _b !== void 0 ? _b : test.outcome);
+        if (testInReport.outcome !== newOutcome) {
+            reportStats[testInReport.outcome]--;
+            reportStats[newOutcome]++;
+        }
+        testInReport.outcome = test.outcome = newOutcome;
+    }
+}
+exports.updatePlaywrightTestStatus = updatePlaywrightTestStatus;
+function updateAllPlaywrightTestStatuses(testResults) {
+    Object.values(testResults.testsFiles).forEach(testFile => {
+        const fileInReport = testResults.report.files.find(file => file.fileId === testFile.fileId);
+        const reportStats = testResults.report.stats;
+        testFile.tests.forEach(test => {
+            var _a;
+            const eyesResultsForTest = (_a = testResults.eyesTestResult[test.testId]) === null || _a === void 0 ? void 0 : _a.eyesResults;
+            if (!eyesResultsForTest)
+                return;
+            if (!fileInReport)
+                return;
+            // Get Eyes status for each retry
+            const eyesStatuses = test.results.reduce((results, _result) => {
+                const eyesResultsForRun = eyesResultsForTest.filter(result => result.playwrightRetry === _result.retry);
+                if (eyesResultsForRun.length > 0) {
+                    results.push((0, statusUtils_js_1.getStatus)(eyesResultsForRun).status);
+                }
+                else {
+                    results.push(null);
+                }
+                return results;
+            }, []);
+            updatePlaywrightTestStatus(test, fileInReport, reportStats, eyesStatuses);
+        });
+    });
+}
+exports.updateAllPlaywrightTestStatuses = updateAllPlaywrightTestStatuses;