@piwitests/reporter 0.9.1 → 0.12.0

package/dist/internal/capture/capture-fixtures.js

@@ -1,12 +1,55 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.dashboardFixtures = void 0;
+exports.piwiFixtures = exports.CAPTURED_ATTRS_ARG = void 0;
+exports.computeCoreVitals = computeCoreVitals;
+exports.buildPageState = buildPageState;
 exports.ariaSnapshotBestEffort = ariaSnapshotBestEffort;
 exports.probeElementAttrs = probeElementAttrs;
-exports.extendDashboardFixtures = extendDashboardFixtures;
+exports.extendPiwiFixtures = extendPiwiFixtures;
 const node_zlib_1 = require("node:zlib");
 const locator_healing_js_1 = require("./locator-healing.js");
 const attachments_js_1 = require("./attachments.js");
+/**
+ * Aggregate buffered performance entries into LCP/CLS/INP. Pure and Node-side
+ * so it is unit-testable; the in-page evaluate only ships raw entry projections.
+ * A null entry list means the entry type is unsupported (non-Chromium) — the
+ * metric is null rather than 0 so absence is distinguishable from "no shifts".
+ */
+function computeCoreVitals(lcpEntries, shiftEntries, eventEntries) {
+    // The last LCP candidate is the final LCP.
+    const lastLcp = lcpEntries && lcpEntries.length > 0 ? lcpEntries[lcpEntries.length - 1] : null;
+    const lcp = lastLcp && typeof lastLcp.startTime === 'number' ? Math.round(lastLcp.startTime) : null;
+    // Simple sum over shifts without recent input. The spec's session-window
+    // grouping matters for long sessions; a test's page lifetime is short enough
+    // that the plain sum tracks it closely.
+    let cls = null;
+    if (shiftEntries) {
+        const sum = shiftEntries.reduce((acc, e) => acc + (e.hadRecentInput ? 0 : typeof e.value === 'number' ? e.value : 0), 0);
+        cls = Math.round(sum * 10000) / 10000;
+    }
+    // Worst interaction latency: max duration per interactionId, then the p98
+    // interaction when there are many (mirrors the INP definition, simplified).
+    let inp = null;
+    if (eventEntries && eventEntries.length > 0) {
+        const byInteraction = new Map();
+        for (const e of eventEntries) {
+            if (typeof e.interactionId !== 'number' || e.interactionId <= 0)
+                continue;
+            const duration = typeof e.duration === 'number' ? e.duration : 0;
+            const prev = byInteraction.get(e.interactionId) ?? 0;
+            if (duration > prev)
+                byInteraction.set(e.interactionId, duration);
+        }
+        const durations = [...byInteraction.values()].sort((a, b) => a - b);
+        if (durations.length > 0) {
+            const index = durations.length > 50 ? Math.floor(durations.length * 0.98) : durations.length - 1;
+            inp = Math.round(durations[Math.min(index, durations.length - 1)]);
+        }
+    }
+    if (lcp === null && cls === null && inp === null)
+        return null;
+    return { lcp, cls, inp };
+}
 function createSink() {
     return {
         networkRequests: [],
@@ -16,6 +59,10 @@ function createSink() {
         capturePromises: [],
         failedLocators: [],
         lastActivePage: null,
+        testInfo: null,
+        stashedWebVitals: null,
+        stashedPageState: null,
+        stashedAria: null,
     };
 }
 /**
@@ -25,6 +72,251 @@ function createSink() {
  * test (auth setup, teardown) is intentionally not captured.
  */
 let currentSink = null;
+/**
+ * Element probes whose protocol call is still in flight. Closing a page,
+ * context, or browser while a probe is mid-flight makes Playwright's
+ * connection dispatcher throw a global "Object with guid handle@… was not
+ * bound in the connection" error, which fails whichever test happens to be
+ * running. The close wrappers drain this set (bounded) before closing.
+ */
+const PENDING_PROBES = new Set();
+async function drainPendingProbes(capMs) {
+    if (PENDING_PROBES.size === 0)
+        return;
+    let cap;
+    await Promise.race([
+        Promise.allSettled(PENDING_PROBES),
+        new Promise((resolve) => {
+            cap = setTimeout(resolve, capMs);
+        }),
+    ]);
+    clearTimeout(cap);
+}
+function isPageClosed(page) {
+    try {
+        return typeof page.isClosed === 'function' ? page.isClosed() : false;
+    }
+    catch {
+        return false;
+    }
+}
+function pageContext(page) {
+    try {
+        return typeof page.context === 'function' ? page.context() : null;
+    }
+    catch {
+        return null;
+    }
+}
+/** Read navigation/paint timings and core-vitals entries — null when unavailable or the page is gone. */
+async function readWebVitals(page) {
+    try {
+        // Runs in the browser, so the perf-entry reads stay `any` (no DOM lib);
+        // the callback return type pins the result. Aggregation happens Node-side
+        // in computeCoreVitals so the in-page code stays a thin projection.
+        const probe = await page.evaluate(async () => {
+            const navEntries = performance.getEntriesByType('navigation');
+            const paintEntries = performance.getEntriesByType('paint');
+            const nav = navEntries[0];
+            const navigation = nav
+                ? {
+                    url: nav.name,
+                    ttfb: Math.round(nav.responseStart - nav.fetchStart),
+                    domInteractive: Math.round(nav.domInteractive - nav.fetchStart),
+                    domContentLoaded: Math.round(nav.domContentLoadedEventEnd - nav.fetchStart),
+                    loadComplete: Math.round(nav.loadEventEnd - nav.fetchStart),
+                    transferSize: nav.transferSize || 0,
+                    encodedBodySize: nav.encodedBodySize || 0,
+                    decodedBodySize: nav.decodedBodySize || 0,
+                }
+                : null;
+            const paint = {};
+            for (const entry of paintEntries) {
+                const key = entry.name.replace(/-([a-z])/g, (_, l) => l.toUpperCase());
+                paint[key] = Math.round(entry.startTime);
+            }
+            // Buffered-observer read of an entry type. Returns null when the type is
+            // unsupported (non-Chromium); [] when supported but nothing recorded.
+            // Buffered entries are dispatched in a queued task, so wait one macrotask
+            // before draining with takeRecords().
+            const readBuffered = (type, extra) => new Promise((resolve) => {
+                try {
+                    const PO = globalThis.PerformanceObserver;
+                    if (!PO || !(PO.supportedEntryTypes || []).includes(type))
+                        return resolve(null);
+                    const out = [];
+                    const po = new PO((list) => out.push(...list.getEntries()));
+                    po.observe({ type, buffered: true, ...extra });
+                    setTimeout(() => {
+                        try {
+                            out.push(...po.takeRecords());
+                            po.disconnect();
+                        }
+                        catch {
+                            // Entries gathered so far still count.
+                        }
+                        resolve(out);
+                    }, 0);
+                }
+                catch {
+                    resolve(null);
+                }
+            });
+            const [lcpRaw, shiftRaw, eventRaw, firstInputRaw] = await Promise.all([
+                readBuffered('largest-contentful-paint'),
+                readBuffered('layout-shift'),
+                // durationThreshold 40 mirrors the web-vitals library — captures every
+                // interaction slow enough to matter without flooding the buffer.
+                readBuffered('event', { durationThreshold: 40 }),
+                readBuffered('first-input'),
+            ]);
+            const project = (entries) => entries === null
+                ? null
+                : entries.map((e) => ({
+                    startTime: e.startTime,
+                    value: e.value,
+                    hadRecentInput: e.hadRecentInput,
+                    interactionId: e.interactionId,
+                    duration: e.duration,
+                }));
+            const interactionEntries = eventRaw === null && firstInputRaw === null ? null : [...(eventRaw ?? []), ...(firstInputRaw ?? [])];
+            return {
+                navigation,
+                paint,
+                lcpEntries: project(lcpRaw),
+                shiftEntries: project(shiftRaw),
+                eventEntries: project(interactionEntries),
+            };
+        });
+        if (!probe)
+            return null;
+        const vitals = computeCoreVitals(probe.lcpEntries, probe.shiftEntries, probe.eventEntries);
+        if (!probe.navigation && Object.keys(probe.paint).length === 0 && !vitals)
+            return null;
+        return { navigation: probe.navigation, paint: probe.paint, vitals };
+    }
+    catch {
+        return null;
+    }
+}
+const PAGE_STATE_MAX_STORAGE_KEYS = 50;
+const PAGE_STATE_MAX_COOKIES = 30;
+const PAGE_STATE_HISTORY_CAP = 2048;
+const TOKEN_MASK_RES = [/\beyJ[\w-]{10,}\.[\w-]{5,}\.[\w-]{5,}\b/g, /\b[0-9a-f]{32,}\b/gi];
+/**
+ * Assemble the wire page-state from the in-page reads and the context cookies.
+ * Pure and Node-side so the sanitization (token masking, caps, value-free
+ * cookies) is unit-testable.
+ */
+function buildPageState(raw, cookies) {
+    let historyState = raw.historyState;
+    if (historyState) {
+        for (const re of TOKEN_MASK_RES)
+            historyState = historyState.replace(re, '[masked]');
+        if (historyState.length > PAGE_STATE_HISTORY_CAP) {
+            historyState = historyState.slice(0, PAGE_STATE_HISTORY_CAP) + '…';
+        }
+    }
+    const capStorage = (entries) => (Array.isArray(entries) ? entries : []).slice(0, PAGE_STATE_MAX_STORAGE_KEYS).map((e) => ({
+        key: String(e.key).slice(0, 200),
+        length: typeof e.length === 'number' ? e.length : 0,
+    }));
+    return {
+        url: raw.url,
+        hash: raw.hash || null,
+        historyState: historyState || null,
+        localStorage: capStorage(raw.localStorage),
+        sessionStorage: capStorage(raw.sessionStorage),
+        cookies: (cookies ?? []).slice(0, PAGE_STATE_MAX_COOKIES).map((c) => ({
+            name: String(c.name ?? ''),
+            domain: String(c.domain ?? ''),
+            path: String(c.path ?? ''),
+            httpOnly: Boolean(c.httpOnly),
+            secure: Boolean(c.secure),
+            ...(c.sameSite !== undefined ? { sameSite: String(c.sameSite) } : {}),
+            ...(typeof c.expires === 'number' ? { expires: c.expires } : {}),
+        })),
+    };
+}
+/** Read the page's state — null when unavailable or the page is gone. */
+async function readPageState(page) {
+    try {
+        const raw = await page.evaluate(() => {
+            // Key names + value lengths only — values never leave the page.
+            const listStorage = (s) => {
+                const out = [];
+                try {
+                    for (let i = 0; i < s.length; i++) {
+                        const key = s.key(i);
+                        if (key != null)
+                            out.push({ key, length: (s.getItem(key) ?? '').length });
+                    }
+                }
+                catch {
+                    // Storage access can throw in sandboxed/opaque-origin pages.
+                }
+                return out;
+            };
+            const g = globalThis;
+            let historyState = null;
+            try {
+                historyState = g.history?.state == null ? null : JSON.stringify(g.history.state);
+            }
+            catch {
+                // Unserializable history state.
+            }
+            return {
+                url: g.location.href,
+                hash: g.location.hash || null,
+                historyState,
+                localStorage: listStorage(globalThis.localStorage),
+                sessionStorage: listStorage(globalThis.sessionStorage),
+            };
+        });
+        if (!raw)
+            return null;
+        // Cookie flags are only reachable from the context API, never document.cookie.
+        let cookies = null;
+        try {
+            cookies = (await pageContext(page)?.cookies()) ?? null;
+        }
+        catch {
+            cookies = null;
+        }
+        return buildPageState(raw, cookies);
+    }
+    catch {
+        return null;
+    }
+}
+/**
+ * Take the page-dependent teardown reads (web vitals; page state; ARIA
+ * snapshot when the test failed) while the last active page is still open.
+ * Called by the close wrappers just before a close that would take that page
+ * with it — flushSink runs too late for a live read on the standard test page.
+ */
+async function stashPageState(sink, closing) {
+    const page = sink.lastActivePage;
+    if (!page || isPageClosed(page))
+        return;
+    const belongsToClosing = closing.page === page || (closing.context !== undefined && pageContext(page) === closing.context);
+    if (!belongsToClosing)
+        return;
+    const vitals = await readWebVitals(page);
+    if (vitals)
+        sink.stashedWebVitals = vitals;
+    if (process.env.PIWI_CAPTURE_PAGE_STATE !== 'false') {
+        const pageState = await readPageState(page);
+        if (pageState)
+            sink.stashedPageState = pageState;
+    }
+    const status = sink.testInfo?.status;
+    if (status === 'failed' || status === 'timedOut' || status === 'interrupted') {
+        const aria = await ariaSnapshotBestEffort(page.locator(':root'), 1000);
+        if (aria)
+            sink.stashedAria = aria;
+    }
+}
 // Idempotency guards: a page/context/browser can be reached through several
 // paths (browser patch, context patch, the `page` fixture, popup events), and
 // must be wrapped exactly once.
@@ -37,9 +329,15 @@ const PATCHED_BROWSERS = new WeakSet();
 const CHAIN_METHOD_SET = new Set(locator_healing_js_1.CHAIN_METHODS);
 const ACTION_METHOD_SET = new Set(locator_healing_js_1.ACTION_METHODS);
 const FORM_FIELD_TAGS = new Set(['input', 'select', 'textarea']);
-// CAPTURED_ATTRIBUTES is passed verbatim into evaluate() on every action — copy
-// it once instead of spreading a fresh array per call.
-const CAPTURED_ATTRS_ARG = [...locator_healing_js_1.CAPTURED_ATTRIBUTES];
+/** Built once — passed verbatim into evaluate() on every action. */
+exports.CAPTURED_ATTRS_ARG = {
+    keep: [...locator_healing_js_1.CAPTURED_ATTRIBUTES],
+    tagRoles: locator_healing_js_1.TAG_TO_ROLE,
+    inputRoles: locator_healing_js_1.INPUT_TYPE_TO_ROLE,
+    // '[role]' plus every tag the maps can resolve (input/select are handled by
+    // special-cased logic in the probe, so add them explicitly).
+    roleSources: [...new Set(['[role]', 'input', 'select', ...Object.keys(locator_healing_js_1.TAG_TO_ROLE)])].join(','),
+};
 /**
  * ARIA snapshot that tolerates every Playwright version the reporter supports,
  * returning null instead of throwing so a capture can never fail the test. The
@@ -84,7 +382,8 @@ async function ariaSnapshotBestEffort(target, timeout) {
  * `el` is browser-context (no DOM lib in this Node package), hence `any`.
  * Exported for unit testing; still passed directly to `evaluate()` below.
  */
-function probeElementAttrs(el, keep) {
+function probeElementAttrs(el, arg) {
+    const { keep, tagRoles, inputRoles, roleSources } = arg;
     const attrMap = {};
     for (const key of keep) {
         const v = el.getAttribute(key) ?? el[key];
@@ -131,6 +430,136 @@ function probeElementAttrs(el, keep) {
     catch {
         // Uniqueness probing is best-effort — never fail the capture.
     }
+    // Structural probe: the element's position among same-role elements plus
+    // anchor-worthy ancestors — powers name-free and ancestor-scoped
+    // alternatives that survive accessible-name renames. Role resolution reuses
+    // the shared maps passed in via `arg` (see roleOf below).
+    let rolePosition = null;
+    const ancestors = [];
+    try {
+        const doc = el.ownerDocument;
+        const cssEsc = (s) => doc.defaultView.CSS.escape(s);
+        const count = (sel) => {
+            try {
+                return doc.querySelectorAll(sel).length;
+            }
+            catch {
+                return undefined;
+            }
+        };
+        // Role resolution on live DOM nodes, mirroring the Node-side resolveAriaRole
+        // branching. The role maps are passed in (arg.tagRoles/inputRoles) so this
+        // serialized-into-page function shares the single source of truth in
+        // locator-healing.ts rather than re-declaring it.
+        const roleOf = (n) => {
+            const explicit = n.getAttribute('role');
+            if (explicit)
+                return explicit;
+            const tag = (n.tagName || '').toLowerCase();
+            if (tag === 'input')
+                return inputRoles[(n.getAttribute('type') || 'text').toLowerCase()] ?? 'textbox';
+            if (tag === 'select')
+                return n.getAttribute('multiple') != null ? 'listbox' : 'combobox';
+            if (tag === 'a')
+                return n.getAttribute('href') != null ? 'link' : null;
+            return tagRoles[tag] ?? null;
+        };
+        const levelOf = (n) => {
+            const m = /^h([1-6])$/.exec((n.tagName || '').toLowerCase());
+            if (m)
+                return Number(m[1]);
+            const al = n.getAttribute('aria-level');
+            return al && /^\d+$/.test(al) ? Number(al) : null;
+        };
+        const targetRole = roleOf(el);
+        const targetLevel = targetRole === 'heading' ? levelOf(el) : null;
+        if (targetRole) {
+            const nodes = doc.querySelectorAll(roleSources);
+            // A truncated scan would produce wrong counts/indexes — skip instead.
+            if (nodes.length <= 4000) {
+                let roleCountAll = 0;
+                let index = -1;
+                let levelCount = 0;
+                for (let i = 0; i < nodes.length; i++) {
+                    const n = nodes[i];
+                    if (roleOf(n) !== targetRole)
+                        continue;
+                    if (n === el)
+                        index = roleCountAll;
+                    roleCountAll++;
+                    if (targetLevel != null && levelOf(n) === targetLevel)
+                        levelCount++;
+                }
+                if (index !== -1) {
+                    rolePosition = {
+                        role: targetRole,
+                        count: roleCountAll,
+                        index,
+                        ...(targetLevel != null ? { levelCount } : {}),
+                    };
+                }
+                // Anchor-worthy ancestors: a stable hook (test id, id, explicit role,
+                // aria-label) or a container/landmark tag, nearest first. Counts are
+                // computed here so alternative generation never guesses uniqueness.
+                const CONTAINER_TAGS = ['form', 'nav', 'main', 'article', 'section', 'dialog', 'table'];
+                const docRoleCount = (role) => {
+                    let c = 0;
+                    for (let i = 0; i < nodes.length; i++)
+                        if (roleOf(nodes[i]) === role)
+                            c++;
+                    return c;
+                };
+                let node = el.parentElement;
+                let depth = 0;
+                while (node && depth < 12 && ancestors.length < 4) {
+                    depth++;
+                    const tag = (node.tagName || '').toLowerCase();
+                    if (tag === 'body' || tag === 'html')
+                        break;
+                    const testId = node.getAttribute('data-testid');
+                    const id = node.getAttribute('id');
+                    const explicitRole = node.getAttribute('role');
+                    const ariaLabel = node.getAttribute('aria-label');
+                    const anchorRole = explicitRole || (CONTAINER_TAGS.includes(tag) ? tagRoles[tag] : null) || null;
+                    if (testId || id || anchorRole || ariaLabel) {
+                        // The leaf-role match count within this ancestor (level-scoped for
+                        // headings — the emitted chained locator is level-scoped too).
+                        const scoped = node.querySelectorAll(roleSources);
+                        let scopedRoleCount = 0;
+                        if (scoped.length <= 2000) {
+                            for (let i = 0; i < scoped.length; i++) {
+                                const n = scoped[i];
+                                if (roleOf(n) !== targetRole)
+                                    continue;
+                                if (targetLevel != null && levelOf(n) !== targetLevel)
+                                    continue;
+                                scopedRoleCount++;
+                            }
+                        }
+                        else {
+                            scopedRoleCount = -1; // truncated — unusable
+                        }
+                        ancestors.push({
+                            tag,
+                            depth,
+                            testId: testId || null,
+                            id: id || null,
+                            role: explicitRole || null,
+                            ariaLabel: ariaLabel || null,
+                            ...(scopedRoleCount >= 0 ? { scopedRoleCount } : {}),
+                            ...(testId ? { testIdCount: count(`[data-testid=${JSON.stringify(testId)}]`) } : {}),
+                            ...(id ? { idCount: count(`#${cssEsc(id)}`) } : {}),
+                            ...(anchorRole ? { roleCount: docRoleCount(anchorRole) } : {}),
+                        });
+                    }
+                    node = node.parentElement;
+                }
+            }
+        }
+    }
+    catch {
+        // Structural probing is best-effort — never fail the capture.
+    }
     return {
         tagName: el.tagName?.toLowerCase?.() ?? 'unknown',
         attributes: attrMap,
@@ -143,6 +572,8 @@ function probeElementAttrs(el, keep) {
         },
         hasLabel: !!(el.labels && el.labels.length > 0),
         selectorCounts,
+        rolePosition,
+        ancestors,
     };
 }
 // Chain methods that take args and define a new locator scope (not just narrow).
@@ -204,14 +635,23 @@ function wrapLocator(page, locator, originMethod, originArgs) {
                     sink.failedLocators.push({ method: originMethod, args: originArgs });
                     throw error;
                 }
-                // Fire-and-forget: capture element data without blocking the test.
-                // evaluate() can hang when page navigates (element detaches), so
-                // race it against a 500ms deadline and never throw.
+                // Fire-and-forget: capture element data without blocking the test. The
+                // snapshot wait below is bounded by a 500ms deadline (evaluate can hang
+                // when the page navigates), but the probe's underlying protocol call is
+                // tracked in PENDING_PROBES so the close wrappers can drain it — and in
+                // capturePromises so flushSink outwaits it — even when the deadline
+                // abandons it. An evaluate still in flight when its page closes crashes
+                // the connection dispatcher with a global "not bound" error.
+                const probe = target.evaluate(probeElementAttrs, exports.CAPTURED_ATTRS_ARG);
+                const settledProbe = probe.then(() => undefined, () => undefined);
+                PENDING_PROBES.add(settledProbe);
+                settledProbe.then(() => PENDING_PROBES.delete(settledProbe));
+                sink.capturePromises.push(settledProbe);
                 const resolveAttrs = (async () => {
                     let deadline;
                     try {
                         const attrs = await Promise.race([
-                            target.evaluate(probeElementAttrs, CAPTURED_ATTRS_ARG),
+                            probe,
                             new Promise((_, reject) => {
                                 deadline = setTimeout(() => reject(new Error('locator capture timeout')), 500);
                             }),
@@ -232,13 +672,17 @@ function wrapLocator(page, locator, originMethod, originArgs) {
                             location: callerLocation,
                             used,
                             // hasLabel/selectorCounts inform alternative generation only —
-                            // keep the stored element to the wire shape.
+                            // keep the stored element to the wire shape. rolePosition and
+                            // ancestors ARE wire fields: the server's renamed-element match
+                            // uses them at heal time.
                             element: {
                                 tagName: attrs.tagName,
                                 attributes: attrs.attributes,
                                 textContent: attrs.textContent,
                                 accessibleName,
                                 center: attrs.center,
+                                ...(attrs.rolePosition ? { rolePosition: attrs.rolePosition } : {}),
+                                ...(attrs.ancestors && attrs.ancestors.length > 0 ? { ancestors: attrs.ancestors } : {}),
                             },
                             alternatives: (0, locator_healing_js_1.generateAlternatives)({ ...attrs, accessibleName }),
                         };
@@ -265,6 +709,24 @@ function instrumentPage(page) {
     if (!page || INSTRUMENTED_PAGES.has(page))
         return;
     INSTRUMENTED_PAGES.add(page);
+    // A page reached through the `page` fixture safety net may live in a context
+    // the browser patch never saw — instrument it so its close is wrapped too.
+    const ctx = pageContext(page);
+    if (ctx)
+        instrumentContext(ctx);
+    // Drain in-flight probes before a user-initiated close (the guard tolerates
+    // page-like test fakes without a close method), and preserve the
+    // page-dependent teardown reads while the page can still serve them.
+    if (typeof page.close === 'function') {
+        const originalClose = page.close.bind(page);
+        page.close = async (...args) => {
+            await drainPendingProbes(1000);
+            const sink = currentSink;
+            if (sink)
+                await stashPageState(sink, { page });
+            return originalClose(...args);
+        };
+    }
     // Opt-out: skipped when PIWI_CAPTURE_LOCATORS=false (set automatically when
     // the reporter's collectPerformanceMetrics / captureLocators is disabled),
     // so the per-action DOM read + ARIA snapshot cost is never paid when unused.
@@ -363,6 +825,21 @@ function instrumentContext(context) {
         instrumentPage(page);
         return page;
     };
+    // The built-in context fixture closes here at test teardown — BEFORE the
+    // auto capture fixture flushes. Drain in-flight probes (an evaluate crossing
+    // the close crashes the connection with a global "not bound" error) and take
+    // the page-dependent reads (web vitals, failure ARIA snapshot) while the
+    // test's page is still open.
+    if (typeof context.close === 'function') {
+        const originalClose = context.close.bind(context);
+        context.close = async (...args) => {
+            await drainPendingProbes(1000);
+            const sink = currentSink;
+            if (sink)
+                await stashPageState(sink, { context });
+            return originalClose(...args);
+        };
+    }
     // Popups and pages the context opens on its own (idempotent with the above).
     context.on('page', (page) => instrumentPage(page));
 }
@@ -389,6 +866,15 @@ function patchBrowser(browser) {
         instrumentContext(context);
         return context;
     };
+    // Worker shutdown closes the browser; a probe still in flight would crash
+    // the connection dispatcher.
+    if (typeof browser.close === 'function') {
+        const originalClose = browser.close.bind(browser);
+        browser.close = async (...args) => {
+            await drainPendingProbes(1000);
+            return originalClose(...args);
+        };
+    }
 }
 /**
  * Drain in-flight capture work and attach the collected `piwi-*` data
@@ -422,9 +908,13 @@ async function flushSink(sink, testInfo) {
         });
     }
     const page = sink.lastActivePage;
-    if (page && testInfo.status !== 'passed' && testInfo.status !== 'skipped') {
+    const pageReadable = page !== null && !isPageClosed(page);
+    if (testInfo.status !== 'passed' && testInfo.status !== 'skipped') {
         try {
-            const snapshot = await ariaSnapshotBestEffort(page.locator(':root'));
+            // Prefer a live read; fall back to the snapshot the close wrappers
+            // stashed — the standard test page is already closed when this auto
+            // fixture tears down.
+            const snapshot = (pageReadable ? await ariaSnapshotBestEffort(page.locator(':root')) : null) ?? sink.stashedAria;
             if (snapshot) {
                 await testInfo.attach(attachments_js_1.ATTACHMENT_NAMES.ariaSnapshot, {
                     contentType: 'text/plain',
@@ -465,44 +955,23 @@ async function flushSink(sink, testInfo) {
             body: Buffer.from(JSON.stringify(sink.networkRequests)),
         });
     }
-    if (page) {
-        try {
-            // Runs in the browser, so the perf-entry reads stay `any` (no DOM lib);
-            // the callback return type pins `webVitals` to WebVitals.
-            const webVitals = await page.evaluate(() => {
-                const navEntries = performance.getEntriesByType('navigation');
-                const paintEntries = performance.getEntriesByType('paint');
-                const nav = navEntries[0];
-                const navigation = nav
-                    ? {
-                        url: nav.name,
-                        ttfb: Math.round(nav.responseStart - nav.fetchStart),
-                        domInteractive: Math.round(nav.domInteractive - nav.fetchStart),
-                        domContentLoaded: Math.round(nav.domContentLoadedEventEnd - nav.fetchStart),
-                        loadComplete: Math.round(nav.loadEventEnd - nav.fetchStart),
-                        transferSize: nav.transferSize || 0,
-                        encodedBodySize: nav.encodedBodySize || 0,
-                        decodedBodySize: nav.decodedBodySize || 0,
-                    }
-                    : null;
-                const paint = {};
-                for (const entry of paintEntries) {
-                    const key = entry.name.replace(/-([a-z])/g, (_, l) => l.toUpperCase());
-                    paint[key] = Math.round(entry.startTime);
-                }
-                if (!navigation && Object.keys(paint).length === 0)
-                    return null;
-                return { navigation, paint };
+    // Live read when the page still exists (e.g. a browser.newPage the test left
+    // open); otherwise the vitals the close wrappers stashed before the page went.
+    const webVitals = (pageReadable ? await readWebVitals(page) : null) ?? sink.stashedWebVitals;
+    if (webVitals) {
+        await testInfo.attach(attachments_js_1.ATTACHMENT_NAMES.webVitals, {
+            contentType: 'application/json',
+            body: Buffer.from(JSON.stringify(webVitals)),
+        });
+    }
+    // Page state at test end (pass AND fail — the pass side is the diff baseline).
+    if (process.env.PIWI_CAPTURE_PAGE_STATE !== 'false') {
+        const pageState = (pageReadable ? await readPageState(page) : null) ?? sink.stashedPageState;
+        if (pageState) {
+            await testInfo.attach(attachments_js_1.ATTACHMENT_NAMES.pageState, {
+                contentType: 'application/json',
+                body: Buffer.from(JSON.stringify(pageState)),
             });
-            if (webVitals) {
-                await testInfo.attach(attachments_js_1.ATTACHMENT_NAMES.webVitals, {
-                    contentType: 'application/json',
-                    body: Buffer.from(JSON.stringify(webVitals)),
-                });
-            }
-        }
-        catch {
-            /* ignore */
         }
     }
 }
@@ -515,7 +984,7 @@ async function flushSink(sink, testInfo) {
  * `browser.newContext()`. Collected data is attached as `piwi-*`
  * test-info attachments which the Piwi Dashboard reporter parses on `onTestEnd`.
  */
-exports.dashboardFixtures = {
+exports.piwiFixtures = {
     // Worker-scoped: patch the shared browser so every page/context created from
     // it — including by user fixtures that take `browser` directly — is captured.
     browser: [
@@ -535,9 +1004,10 @@ exports.dashboardFixtures = {
     // Auto, test-scoped: open a capture sink for the running test and flush it
     // (attach the collected data) at teardown. Runs for every test without being
     // requested, so suites that never destructure `page` are still captured.
-    piwiDashboardCapture: [
+    piwiCapture: [
         async ({}, use, testInfo) => {
             const sink = createSink();
+            sink.testInfo = testInfo;
             currentSink = sink;
             try {
                 await use();
@@ -551,7 +1021,8 @@ exports.dashboardFixtures = {
     ],
 };
 /**
- * Extend a Playwright `test` object with Piwi Dashboard fixtures.
+ * Extend a Playwright `test` object with the Piwi capture fixtures. The
+ * returned `test` carries the existing fixtures plus {@link PiwiFixtures}.
  *
  * Use this instead of importing `@playwright/test` directly from this package
  * to avoid the "Requiring @playwright/test second time" error caused by
@@ -560,11 +1031,11 @@ exports.dashboardFixtures = {
  * @example
  * ```ts
  * import { test as base } from '@playwright/test';
- * import { extendDashboardFixtures } from '@piwitests/reporter';
+ * import { extendPiwiFixtures } from '@piwitests/reporter';
  *
- * export const test = extendDashboardFixtures(base);
+ * export const test = extendPiwiFixtures(base);
  * ```
  */
-function extendDashboardFixtures(test) {
-    return test.extend(exports.dashboardFixtures);
+function extendPiwiFixtures(test) {
+    return test.extend(exports.piwiFixtures);
 }