@testivai/witness-playwright 1.3.2 → 1.4.0

package/dist/config/loader.js

@@ -138,7 +138,8 @@ function mergeTestConfig(projectConfig, testConfig) {
         // the selectors (masked for a long time by the diff engine's cumulated
         // threshold absorbing the tiny leaked pixels).
         ignoreSelectors: testConfig.ignoreSelectors,
-        stabilize: testConfig.stabilize
+        stabilize: testConfig.stabilize,
+        mask: testConfig.mask
     };
 }
 /**

package/dist/snapshot.js

@@ -408,6 +408,61 @@ async function snapshot(page, testInfo, name, config) {
                 console.warn('[TestivAI] DOM capture failed (noise-hint will be unavailable):', err);
             }
         }
+        // Mask support: record per-call mask specs and capture geometry for
+        // every selector mask (config + per-call) via getBoundingClientRect.
+        // The DOM snapshot carries no layout, so comparison-time selector
+        // masks depend on these rects; when absent, the compare degrades to
+        // a visible warning. Best-effort — never breaks the capture.
+        try {
+            const perCallMasks = effectiveConfig.mask ?? [];
+            const configMaskEntries = readConfigMasks(process.cwd());
+            const selectorMasks = [
+                ...configMaskEntries.filter((m) => typeof m === 'string'),
+                ...perCallMasks.filter((m) => typeof m === 'string'),
+            ];
+            const uniqueSelectors = [...new Set(selectorMasks)];
+            let maskRects = [];
+            if (uniqueSelectors.length > 0) {
+                maskRects = await page.evaluate((selectors) => {
+                    const dpr = window.devicePixelRatio || 1;
+                    const out = [];
+                    for (const sel of selectors) {
+                        try {
+                            document.querySelectorAll(sel).forEach((el) => {
+                                const r = el.getBoundingClientRect();
+                                if (r.width > 0 && r.height > 0) {
+                                    out.push({
+                                        selector: sel,
+                                        x: Math.round((r.x + window.scrollX) * dpr),
+                                        y: Math.round((r.y + window.scrollY) * dpr),
+                                        width: Math.round(r.width * dpr),
+                                        height: Math.round(r.height * dpr),
+                                    });
+                                }
+                            });
+                        }
+                        catch {
+                            // invalid selector — the compare side will warn
+                        }
+                    }
+                    return out;
+                }, uniqueSelectors);
+            }
+            const geometricCallMasks = perCallMasks.filter((m) => typeof m !== 'string');
+            const callSelectorMasks = perCallMasks.filter((m) => typeof m === 'string');
+            if (geometricCallMasks.length > 0 || callSelectorMasks.length > 0 || maskRects.length > 0) {
+                await fs.writeJson(path.join(localSnapshotDir, 'metadata.json'), {
+                    name: snapshotName,
+                    timestamp: new Date(timestamp).toISOString(),
+                    ...(geometricCallMasks.length > 0 ? { masks: geometricCallMasks } : {}),
+                    ...(callSelectorMasks.length > 0 ? { maskSelectors: callSelectorMasks } : {}),
+                    ...(maskRects.length > 0 ? { maskRects } : {}),
+                });
+            }
+        }
+        catch {
+            // metadata is an enhancement; the screenshot path never depends on it
+        }
     }
     // 2. Dump page structure (HTML) - skip in local mode
     // @renamed: domPath → structurePath (IP protection)
@@ -709,3 +764,17 @@ async function snapshot(page, testInfo, name, config) {
         structureAnalysis
     });
 }
+/**
+ * Read the global `mask` list from .testivai/config.json (selector strings
+ * and geometric objects). Returns [] when absent or malformed.
+ */
+function readConfigMasks(projectRoot) {
+    try {
+        const raw = fs.readFileSync(path.join(projectRoot, '.testivai', 'config.json'), 'utf-8');
+        const parsed = JSON.parse(raw);
+        return Array.isArray(parsed?.mask) ? parsed.mask : [];
+    }
+    catch {
+        return [];
+    }
+}

package/dist/types.d.ts

@@ -239,6 +239,18 @@ export interface TestivAIConfig {
      * or in `testivai.config.ts`. Per-snapshot values win.
      */
     stabilize?: boolean;
+    /**
+     * Masks for this snapshot: areas excluded from the pixel diff and
+     * hatched in the report (auditable — never silent). Each entry is a
+     * CSS selector string (geometry recorded at capture time) or a
+     * geometric region — px numbers, 0–1 ratios, "NN%" strings, or a
+     * single-edge shorthand like { top: 24 }.
+     *
+     * Merged with the global `mask` list from `.testivai/config.json`.
+     * Unlike `ignoreSelectors` (which hides elements during capture),
+     * masks act at comparison time and stay visible in the diff output.
+     */
+    mask?: Array<string | Record<string, number | string>>;
 }
 /**
  * Layout/Bounding box data for an element

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@testivai/witness-playwright",
-  "version": "1.3.2",
+  "version": "1.4.0",
   "description": "Playwright sensor for Testivai Visual Regression Test system",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -48,7 +48,7 @@
     "sharp": "^0.34.5",
     "simple-git": "^3.21.0",
     "@testivai/common": "0.2.2",
-    "@testivai/witness": "1.3.0"
+    "@testivai/witness": "1.4.0"
   },
   "devDependencies": {
     "@playwright/test": "^1.60.0",