tracereports 0.2.0 → 0.3.0

package/README.es.md

@@ -12,7 +12,8 @@ npm install --save-dev tracereports
 - **Playwright Test**: el reporter envía cada test con sus pasos, error y capturas, más los traces y
   videos que guarda Playwright; con los fixtures, también la red que vio el navegador, el DOM al
   fallar y la consola del navegador.
-- **Selenium WebDriver o cualquier runner**: captura y DOM al fallar, y una API para pasos y red.
+- **Selenium WebDriver o cualquier runner**: con `seleniumOptions(options)` y `withDriver`, la red (pestaña
+  Red, Lab) y la consola de cada test, y la captura y el DOM al fallar ([guía de Selenium](https://github.com/josemiguellopez/tracereports/blob/main/docs/es/selenium.md)).
 - **Nunca frena ni rompe tus tests**: la evidencia sale en segundo plano, con reintentos y sin
   duplicados; los shards pueden unirse a la misma ejecución.
 - **Sin servidor**: si el servidor está caído o rechaza el token, la ejecución se graba en local;

package/README.md

@@ -12,7 +12,8 @@ npm install --save-dev tracereports
 - **Playwright Test**: the reporter sends each test with its steps, error and screenshots, plus the
   traces and videos Playwright keeps; with the fixtures, also the network the browser saw, the DOM
   at the failure and the browser console.
-- **Selenium WebDriver or any runner**: screenshot and DOM on failure, and an API for steps and network.
+- **Selenium WebDriver or any runner**: with `seleniumOptions(options)` and `withDriver`, each test's network
+  (Network tab, Lab) and console, and the screenshot and DOM on failure ([Selenium guide](https://github.com/josemiguellopez/tracereports/blob/main/docs/en/selenium.md)).
 - **Never slows down or breaks your tests**: evidence goes out in the background with retries and
   no duplicates; shards can join the same run.
 - **Without a server**: if the server is down or rejects the token, the run is recorded locally;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tracereports",
-  "version": "0.2.0",
+  "version": "0.3.0",
   "description": "TraceReports client for JavaScript/TypeScript: Playwright Test reporter and fixtures, Selenium WebDriver helpers and a client for any runner.",
   "keywords": [
     "testing",

package/src/index.d.ts

@@ -26,6 +26,10 @@ export interface RunOptions { environment?: string; project?: string; branch?: s
 export interface TestOptions {
   category?: string; description?: string; key?: string; suite?: string; params?: string; worker?: string | number;
   status?: string; onFailure?: (t: TraceTest, err: unknown) => unknown | Promise<unknown>;
+  /** Right after the test starts (e.g. discard the browser logs of earlier tests). */
+  onStart?: (t: TraceTest) => unknown | Promise<unknown>;
+  /** Before the test is closed, passed or failed (`err` is null when it passed): network, console... */
+  onEnd?: (t: TraceTest, err: unknown) => unknown | Promise<unknown>;
 }
 
 export type Status = "INFO" | "PASS" | "FAIL" | "WARNING" | "SKIP";

package/src/index.js

@@ -27,7 +27,7 @@ import { Mirror } from "./mirror.js";
 import { Sender } from "./transport.js";
 import { downloadBinary } from "./binary.js";
 
-export const VERSION = "0.1.0";
+export const VERSION = "0.3.0";
 const STATUSES = new Set(["INFO", "PASS", "FAIL", "WARNING", "SKIP"]);
 const truthy = (v) => ["1", "true", "yes"].includes(String(v || "").toLowerCase());
 
@@ -314,19 +314,23 @@ export class TraceReports {
 
   /**
    * Corre `fn` como un test: lo inicia, lo cierra según el resultado y, si falla, adjunta la
-   * captura y el snapshot de `onFailure` (opcional). El error se vuelve a lanzar.
+   * captura y el snapshot de `onFailure` (opcional). `onStart` corre al empezar y `onEnd` antes de
+   * cerrarlo, pase o falle (la red y la consola de `withDriver`). El error se vuelve a lanzar.
    */
   async test(name, opts, fn) {
     if (typeof opts === "function") [fn, opts] = [opts, {}];
     const t = await this.startTest(name, opts);
+    // la evidencia nunca rompe el test
+    const hook = async (h, ...args) => { if (h) { try { await h(t, ...args); } catch { /* sin evidencia */ } } };
+    await hook(opts.onStart);
     try {
       const out = await fn(t);
+      await hook(opts.onEnd, null);
       t.finish(opts.status);
       return out;
     } catch (err) {
-      if (opts.onFailure) {
-        try { await opts.onFailure(t, err); } catch { /* la evidencia nunca rompe el test */ }
-      }
+      await hook(opts.onFailure, err);
+      await hook(opts.onEnd, err);
       t.fail(`${err?.name || "Error"}: ${err?.message ?? err}`);
       t.finish("FAIL", { error: err });
       throw err;

package/src/selenium.js

@@ -1,8 +1,14 @@
-// Selenium WebDriver (selenium-webdriver) con TraceReports. Sirve con cualquier runner
-// (node:test, Mocha, Jest…): no importa selenium-webdriver, usa el `driver` que le pases.
+// Selenium WebDriver (selenium-webdriver) con TraceReports: red, consola, captura y DOM. Sirve con
+// cualquier runner (node:test, Mocha, Jest…): no importa selenium-webdriver, usa el `driver` que le
+// pases.
 //
+//   import { Builder } from "selenium-webdriver";
+//   import chrome from "selenium-webdriver/chrome.js";
 //   import { TraceReports } from "tracereports";
-//   import { withDriver, screenshot } from "tracereports/selenium";
+//   import { seleniumOptions, withDriver, screenshot } from "tracereports/selenium";
+//
+//   const options = seleniumOptions(new chrome.Options());   // activa los logs de red y de consola
+//   const driver = await new Builder().forBrowser("chrome").setChromeOptions(options).build();
 //
 //   const cr = new TraceReports();
 //   await cr.startRun("Regresión web", { environment: "chrome" });
@@ -12,12 +18,27 @@
 //   });
 //   await cr.finishRun();
 //
-// Si el test falla, `withDriver` adjunta la captura del momento y el snapshot del DOM (con él el
-// reporte recomienda selectores cuando se rompe un locator). Selenium no expone la red del
-// navegador: para la pestaña "Red" usa Playwright o envía las llamadas con `t.network([...])`.
+// `withDriver` envía la red (pestaña "Red", Lab) y la consola de cada test, y si falla la captura del
+// momento y el snapshot del DOM (con él el reporte recomienda selectores cuando se rompe un locator).
+// La red y la consola salen del log de rendimiento de Chrome y Edge (Firefox no lo tiene): hay que
+// crear el driver con `seleniumOptions(options)`. El body de una llamada hecha antes de que la
+// página navegara puede no estar ya disponible; el resto de la llamada sí.
 
 import { DOM_SCRIPT } from "./dom.js";
 
+const LOG_PREFS = { performance: "ALL", browser: "ALL" };
+const BODY_TYPES = new Set(["xhr", "fetch"]);
+const TEXT_MIME = ["json", "text", "xml", "javascript", "html", "x-www-form-urlencoded", "graphql"];
+
+/** Activa en las opciones de Chrome o Edge los logs de rendimiento (red) y del navegador (consola). */
+export function seleniumOptions(options) {
+  options.set("goog:loggingPrefs", { ...LOG_PREFS });
+  if (/edge/i.test(options?.constructor?.name || "") || options.get?.("browserName") === "MicrosoftEdge") {
+    options.set("ms:loggingPrefs", { ...LOG_PREFS });
+  }
+  return options;
+}
+
 /** Captura de pantalla como base64 (lo que acepta `t.screenshot`), o null. */
 export async function screenshot(driver) {
   try {
@@ -36,14 +57,179 @@ export async function captureDom(driver) {
   }
 }
 
-/** Opciones para `cr.test(...)` que, al fallar, adjuntan captura y DOM desde `driver`. */
+function* events(entries) {
+  for (const entry of entries || []) {
+    let msg;
+    try {
+      msg = JSON.parse(entry.message).message;
+    } catch {
+      continue;
+    }
+    if (msg?.method?.startsWith("Network.")) yield [msg.method, msg.params || {}];
+  }
+}
+
+/**
+ * Convierte las entradas del log "performance" (`driver.manage().logs().get("performance")`) en
+ * conexiones (el formato de `t.network`). Cada una lleva `_requestId` para pedir su body después.
+ */
+export function connectionsFromLog(entries) {
+  const byId = new Map();
+  const order = [];
+  const extraReq = new Map();
+  const extraRes = new Map();
+  const ms = (from, to) => (from == null || to == null ? undefined : Math.round((to - from) * 1000));
+  const setResponse = (c, r) => {
+    c.status = Number(r.status || 0);
+    c.status_text = r.statusText || "";
+    c.mime_type = r.mimeType || "";
+    c.response_headers = { ...(r.headers || {}) };
+  };
+  for (const [method, p] of events(entries)) {
+    const id = p.requestId;
+    if (!id) continue;
+    if (method === "Network.requestWillBeSent") {
+      const prev = byId.get(id);
+      if (prev && p.redirectResponse) {
+        // la redirección cierra el salto anterior con su propia respuesta
+        setResponse(prev, p.redirectResponse);
+        prev.duration_ms = ms(prev._ts, p.timestamp);
+        prev._requestId = null;
+      }
+      const req = p.request || {};
+      const c = {
+        _requestId: id, _ts: p.timestamp, method: req.method || "", url: req.url || "",
+        resource_type: String(p.type || "").toLowerCase(), request_headers: { ...(req.headers || {}) },
+        post_data: req.postData || "", _hasPostData: Boolean(req.hasPostData || req.postData),
+        started_at: p.wallTime ? Math.round(p.wallTime * 1000) : 0, status: 0,
+      };
+      byId.set(id, c);
+      order.push(c);
+    } else if (method === "Network.requestWillBeSentExtraInfo") {
+      extraReq.set(id, { ...(extraReq.get(id) || {}), ...(p.headers || {}) });
+    } else if (method === "Network.responseReceived" && byId.has(id)) {
+      const c = byId.get(id);
+      setResponse(c, p.response || {});
+      if (p.type) c.resource_type = String(p.type).toLowerCase();
+    } else if (method === "Network.responseReceivedExtraInfo") {
+      extraRes.set(id, { ...(extraRes.get(id) || {}), ...(p.headers || {}) });
+    } else if (method === "Network.loadingFinished" && byId.has(id)) {
+      const c = byId.get(id);
+      c.duration_ms = ms(c._ts, p.timestamp);
+    } else if (method === "Network.loadingFailed" && byId.has(id)) {
+      const c = byId.get(id);
+      c.failed = true;
+      c.error_text = p.errorText || (p.canceled ? "canceled" : "failed");
+      c.duration_ms = ms(c._ts, p.timestamp);
+    }
+  }
+  const out = [];
+  for (const c of order) {
+    if (/^(data|blob):/.test(c.url)) continue;
+    // los headers reales que salieron, con la cookie de sesión
+    if (extraReq.has(c._requestId)) c.request_headers = { ...c.request_headers, ...extraReq.get(c._requestId) };
+    if (extraRes.has(c._requestId) && c.response_headers) c.response_headers = { ...c.response_headers, ...extraRes.get(c._requestId) };
+    delete c._ts;
+    out.push(c);
+  }
+  return out;
+}
+
+async function cdp(driver, cmd, params) {
+  try {
+    return (await driver.sendAndGetDevToolsCommand(cmd, params)) || {};
+  } catch {
+    return {}; // otro navegador, o el recurso ya no existe (la página navegó)
+  }
+}
+
+function wantsBody(c) {
+  if (c.failed || !c._requestId) return false;
+  if (!BODY_TYPES.has(c.resource_type) && c.status < 400) return false;
+  const mime = String(c.mime_type || "").toLowerCase();
+  return !mime || TEXT_MIME.some((t) => mime.includes(t));
+}
+
+async function readLog(driver, kind) {
+  try {
+    return await driver.manage().logs().get(kind);
+  } catch {
+    return [];
+  }
+}
+
+/**
+ * Las llamadas de red desde la última lectura (el log se vacía al leerlo: cada test lee las
+ * suyas), con los bodies de las APIs y de las respuestas con error. [] si el driver no tiene el
+ * log de rendimiento (ver `seleniumOptions`).
+ */
+export async function captureNetwork(driver) {
+  const conns = connectionsFromLog(await readLog(driver, "performance"));
+  for (const c of conns) {
+    if (c._hasPostData && !c.post_data && c._requestId) {
+      c.post_data = (await cdp(driver, "Network.getRequestPostData", { requestId: c._requestId })).postData || "";
+    }
+    if (wantsBody(c)) {
+      const res = await cdp(driver, "Network.getResponseBody", { requestId: c._requestId });
+      if (typeof res.body === "string") {
+        const body = res.base64Encoded ? Buffer.from(res.body, "base64").toString("utf8") : res.body;
+        c.body_size = Buffer.byteLength(body);
+        c.response_body = body;
+      }
+    }
+    delete c._requestId;
+    delete c._hasPostData;
+  }
+  return conns;
+}
+
+/** Errores y warnings de la consola desde la última lectura (el formato de `t.console`). */
+export async function captureConsole(driver) {
+  const out = [];
+  for (const e of await readLog(driver, "browser")) {
+    const name = String(e?.level?.name ?? e?.level ?? "").toUpperCase();
+    let level = name === "SEVERE" ? "error" : name === "WARNING" ? "warning" : "";
+    if (!level) continue;
+    if (level === "error" && /\bUncaught\b/.test(e.message || "")) level = "pageerror";
+    out.push({ level, text: String(e.message || ""), location: "", timestamp: Number(e.timestamp || 0) });
+  }
+  return out;
+}
+
+/** Vacía los logs del driver: lo de antes del test (otro test con el mismo driver) no se envía. */
+export async function discardLogs(driver) {
+  await readLog(driver, "performance");
+  await readLog(driver, "browser");
+}
+
+/** Envía al test la red y la consola desde la última lectura. Devuelve cuántas llamadas envió. */
+export async function reportSelenium(t, driver) {
+  const conns = await captureNetwork(driver);
+  if (conns.length) t.network(conns);
+  const consoleEntries = await captureConsole(driver);
+  if (consoleEntries.length) t.console(consoleEntries);
+  return conns.length;
+}
+
+/**
+ * Opciones para `cr.test(...)` con un driver de Selenium: al empezar descarta los logs anteriores,
+ * al terminar envía la red y la consola del test, y si falla la captura y el DOM.
+ */
 export function withDriver(driver, opts = {}) {
   return {
     ...opts,
+    async onStart(t) {
+      await discardLogs(driver);
+      if (opts.onStart) await opts.onStart(t);
+    },
     async onFailure(t, err) {
       t.screenshot(await screenshot(driver), "Captura al fallar", "FAIL");
       t.dom(await captureDom(driver));
       if (opts.onFailure) await opts.onFailure(t, err);
     },
+    async onEnd(t, err) {
+      await reportSelenium(t, driver);
+      if (opts.onEnd) await opts.onEnd(t, err);
+    },
   };
 }