apex-auditor 0.2.2 → 0.2.3

package/dist/cli.js

@@ -6,6 +6,16 @@ const ANSI_RESET = "\u001B[0m";
 const ANSI_RED = "\u001B[31m";
 const ANSI_YELLOW = "\u001B[33m";
 const ANSI_GREEN = "\u001B[32m";
+const ANSI_CYAN = "\u001B[36m";
+const ANSI_BLUE = "\u001B[34m";
+const LCP_GOOD_MS = 2500;
+const LCP_WARN_MS = 4000;
+const FCP_GOOD_MS = 1800;
+const FCP_WARN_MS = 3000;
+const TBT_GOOD_MS = 200;
+const TBT_WARN_MS = 600;
+const CLS_GOOD = 0.1;
+const CLS_WARN = 0.25;
 function parseArgs(argv) {
     let configPath;
     let ci = false;
@@ -70,11 +80,12 @@ export async function runAuditCli(argv) {
     printLowestPerformancePages(summary.results, useColor);
     const elapsedMs = Date.now() - startTimeMs;
     const elapsedText = formatElapsedTime(elapsedMs);
+    const elapsedDisplay = useColor ? `${ANSI_CYAN}${elapsedText}${ANSI_RESET}` : elapsedText;
     const runsPerTarget = effectiveConfig.runs ?? 1;
     const comboCount = summary.results.length;
     const totalRuns = comboCount * runsPerTarget;
     // eslint-disable-next-line no-console
-    console.log(`\nCompleted in ${elapsedText} (${comboCount} page/device combinations x ${runsPerTarget} runs = ${totalRuns} Lighthouse runs).`);
+    console.log(`\nCompleted in ${elapsedDisplay} (${comboCount} page/device combinations x ${runsPerTarget} runs = ${totalRuns} Lighthouse runs).`);
 }
 function buildMarkdown(results) {
     const header = [
@@ -104,32 +115,37 @@ function buildRow(result) {
     return `| ${result.label} | ${result.path} | ${result.device} | ${scores.performance ?? "-"} | ${scores.accessibility ?? "-"} | ${scores.bestPractices ?? "-"} | ${scores.seo ?? "-"} | ${lcpSeconds} | ${fcpSeconds} | ${tbtMs} | ${cls} | ${error} | ${issues} |`;
 }
 function buildConsoleRow(result, useColor) {
-    const line1 = buildConsoleRowLine1(result, useColor);
-    const line2 = buildConsoleRowLine2(result, useColor);
-    const line3 = buildConsoleRowLine3(result);
-    const lines = [line1];
-    if (line2.length > 0) {
-        lines.push(line2);
+    const scoreLine = buildConsoleScoreLine(result, useColor);
+    const metricsLine = buildConsoleMetricsLine(result, useColor);
+    const errorLine = buildConsoleErrorLine(result, useColor);
+    const issuesLine = buildConsoleIssuesLine(result);
+    const lines = [scoreLine, metricsLine];
+    if (errorLine.length > 0) {
+        lines.push(errorLine);
     }
-    if (line3.length > 0) {
-        lines.push(line3);
+    if (issuesLine.length > 0) {
+        lines.push(issuesLine);
     }
     return lines.join("\n");
 }
-function buildConsoleRowLine1(result, useColor) {
+function buildConsoleScoreLine(result, useColor) {
     const scores = result.scores;
-    const metrics = result.metrics;
-    const lcpSeconds = metrics.lcpMs !== undefined ? (metrics.lcpMs / 1000).toFixed(1) : "-";
-    const fcpSeconds = metrics.fcpMs !== undefined ? (metrics.fcpMs / 1000).toFixed(1) : "-";
-    const tbtMs = metrics.tbtMs !== undefined ? Math.round(metrics.tbtMs).toString() : "-";
-    const cls = metrics.cls !== undefined ? metrics.cls.toFixed(3) : "-";
     const performanceText = colourScore(scores.performance, useColor);
     const accessibilityText = colourScore(scores.accessibility, useColor);
     const bestPracticesText = colourScore(scores.bestPractices, useColor);
     const seoText = colourScore(scores.seo, useColor);
-    return `| ${result.label} | ${result.path} | ${result.device} | ${performanceText} | ${accessibilityText} | ${bestPracticesText} | ${seoText} | ${lcpSeconds} | ${fcpSeconds} | ${tbtMs} | ${cls} |`;
+    const deviceText = formatDeviceLabel(result.device, useColor);
+    return `| ${result.label} | ${result.path} | ${deviceText} | ${performanceText} | ${accessibilityText} | ${bestPracticesText} | ${seoText} |  |  |  |  |`;
 }
-function buildConsoleRowLine2(result, useColor) {
+function buildConsoleMetricsLine(result, useColor) {
+    const metrics = result.metrics;
+    const lcpText = formatMetricSeconds(metrics.lcpMs, LCP_GOOD_MS, LCP_WARN_MS, useColor);
+    const fcpText = formatMetricSeconds(metrics.fcpMs, FCP_GOOD_MS, FCP_WARN_MS, useColor);
+    const tbtText = formatMetricMilliseconds(metrics.tbtMs, TBT_GOOD_MS, TBT_WARN_MS, useColor);
+    const clsText = formatMetricRatio(metrics.cls, CLS_GOOD, CLS_WARN, useColor);
+    return `|  |  |  |  |  |  |  | ${lcpText} | ${fcpText} | ${tbtText} | ${clsText} |`;
+}
+function buildConsoleErrorLine(result, useColor) {
     const errorCode = result.runtimeErrorCode;
     const errorMessage = result.runtimeErrorMessage;
     if (!errorCode && !errorMessage) {
@@ -139,7 +155,7 @@ function buildConsoleRowLine2(result, useColor) {
     const prefix = useColor ? `${ANSI_RED}↳ Error:${ANSI_RESET}` : "↳ Error:";
     return `  ${prefix} ${errorText}`;
 }
-function buildConsoleRowLine3(result) {
+function buildConsoleIssuesLine(result) {
     const issues = formatTopIssues(result.opportunities);
     if (issues.length === 0) {
         return "";
@@ -159,6 +175,57 @@ function formatTopIssues(opportunities) {
     });
     return items.join("; ");
 }
+function formatMetricSeconds(valueMs, goodThresholdMs, warnThresholdMs, useColor) {
+    if (valueMs === undefined) {
+        return "-";
+    }
+    const seconds = valueMs / 1000;
+    const text = `${seconds.toFixed(1)}s`;
+    if (!useColor) {
+        return text;
+    }
+    const colour = selectColourForThreshold(valueMs, goodThresholdMs, warnThresholdMs);
+    return `${colour}${text}${ANSI_RESET}`;
+}
+function formatMetricMilliseconds(valueMs, goodThresholdMs, warnThresholdMs, useColor) {
+    if (valueMs === undefined) {
+        return "-";
+    }
+    const rounded = Math.round(valueMs);
+    const text = `${rounded}ms`;
+    if (!useColor) {
+        return text;
+    }
+    const colour = selectColourForThreshold(valueMs, goodThresholdMs, warnThresholdMs);
+    return `${colour}${text}${ANSI_RESET}`;
+}
+function formatMetricRatio(value, goodThreshold, warnThreshold, useColor) {
+    if (value === undefined) {
+        return "-";
+    }
+    const text = value.toFixed(3);
+    if (!useColor) {
+        return text;
+    }
+    const colour = selectColourForThreshold(value, goodThreshold, warnThreshold);
+    return `${colour}${text}${ANSI_RESET}`;
+}
+function selectColourForThreshold(value, goodThreshold, warnThreshold) {
+    if (value <= goodThreshold) {
+        return ANSI_GREEN;
+    }
+    if (value <= warnThreshold) {
+        return ANSI_YELLOW;
+    }
+    return ANSI_RED;
+}
+function formatDeviceLabel(device, useColor) {
+    if (!useColor) {
+        return device;
+    }
+    const colour = device === "mobile" ? ANSI_CYAN : ANSI_BLUE;
+    return `${colour}${device}${ANSI_RESET}`;
+}
 function colourScore(score, useColor) {
     if (score === undefined) {
         return "-";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "apex-auditor",
-  "version": "0.2.2",
+  "version": "0.2.3",
   "private": false,
   "description": "CLI to run structured Lighthouse audits (Performance, Accessibility, Best Practices, SEO) across routes.",
   "type": "module",