@testivai/witness-playwright 2.0.8 → 2.0.9

package/dist/capture/full-page.d.ts

@@ -0,0 +1,22 @@
+import type { CDPSession, Page } from '@playwright/test';
+import { type CaptureLog } from '@testivai/witness';
+/**
+ * Full-page screenshot through CDP: wait for a fresh frame, measure the
+ * content, then capture beyond the viewport until two captures in a row match
+ * (at most MAX_STABLE_CAPTURES from @testivai/witness).
+ *
+ * Chrome can hand back a frame painted with styles resolved against the wrong
+ * viewport while it sets up a beyond-viewport capture: on testivai-site's CI,
+ * em-sized text on the home page was drawn at its `max-width: 480px` size in
+ * some captures, so an unchanged page read as 4.13% changed while its measured
+ * layout matched the baseline. See capture/stable-capture.ts in
+ * @testivai/witness, which the standalone CLI shares.
+ *
+ * A stable page costs one extra screenshot.
+ *
+ * @param page The page being captured; used for the in-page frame wait.
+ * @param client A CDP session attached to `page`.
+ * @param log Optional debug sink.
+ * @returns The PNG bytes of the kept capture.
+ */
+export declare function captureFullPageScreenshot(page: Page, client: CDPSession, log?: CaptureLog): Promise<Buffer>;

package/dist/capture/full-page.js

@@ -0,0 +1,42 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.captureFullPageScreenshot = captureFullPageScreenshot;
+const witness_1 = require("@testivai/witness");
+/**
+ * Full-page screenshot through CDP: wait for a fresh frame, measure the
+ * content, then capture beyond the viewport until two captures in a row match
+ * (at most MAX_STABLE_CAPTURES from @testivai/witness).
+ *
+ * Chrome can hand back a frame painted with styles resolved against the wrong
+ * viewport while it sets up a beyond-viewport capture: on testivai-site's CI,
+ * em-sized text on the home page was drawn at its `max-width: 480px` size in
+ * some captures, so an unchanged page read as 4.13% changed while its measured
+ * layout matched the baseline. See capture/stable-capture.ts in
+ * @testivai/witness, which the standalone CLI shares.
+ *
+ * A stable page costs one extra screenshot.
+ *
+ * @param page The page being captured; used for the in-page frame wait.
+ * @param client A CDP session attached to `page`.
+ * @param log Optional debug sink.
+ * @returns The PNG bytes of the kept capture.
+ */
+async function captureFullPageScreenshot(page, client, log) {
+    const waitOnce = async () => (await page.evaluate(witness_1.FRESH_FRAME_EXPRESSION)) === true;
+    const settle = () => (0, witness_1.settleFreshFrame)(waitOnce, log);
+    await settle();
+    const layoutMetrics = await client.send('Page.getLayoutMetrics');
+    const width = Math.ceil(layoutMetrics.contentSize.width);
+    const height = Math.ceil(layoutMetrics.contentSize.height);
+    log?.(`page ${width}x${height}, viewport ${layoutMetrics.layoutViewport?.clientWidth}x${layoutMetrics.layoutViewport?.clientHeight}`);
+    const data = await (0, witness_1.captureUntilStable)({
+        capture: async () => (await client.send('Page.captureScreenshot', {
+            format: 'png',
+            captureBeyondViewport: true,
+            clip: { x: 0, y: 0, width, height, scale: 1 },
+        })).data,
+        settle,
+        log,
+    });
+    return Buffer.from(data, 'base64');
+}

package/dist/snapshot.js

@@ -46,6 +46,7 @@ const loader_1 = require("./config/loader");
 const ignore_selectors_1 = require("./config/ignore-selectors");
 const element_map_1 = require("./capture/element-map");
 const stabilize_1 = require("./config/stabilize");
+const full_page_1 = require("./capture/full-page");
 /**
  * Generates a safe filename from a URL.
  * @param pageUrl The URL of the page.
@@ -322,33 +323,15 @@ async function snapshot(page, testInfo, name, config) {
             });
             // Wait a bit for styles to apply
             await page.waitForTimeout(100);
-            // Get layout metrics to determine full page size
-            const layoutMetrics = await client.send('Page.getLayoutMetrics');
-            // Calculate full page dimensions
-            const pageWidth = Math.ceil(layoutMetrics.contentSize.width);
-            const pageHeight = Math.ceil(layoutMetrics.contentSize.height);
-            if (process.env.TESTIVAI_DEBUG === 'true') {
-                console.log('[TestivAI] Browser layout metrics:', {
-                    pageWidth,
-                    pageHeight,
-                    viewportWidth: layoutMetrics.layoutViewport.clientWidth,
-                    viewportHeight: layoutMetrics.layoutViewport.clientHeight
-                });
-            }
-            // Capture screenshot with captureBeyondViewport: true
-            const screenshot = await client.send('Page.captureScreenshot', {
-                format: 'png',
-                captureBeyondViewport: true,
-                clip: {
-                    x: 0,
-                    y: 0,
-                    width: pageWidth,
-                    height: pageHeight,
-                    scale: 1
-                }
-            });
+            // Wait for a fresh frame, measure, and capture beyond the viewport until
+            // two captures in a row match: Chrome can return a frame painted for the
+            // wrong viewport while it sets up the capture (capture/full-page.ts).
+            const captureLog = process.env.TESTIVAI_DEBUG === 'true'
+                ? (message) => console.log(`[TestivAI] Full-page capture: ${message}`)
+                : undefined;
+            const png = await (0, full_page_1.captureFullPageScreenshot)(page, client, captureLog);
             // Save the screenshot
-            await fs.writeFile(screenshotPath, Buffer.from(screenshot.data, 'base64'));
+            await fs.writeFile(screenshotPath, png);
             // Remove the temporary style tag
             await page.evaluate(`
         const styleTags = document.querySelectorAll('style');

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@testivai/witness-playwright",
-  "version": "2.0.8",
+  "version": "2.0.9",
   "description": "Playwright adapter for TestivAI Witness — local-first visual regression with pixel + DOM comparison",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -46,7 +46,7 @@
   "dependencies": {
     "fs-extra": "^11.4.0",
     "sharp": "^0.35.4",
-    "@testivai/witness": "2.3.1"
+    "@testivai/witness": "2.4.0"
   },
   "devDependencies": {
     "@playwright/test": "^1.63.0",