@crvy/rprtr 0.0.4 → 0.0.7

package/dist/{chunk-BRFA7JCQ.js → chunk-OMDYTNWY.js}

@@ -9,11 +9,12 @@ import {
   applyTestEndEvent,
   createMutableReportState,
   finalizeRunEvent,
+  resolveBaselineTargets,
   safeParse
-} from "./chunk-IEYNAB6M.js";
+} from "./chunk-JGS2VWQP.js";
 
 // src/server/app.ts
-import { dirname as dirname2, join as join3 } from "path";
+import { dirname as dirname3, join as join4 } from "path";
 import { fileURLToPath } from "url";
 import pLimit from "p-limit";
 
@@ -207,14 +208,123 @@ function handleSync(ctx) {
   broadcastToBrowsers(ctx.wsClients, { type: "sync", data: ctx.reportData });
 }
 
-// src/server/routes.ts
+// src/server/report-watch.ts
+import { readdir as readdir2, stat as stat2 } from "fs/promises";
 import { join as join2 } from "path";
+var OFFLINE_REPORT_FILE_PATTERN2 = /^crvy-rprtr(?:-\d+)?\.json$/;
+function createDebouncedRefresh(reload, delayMs = 50) {
+  let timer = null;
+  return () => {
+    if (timer !== null) {
+      clearTimeout(timer);
+    }
+    timer = setTimeout(() => {
+      timer = null;
+      void reload();
+    }, delayMs);
+  };
+}
+function isFileNotFound2(error) {
+  return typeof error === "object" && error !== null && "code" in error && error.code === "ENOENT";
+}
+async function describeFile(filePath, label) {
+  try {
+    const fileStats = await stat2(filePath);
+    return `${label}:${fileStats.size}:${fileStats.mtimeMs}`;
+  } catch (error) {
+    if (isFileNotFound2(error)) {
+      return null;
+    }
+    throw error;
+  }
+}
+async function createOfflineFingerprint(offlineReportDir) {
+  if (!await isDirectory(offlineReportDir)) {
+    return "offline:missing";
+  }
+  try {
+    const entries = await readdir2(offlineReportDir, { withFileTypes: true });
+    const relevantEntries = entries.filter(
+      (entry) => entry.isFile() && (entry.name === "report.json" || OFFLINE_REPORT_FILE_PATTERN2.test(entry.name))
+    ).sort((left, right) => left.name.localeCompare(right.name));
+    const parts = await Promise.all(
+      relevantEntries.map((entry) => describeFile(join2(offlineReportDir, entry.name), entry.name))
+    );
+    return `offline:${parts.filter((part) => part !== null).join("|")}`;
+  } catch (error) {
+    const errorMsg = error instanceof Error ? error.message : String(error);
+    console.warn(`[Server] Unable to scan ${offlineReportDir}: ${errorMsg}`);
+    return "offline:error";
+  }
+}
+async function createScreenshotFingerprint(screenshotDir, relativePath = "") {
+  const directoryPath = relativePath === "" ? screenshotDir : join2(screenshotDir, relativePath);
+  if (!await isDirectory(directoryPath)) {
+    return relativePath === "" ? ["screenshots:missing"] : [];
+  }
+  try {
+    const entries = await readdir2(directoryPath, { withFileTypes: true });
+    const parts = await Promise.all(
+      entries.sort((left, right) => left.name.localeCompare(right.name)).map((entry) => {
+        const entryRelativePath = relativePath === "" ? entry.name : join2(relativePath, entry.name);
+        if (entry.isDirectory()) {
+          return createScreenshotFingerprint(screenshotDir, entryRelativePath);
+        }
+        return describeFile(join2(screenshotDir, entryRelativePath), entryRelativePath);
+      })
+    );
+    return parts.flat().filter((part) => part !== null);
+  } catch (error) {
+    if (isFileNotFound2(error)) {
+      return relativePath === "" ? ["screenshots:missing"] : [];
+    }
+    const errorMsg = error instanceof Error ? error.message : String(error);
+    console.warn(`[Server] Unable to scan ${directoryPath}: ${errorMsg}`);
+    return relativePath === "" ? ["screenshots:error"] : [];
+  }
+}
+async function createArtifactsFingerprint(options) {
+  const [offlineFingerprint, screenshotFingerprint] = await Promise.all([
+    createOfflineFingerprint(options.offlineReportDir),
+    createScreenshotFingerprint(options.screenshotDir)
+  ]);
+  return `${offlineFingerprint}::${screenshotFingerprint.join("|")}`;
+}
+async function watchReportArtifacts(options) {
+  let fingerprint = await createArtifactsFingerprint(options);
+  let isPolling = false;
+  const interval = setInterval(() => {
+    if (isPolling) {
+      return;
+    }
+    isPolling = true;
+    void createArtifactsFingerprint(options).then((nextFingerprint) => {
+      if (nextFingerprint === fingerprint) {
+        return;
+      }
+      fingerprint = nextFingerprint;
+      options.scheduleRefresh();
+    }).catch((error) => {
+      const errorMsg = error instanceof Error ? error.message : String(error);
+      console.warn(`[Server] Artifact refresh poll failed: ${errorMsg}`);
+    }).finally(() => {
+      isPolling = false;
+    });
+  }, 100);
+  return () => {
+    clearInterval(interval);
+  };
+}
+
+// src/server/routes.ts
+import { existsSync } from "fs";
+import { dirname as dirname2, join as join3 } from "path";
 var LIVE_UPDATES_WEBSOCKET_PATH = "/";
 function isWebSocketUpgradeRequest(req) {
   return new URL(req.url).pathname === LIVE_UPDATES_WEBSOCKET_PATH && req.headers.get("upgrade")?.toLowerCase() === "websocket";
 }
 async function handleRoot(ctx) {
-  const html = await respondWithFile(join2(ctx.staticDir, "index.html"), "text/html");
+  const html = await respondWithFile(join3(ctx.staticDir, "index.html"), "text/html");
   return html ?? new Response("Not Found", { status: 404 });
 }
 async function handleAppCss() {
@@ -231,6 +341,37 @@ async function handleSrcFiles(req) {
 function handleApiReport(ctx) {
   return Response.json(ctx.reportData);
 }
+var APPROVAL_TARGET_ERROR = "Could not resolve approval target";
+function actualPathFromUrl(ctx, actualUrl) {
+  return actualUrl.startsWith("/screenshots/") ? join3(ctx.reportData.screenshotDir, actualUrl.slice("/screenshots/".length)) : actualUrl;
+}
+function reporterTitlePath(test) {
+  const testFile = test.location?.file;
+  return ["", test.browser, testFile ?? "", ...test.titlePath, test.title];
+}
+function resolveApprovalTarget(ctx, test, retry, imageName) {
+  const testFile = test.location?.file;
+  const declaration = test.results?.[retry]?.visualDeclarations?.find((candidate) => candidate.visualName === imageName);
+  if (ctx.approvalRouting === void 0 || testFile === void 0 || declaration === void 0) {
+    return null;
+  }
+  const targets = resolveBaselineTargets({
+    testFile,
+    reporterTitlePath: reporterTitlePath(test),
+    declarations: [declaration],
+    config: {
+      configDir: ctx.approvalRouting.configDir,
+      testDir: ctx.approvalRouting.playwrightTestDir ?? dirname2(testFile),
+      snapshotDir: ctx.approvalRouting.playwrightSnapshotDir ?? dirname2(testFile),
+      projectName: test.browser,
+      snapshotSuffix: process.platform,
+      snapshotPathTemplate: ctx.approvalRouting.playwrightSnapshotPathTemplate,
+      toHaveScreenshotPathTemplate: ctx.approvalRouting.playwrightToHaveScreenshotPathTemplate
+    },
+    snapshotPathExists: existsSync
+  });
+  return targets.length === 1 ? targets[0]?.snapshotPath ?? null : null;
+}
 async function handleApiApprove(ctx, req) {
   try {
     const rawBody = await req.json();
@@ -241,61 +382,96 @@ async function handleApiApprove(ctx, req) {
     }
     const { id, retry, image } = parsed;
     const test = ctx.reportData.tests[id];
-    if (test !== null && test !== void 0) {
-      test.approved ??= {};
-      test.approved[image] = retry;
+    if (test === void 0) {
+      return Response.json({ success: false, error: "Test not found" }, { status: 404 });
+    }
+    const actualUrl = test.results?.[retry]?.images?.[image]?.actual;
+    if (actualUrl === void 0) {
+      return Response.json({ success: false, error: "Actual image not found" }, { status: 409 });
+    }
+    const snapshotPath = resolveApprovalTarget(ctx, test, retry, image);
+    if (snapshotPath === null) {
+      return Response.json({ success: false, error: APPROVAL_TARGET_ERROR }, { status: 409 });
+    }
+    try {
+      await copyFilePortable(actualPathFromUrl(ctx, actualUrl), snapshotPath);
+      test.approved = { ...test.approved ?? {}, [image]: retry };
       await ctx.saveReport();
-      const actualUrl = test.results?.[retry]?.images?.[image]?.actual;
-      if (actualUrl !== null && actualUrl !== void 0 && test.location?.file !== null && test.location?.file !== void 0) {
-        const actualPath = actualUrl.replace("/screenshots/", `${ctx.reportData.screenshotDir}/`);
-        const snapshotPath = `${test.location.file}-snapshots/${image}-${test.browser}-${process.platform}.png`;
-        try {
-          await copyFilePortable(actualPath, snapshotPath);
-          console.log(`  \u2714 Updated baseline: ${snapshotPath}`);
-        } catch (err) {
-          const errorMsg = err instanceof Error ? err.message : String(err);
-          console.error(`  \u2717 Failed to update baseline: ${errorMsg}`);
-        }
-      }
+      console.log(`  \u2714 Updated baseline: ${snapshotPath}`);
       console.log(`  \u2714 Approved [${test.browser}] ${test.title} \u2014 ${image}`);
+      return Response.json({ success: true });
+    } catch (err) {
+      const errorMsg = err instanceof Error ? err.message : String(err);
+      console.error(`  \u2717 Failed to update baseline: ${errorMsg}`);
+      return Response.json({ success: false, error: "Failed to update baseline" }, { status: 500 });
     }
-    return Response.json({ success: true });
   } catch {
     return Response.json({ success: false, error: "Invalid request" }, { status: 400 });
   }
 }
-async function handleApiApproveAll(ctx) {
-  let approvedCount = 0;
-  const baselineUpdates = [];
-  Object.values(ctx.reportData.tests).forEach((test) => {
-    if (!test?.results) return;
-    const approved = {};
+function createBulkApprovalUpdates(ctx) {
+  return Object.values(ctx.reportData.tests).flatMap((test) => {
+    if (!test.results || test.results.length === 0) {
+      return [];
+    }
     const lastRetry = test.results.length - 1;
     const lastResult = test.results[lastRetry];
-    if (!lastResult?.images) return;
-    Object.keys(lastResult.images).forEach((imageName) => {
-      approved[imageName] = lastRetry;
-      approvedCount++;
+    if (!lastResult?.images) {
+      return [];
+    }
+    return Object.keys(lastResult.images).flatMap((imageName) => {
       const actualUrl = lastResult.images?.[imageName]?.actual;
-      if (actualUrl !== null && actualUrl !== void 0 && test.location?.file !== null && test.location?.file !== void 0) {
-        const actualPath = actualUrl.replace("/screenshots/", `${ctx.reportData.screenshotDir}/`);
-        const snapshotPath = `${test.location.file}-snapshots/${imageName}-${test.browser}-${process.platform}.png`;
-        baselineUpdates.push(
-          copyFilePortable(actualPath, snapshotPath).then(() => {
-            console.log(`  \u2714 Updated baseline: ${snapshotPath}`);
-          }).catch((err) => {
-            const errorMsg = err instanceof Error ? err.message : String(err);
-            console.error(`  \u2717 Failed to update baseline: ${errorMsg}`);
-          })
-        );
+      if (actualUrl === void 0) {
+        return [Promise.resolve({ kind: "unresolved" })];
+      }
+      const snapshotPath = resolveApprovalTarget(ctx, test, lastRetry, imageName);
+      if (snapshotPath === null) {
+        return [Promise.resolve({ kind: "unresolved" })];
       }
+      return [
+        copyFilePortable(actualPathFromUrl(ctx, actualUrl), snapshotPath).then(
+          () => ({
+            kind: "approved",
+            imageName,
+            retry: lastRetry,
+            snapshotPath,
+            test
+          })
+        ).catch((err) => {
+          const errorMsg = err instanceof Error ? err.message : String(err);
+          console.error(`  \u2717 Failed to update baseline: ${errorMsg}`);
+          return { kind: "failed" };
+        })
+      ];
     });
-    test.approved = approved;
   });
+}
+function summarizeBulkApprovalOutcomes(outcomes) {
+  return outcomes.reduce(
+    (summary, outcome) => {
+      switch (outcome.kind) {
+        case "approved": {
+          outcome.test.approved = { ...outcome.test.approved ?? {}, [outcome.imageName]: outcome.retry };
+          console.log(`  \u2714 Updated baseline: ${outcome.snapshotPath}`);
+          return { ...summary, approved: summary.approved + 1 };
+        }
+        case "unresolved":
+          return { ...summary, unresolved: summary.unresolved + 1 };
+        case "failed":
+          return { ...summary, failed: summary.failed + 1 };
+      }
+    },
+    { approved: 0, unresolved: 0, failed: 0 }
+  );
+}
+async function handleApiApproveAll(ctx) {
+  const outcomes = await Promise.all(createBulkApprovalUpdates(ctx));
+  const counts = summarizeBulkApprovalOutcomes(outcomes);
   await ctx.saveReport();
-  await Promise.all(baselineUpdates);
-  console.log(`  \u2714 Approved all \u2014 ${approvedCount} image(s)`);
-  return Response.json({ success: true });
+  console.log(
+    `  \u2714 Approved all \u2014 approved: ${counts.approved}, unresolved: ${counts.unresolved}, failed: ${counts.failed}`
+  );
+  return Response.json({ success: counts.failed === 0, ...counts });
 }
 async function handleApiImages(req) {
   const path = new URL(req.url).pathname.slice("/api/images/".length);
@@ -311,7 +487,7 @@ async function handleScreenshots(ctx, req) {
 }
 async function handleDist(ctx, req) {
   const path = new URL(req.url).pathname.slice("/dist/".length);
-  const filePath = join2(ctx.staticDir, path);
+  const filePath = join3(ctx.staticDir, path);
   const contentType = filePath.endsWith(".css") ? "text/css" : filePath.endsWith(".js") ? "application/javascript" : filePath.endsWith(".svelte") ? "text/plain" : "application/octet-stream";
   const file = await respondWithFile(filePath, contentType);
   return file ?? new Response("Not Found", { status: 404 });
@@ -330,10 +506,10 @@ function handleHttpRequest(ctx, req) {
   if (pathname === "/api/report") {
     return Promise.resolve(handleApiReport(ctx));
   }
-  if (pathname === "/api/approve") {
+  if (pathname === "/api/approve" && req.method === "POST") {
     return handleApiApprove(ctx, req);
   }
-  if (pathname === "/api/approve-all") {
+  if (pathname === "/api/approve-all" && req.method === "POST") {
     return handleApiApproveAll(ctx);
   }
   if (pathname.startsWith("/api/images/")) {
@@ -414,6 +590,10 @@ async function loadOfflineReports(offlineReportDir, reportData) {
     screenshotsBaseUrl: "/screenshots/"
   });
 }
+function resetReloadableReportData(reportData) {
+  reportData.tests = {};
+  reportData.isUpdateMode = false;
+}
 async function handleParsedWebSocketMessage(ctx, msg) {
   switch (msg.type) {
     case "test-begin": {
@@ -462,19 +642,19 @@ function createWebSocketMessageHandler(getHandlerContext) {
   };
 }
 async function resolveStaticDir(staticDir) {
-  const currentDir = dirname2(fileURLToPath(import.meta.url));
+  const currentDir = dirname3(fileURLToPath(import.meta.url));
   const candidates = staticDir === void 0 ? [
     currentDir,
-    join3(currentDir, "dist"),
-    join3(currentDir, "..", "dist"),
-    join3(currentDir, "..", "..", "dist"),
-    join3(currentDir, ".."),
-    join3(currentDir, "..", "..")
-  ] : [staticDir, join3(staticDir, "dist")];
+    join4(currentDir, "dist"),
+    join4(currentDir, "..", "dist"),
+    join4(currentDir, "..", "..", "dist"),
+    join4(currentDir, ".."),
+    join4(currentDir, "..", "..")
+  ] : [staticDir, join4(staticDir, "dist")];
   const resolvedCandidates = await Promise.all(
     candidates.map(async (candidate) => ({
       candidate,
-      exists: await fileExists(join3(candidate, "index.html"))
+      exists: await fileExists(join4(candidate, "index.html"))
     }))
   );
   const resolved = resolvedCandidates.find(({ exists }) => exists);
@@ -485,9 +665,23 @@ async function resolveStaticDir(staticDir) {
 }
 async function resolveReportPath(reportPath) {
   if (await isDirectory(reportPath)) {
-    return { reportFile: join3(reportPath, "report.json"), offlineReportDir: reportPath };
+    return { reportFile: join4(reportPath, "report.json"), offlineReportDir: reportPath };
   }
-  return { reportFile: reportPath, offlineReportDir: dirname2(reportPath) };
+  return { reportFile: reportPath, offlineReportDir: dirname3(reportPath) };
+}
+function createRoutesContext(reportData, staticDir, saveReport, options) {
+  return {
+    reportData,
+    staticDir,
+    saveReport,
+    approvalRouting: {
+      configDir: options.configDir ?? process.cwd(),
+      playwrightTestDir: options.playwrightTestDir,
+      playwrightSnapshotDir: options.playwrightSnapshotDir,
+      playwrightSnapshotPathTemplate: options.playwrightSnapshotPathTemplate,
+      playwrightToHaveScreenshotPathTemplate: options.playwrightToHaveScreenshotPathTemplate
+    }
+  };
 }
 async function createServerApp(options = {}) {
   const port = options.port ?? 3e3;
@@ -500,19 +694,26 @@ async function createServerApp(options = {}) {
   async function saveReport() {
     await writeJsonFile(reportFile, reportData);
   }
-  const routesContext = {
-    reportData,
-    staticDir,
-    saveReport
-  };
+  const routesContext = createRoutesContext(reportData, staticDir, saveReport, options);
   const getHandlerContext = () => createHandlerContext(reportData, wsClients, currentRunIds, saveReport);
   const handleRequest = (req) => handleHttpRequest(routesContext, req);
   const handleWebSocketMessage = createWebSocketMessageHandler(getHandlerContext);
-  await loadReport(reportFile, reportData);
-  await loadOfflineReports(offlineReportDir, reportData);
+  const reloadFromDisk = async () => {
+    resetReloadableReportData(reportData);
+    await loadReport(reportFile, reportData);
+    await loadOfflineReports(offlineReportDir, reportData);
+    broadcastToBrowsers(wsClients, { type: "sync", data: reportData });
+  };
+  await reloadFromDisk();
+  const close = await watchReportArtifacts({
+    offlineReportDir,
+    screenshotDir: reportData.screenshotDir,
+    scheduleRefresh: createDebouncedRefresh(reloadFromDisk)
+  });
   return {
     port,
     wsClients,
+    close,
     handleRequest,
     handleWebSocketMessage
   };

package/dist/cli.js

@@ -1,8 +1,8 @@
 #!/usr/bin/env node
 import {
   startServer
-} from "./chunk-BRFA7JCQ.js";
-import "./chunk-IEYNAB6M.js";
+} from "./chunk-OMDYTNWY.js";
+import "./chunk-JGS2VWQP.js";
 
 // src/cli.ts
 import { join } from "path";

package/dist/index.css

@@ -23,6 +23,8 @@
     --color-purple-800: oklch(43.8% 0.218 303.724);
     --color-white: #fff;
     --spacing: 0.25rem;
+    --container-xl: 36rem;
+    --container-2xl: 42rem;
     --text-xs: 0.75rem;
     --text-xs--line-height: calc(1 / 0.75);
     --text-sm: 0.875rem;
@@ -33,6 +35,7 @@
     --font-weight-medium: 500;
     --font-weight-semibold: 600;
     --font-weight-bold: 700;
+    --tracking-wide: 0.025em;
     --tracking-wider: 0.05em;
     --radius-sm: 0.25rem;
     --radius-md: 0.375rem;
@@ -213,6 +216,9 @@
   .pointer-events-none {
     pointer-events: none;
   }
+  .visible {
+    visibility: visible;
+  }
   .absolute {
     position: absolute;
   }
@@ -285,6 +291,9 @@
   .mt-2 {
     margin-top: calc(var(--spacing) * 2);
   }
+  .mt-3 {
+    margin-top: calc(var(--spacing) * 3);
+  }
   .mr-3 {
     margin-right: calc(var(--spacing) * 3);
   }
@@ -306,9 +315,18 @@
   .grid {
     display: grid;
   }
+  .hidden {
+    display: none;
+  }
+  .inline {
+    display: inline;
+  }
   .inline-block {
     display: inline-block;
   }
+  .table {
+    display: table;
+  }
   .size-2 {
     width: calc(var(--spacing) * 2);
     height: calc(var(--spacing) * 2);
@@ -373,9 +391,15 @@
   .w-full {
     width: 100%;
   }
+  .max-w-2xl {
+    max-width: var(--container-2xl);
+  }
   .max-w-full {
     max-width: 100%;
   }
+  .max-w-xl {
+    max-width: var(--container-xl);
+  }
   .min-w-0 {
     min-width: calc(var(--spacing) * 0);
   }
@@ -517,6 +541,12 @@
   .border-edge {
     border-color: var(--color-edge);
   }
+  .border-edge\/70 {
+    border-color: var(--color-edge);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--color-edge) 70%, transparent);
+    }
+  }
   .border-error {
     border-color: var(--color-error);
   }
@@ -529,6 +559,12 @@
       border-color: color-mix(in oklab, var(--color-green-500) 60%, transparent);
     }
   }
+  .border-info\/40 {
+    border-color: var(--color-info);
+    @supports (color: color-mix(in lab, red, red)) {
+      border-color: color-mix(in oklab, var(--color-info) 40%, transparent);
+    }
+  }
   .border-purple-500\/60 {
     border-color: color-mix(in srgb, oklch(62.7% 0.265 303.9) 60%, transparent);
     @supports (color: color-mix(in lab, red, red)) {
@@ -583,6 +619,12 @@
   .bg-info {
     background-color: var(--color-info);
   }
+  .bg-info\/10 {
+    background-color: var(--color-info);
+    @supports (color: color-mix(in lab, red, red)) {
+      background-color: color-mix(in oklab, var(--color-info) 10%, transparent);
+    }
+  }
   .bg-purple-500\/25 {
     background-color: color-mix(in srgb, oklch(62.7% 0.265 303.9) 25%, transparent);
     @supports (color: color-mix(in lab, red, red)) {
@@ -698,6 +740,10 @@
   .text-\[9px\] {
     font-size: 9px;
   }
+  .leading-6 {
+    --tw-leading: calc(var(--spacing) * 6);
+    line-height: calc(var(--spacing) * 6);
+  }
   .font-bold {
     --tw-font-weight: var(--font-weight-bold);
     font-weight: var(--font-weight-bold);
@@ -714,6 +760,10 @@
     --tw-font-weight: var(--font-weight-semibold);
     font-weight: var(--font-weight-semibold);
   }
+  .tracking-wide {
+    --tw-tracking: var(--tracking-wide);
+    letter-spacing: var(--tracking-wide);
+  }
   .tracking-wider {
     --tw-tracking: var(--tracking-wider);
     letter-spacing: var(--tracking-wider);
@@ -1128,6 +1178,10 @@
   inherits: false;
   initial-value: solid;
 }
+@property --tw-leading {
+  syntax: "*";
+  inherits: false;
+}
 @property --tw-font-weight {
   syntax: "*";
   inherits: false;
@@ -1295,6 +1349,7 @@
       --tw-translate-y: 0;
       --tw-translate-z: 0;
       --tw-border-style: solid;
+      --tw-leading: initial;
       --tw-font-weight: initial;
       --tw-tracking: initial;
       --tw-ordinal: initial;