afterbefore 0.1.8 → 0.1.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cli.js +19 -7
- package/dist/cli.js.map +1 -1
- package/dist/index.js +18 -6
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/cli.js
CHANGED
|
@@ -1625,18 +1625,30 @@ function normalizeDimensions(img1, img2) {
|
|
|
1625
1625
|
return [pad(img1), pad(img2)];
|
|
1626
1626
|
}
|
|
1627
1627
|
async function generateComposite(beforePath, afterPath, outputPath, browser, bgColor) {
|
|
1628
|
-
const
|
|
1629
|
-
const
|
|
1628
|
+
const beforeBuf = readFileSync5(beforePath);
|
|
1629
|
+
const afterBuf = readFileSync5(afterPath);
|
|
1630
|
+
const beforeUri = `data:image/png;base64,${beforeBuf.toString("base64")}`;
|
|
1631
|
+
const afterUri = `data:image/png;base64,${afterBuf.toString("base64")}`;
|
|
1632
|
+
const beforePng = PNG.sync.read(beforeBuf);
|
|
1633
|
+
const afterPng = PNG.sync.read(afterBuf);
|
|
1634
|
+
const imgW = Math.max(beforePng.width, afterPng.width);
|
|
1635
|
+
const imgH = Math.max(beforePng.height, afterPng.height);
|
|
1636
|
+
const PADDING = 120;
|
|
1637
|
+
const GAP = 80;
|
|
1638
|
+
const LABEL_H = 70;
|
|
1639
|
+
const canvasW = Math.max(600, Math.min(2400, imgW * 2 + GAP + PADDING * 2));
|
|
1640
|
+
const canvasH = Math.max(300, Math.min(2400, imgH + LABEL_H + PADDING * 2));
|
|
1641
|
+
const maxImgH = canvasH - PADDING * 2 - LABEL_H;
|
|
1630
1642
|
const page = await browser.newPage({
|
|
1631
|
-
viewport: { width:
|
|
1643
|
+
viewport: { width: canvasW, height: canvasH },
|
|
1632
1644
|
deviceScaleFactor: 1
|
|
1633
1645
|
});
|
|
1634
1646
|
const html = `<!DOCTYPE html>
|
|
1635
1647
|
<html><head><style>
|
|
1636
1648
|
* { margin: 0; box-sizing: border-box; }
|
|
1637
|
-
body { background: ${bgColor}; display: flex; justify-content: center; align-items: center; width:
|
|
1649
|
+
body { background: ${bgColor}; display: flex; justify-content: center; align-items: center; width: ${canvasW}px; height: ${canvasH}px; padding: ${PADDING}px; gap: ${GAP}px; overflow: hidden; }
|
|
1638
1650
|
.col { flex: 1; display: flex; flex-direction: column; align-items: center; min-width: 0; max-height: 100%; }
|
|
1639
|
-
img { width: 100%; max-height:
|
|
1651
|
+
img { width: 100%; max-height: ${maxImgH}px; object-fit: contain; }
|
|
1640
1652
|
.label { margin-top: 40px; font: 500 30px/1 system-ui, sans-serif; flex-shrink: 0; }
|
|
1641
1653
|
.before { color: #888; }
|
|
1642
1654
|
.after { color: #22c55e; }
|
|
@@ -1867,7 +1879,7 @@ async function runPipeline(options) {
|
|
|
1867
1879
|
const outputDir = resolve4(cwd, output, sessionName);
|
|
1868
1880
|
const startTime = Date.now();
|
|
1869
1881
|
try {
|
|
1870
|
-
const version = true ? "0.1.
|
|
1882
|
+
const version = true ? "0.1.9" : "dev";
|
|
1871
1883
|
console.log(`
|
|
1872
1884
|
afterbefore v${version} \xB7 Comparing against ${base}
|
|
1873
1885
|
`);
|
|
@@ -2012,7 +2024,7 @@ afterbefore v${version} \xB7 Comparing against ${base}
|
|
|
2012
2024
|
var program = new Command();
|
|
2013
2025
|
program.name("afterbefore").description(
|
|
2014
2026
|
"Automatic before/after screenshot capture for PRs. Git diff is the config."
|
|
2015
|
-
).version("0.1.
|
|
2027
|
+
).version("0.1.9").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(
|
|
2016
2028
|
"--threshold <percent>",
|
|
2017
2029
|
"Diff threshold percentage (changes below this are ignored)",
|
|
2018
2030
|
"0.1"
|