afterbefore 0.1.13 → 0.1.14

package/dist/cli.js

@@ -1657,34 +1657,37 @@ async function captureRoutes(tasks, beforeUrl, afterUrl, outputDir, options) {
 
 // src/stages/compare.ts
 import { join as join7, dirname as dirname2 } from "path";
-import { readFileSync as readFileSync5, unlinkSync } from "fs";
+import { unlinkSync } from "fs";
 import { ODiffServer } from "odiff-bin";
 import sharp from "sharp";
-function readPngSize(path) {
-  const buf = readFileSync5(path);
-  return { width: buf.readUInt32BE(16), height: buf.readUInt32BE(20) };
+async function trimImage(path) {
+  const { data, info } = await sharp(path).trim({ threshold: 50 }).toBuffer({ resolveWithObject: true });
+  return { data, width: info.width, height: info.height };
 }
 async function generateComposite(beforePath, afterPath, outputPath, bgColor) {
-  const beforeSize = readPngSize(beforePath);
-  const afterSize = readPngSize(afterPath);
-  const imgW = Math.max(beforeSize.width, afterSize.width);
-  const imgH = Math.max(beforeSize.height, afterSize.height);
-  const PADDING = 120;
-  const GAP = 80;
+  const [beforeTrimmed, afterTrimmed] = await Promise.all([
+    trimImage(beforePath),
+    trimImage(afterPath)
+  ]);
+  const imgW = Math.max(beforeTrimmed.width, afterTrimmed.width);
+  const imgH = Math.max(beforeTrimmed.height, afterTrimmed.height);
+  const PADDING = 40;
+  const GAP = 40;
   const LABEL_H = 70;
   const canvasW = Math.max(600, Math.min(2400, imgW * 2 + GAP + PADDING * 2));
   const canvasH = Math.max(300, Math.min(2400, imgH + LABEL_H + PADDING * 2));
   const maxImgH = canvasH - PADDING * 2 - LABEL_H;
   const colW = Math.floor((canvasW - PADDING * 2 - GAP) / 2);
-  const [beforeBuf, afterBuf] = await Promise.all([
-    sharp(beforePath).resize(colW, maxImgH, { fit: "inside" }).toBuffer({ resolveWithObject: true }),
-    sharp(afterPath).resize(colW, maxImgH, { fit: "inside" }).toBuffer({ resolveWithObject: true })
-  ]);
+  const [beforeBuf, afterBuf] = await Promise.all(
+    [beforeTrimmed, afterTrimmed].map(async (trimmed) => {
+      return await sharp(trimmed.data).resize(colW, maxImgH, { fit: "inside" }).toBuffer({ resolveWithObject: true });
+    })
+  );
   const beforeLeft = PADDING + Math.floor((colW - beforeBuf.info.width) / 2);
   const beforeTop = PADDING + Math.floor((maxImgH - beforeBuf.info.height) / 2);
   const afterLeft = PADDING + colW + GAP + Math.floor((colW - afterBuf.info.width) / 2);
   const afterTop = PADDING + Math.floor((maxImgH - afterBuf.info.height) / 2);
-  const labelY = PADDING + maxImgH + 50;
+  const labelY = PADDING + maxImgH + 20;
   const beforeLabelX = PADDING + Math.floor(colW / 2);
   const afterLabelX = PADDING + colW + GAP + Math.floor(colW / 2);
   const labelSvg = Buffer.from(
@@ -1939,7 +1942,7 @@ async function runPipeline(options) {
   const outputDir = resolve4(cwd, output, sessionName);
   const startTime = Date.now();
   try {
-    const version = true ? "0.1.13" : "dev";
+    const version = true ? "0.1.14" : "dev";
     console.log(`
 afterbefore v${version} \xB7 Comparing against ${base}
 `);
@@ -2084,7 +2087,7 @@ afterbefore v${version} \xB7 Comparing against ${base}
 var program = new Command();
 program.name("afterbefore").description(
   "Automatic before/after screenshot capture for PRs. Git diff is the config."
-).version("0.1.13").option("--base <ref>", "Base branch or ref to compare against", "main").option("--output <dir>", "Output directory for screenshots", ".afterbefore").option("--post", "Post results as a PR comment via gh CLI", false).option(
+).version("0.1.14").option("--base <ref>", "Base branch or ref to compare against", "main").option("--output <dir>", "Output directory for screenshots", ".afterbefore").option("--post", "Post results as a PR comment via gh CLI", false).option(
   "--threshold <percent>",
   "Diff threshold percentage (changes below this are ignored)",
   "0.1"