ccqa 0.1.2 → 0.1.4

package/package.json

@@ -1,11 +1,14 @@
 {
   "name": "ccqa",
-  "version": "0.1.2",
+  "version": "0.1.4",
   "type": "module",
   "description": "Browser test recorder powered by Claude Code and agent-browser",
   "bin": {
     "ccqa": "./bin/ccqa.ts"
   },
+  "exports": {
+    "./test-helpers": "./src/runtime/test-helpers.ts"
+  },
   "files": [
     "bin/",
     "src/"

package/src/cli/run.ts

@@ -84,7 +84,6 @@ async function runTests(target?: string): Promise<void> {
           "vitest",
           "run",
           scriptFile,
-          "--reporter=default",
           "--reporter=json",
           `--outputFile.json=${reportFile}`,
         ],
@@ -120,8 +119,22 @@ async function readReport(path: string): Promise<VitestJsonReport | null> {
   }
 }
 
+const useColor = process.stdout.isTTY && process.env.NO_COLOR == null;
+const C = {
+  reset: useColor ? "\x1b[0m" : "",
+  bold: useColor ? "\x1b[1m" : "",
+  dim: useColor ? "\x1b[2m" : "",
+  green: useColor ? "\x1b[32m" : "",
+  red: useColor ? "\x1b[31m" : "",
+  yellow: useColor ? "\x1b[33m" : "",
+  cyan: useColor ? "\x1b[36m" : "",
+  gray: useColor ? "\x1b[90m" : "",
+};
+
 function printSummary(summaries: SpecRunSummary[]): void {
-  process.stdout.write("\n────── ccqa summary ──────\n\n");
+  process.stdout.write(
+    `\n${C.cyan}${C.bold}──────── ccqa summary ────────${C.reset}\n\n`,
+  );
 
   let totalTests = 0;
   let totalPassed = 0;
@@ -129,10 +142,11 @@ function printSummary(summaries: SpecRunSummary[]): void {
   let totalSkipped = 0;
 
   for (const s of summaries) {
-    const header = `${s.featureName}/${s.specName}`;
+    const header = `${C.bold}${s.featureName}/${s.specName}${C.reset}`;
     if (!s.report) {
-      const icon = s.exitCode === 0 ? "✓" : "✗";
-      process.stdout.write(`${icon} ${header} (no report)\n`);
+      const ok = s.exitCode === 0;
+      const icon = ok ? `${C.green}✔${C.reset}` : `${C.red}✖${C.reset}`;
+      process.stdout.write(`${icon} ${header} ${C.dim}(no report)${C.reset}\n`);
       continue;
     }
 
@@ -141,32 +155,38 @@ function printSummary(summaries: SpecRunSummary[]): void {
     totalFailed += s.report.numFailedTests;
     totalSkipped += s.report.numPendingTests;
 
-    const icon = s.report.success ? "✓" : "✗";
+    const ok = s.report.success;
+    const icon = ok ? `${C.green}✔${C.reset}` : `${C.red}✖${C.reset}`;
+    const countColor = ok ? C.green : C.red;
     process.stdout.write(
-      `${icon} ${header}  (${s.report.numPassedTests}/${s.report.numTotalTests} passed)\n`,
+      `${icon} ${header}  ${countColor}${s.report.numPassedTests}/${s.report.numTotalTests}${C.reset} ${C.dim}passed${C.reset}\n`,
     );
 
     for (const file of s.report.testResults) {
       for (const a of file.assertionResults) {
         const aIcon = assertionIcon(a.status);
-        const dur = a.duration != null ? `  ${formatDuration(a.duration)}` : "";
+        const dur = a.duration != null ? ` ${C.gray}${formatDuration(a.duration)}${C.reset}` : "";
         process.stdout.write(`    ${aIcon} ${a.fullName}${dur}\n`);
         if (a.status === "failed" && a.failureMessages?.length) {
           for (const msg of a.failureMessages) {
             const firstLine = msg.split("\n")[0] ?? msg;
-            process.stdout.write(`        ${firstLine}\n`);
+            process.stdout.write(`        ${C.red}${firstLine}${C.reset}\n`);
           }
         }
       }
     }
   }
 
+  const specsPassed = summaries.filter((s) => s.exitCode === 0).length;
+  const specsFailed = summaries.filter((s) => s.exitCode !== 0).length;
   process.stdout.write("\n");
   process.stdout.write(
-    `  Specs      ${summaries.length} (${summaries.filter((s) => s.exitCode === 0).length} passed, ${summaries.filter((s) => s.exitCode !== 0).length} failed)\n`,
+    `  ${C.bold}Specs${C.reset}   ${summaries.length}  ` +
+      `(${C.green}${specsPassed} passed${C.reset}, ${specsFailed > 0 ? C.red : C.dim}${specsFailed} failed${C.reset})\n`,
   );
   process.stdout.write(
-    `  Tests      ${totalTests} (${totalPassed} passed, ${totalFailed} failed, ${totalSkipped} skipped)\n`,
+    `  ${C.bold}Tests${C.reset}   ${totalTests}  ` +
+      `(${C.green}${totalPassed} passed${C.reset}, ${totalFailed > 0 ? C.red : C.dim}${totalFailed} failed${C.reset}, ${C.yellow}${totalSkipped} skipped${C.reset})\n`,
   );
   process.stdout.write("\n");
 }
@@ -174,13 +194,13 @@ function printSummary(summaries: SpecRunSummary[]): void {
 function assertionIcon(status: VitestAssertionResult["status"]): string {
   switch (status) {
     case "passed":
-      return "✓";
+      return `${C.green}✔${C.reset}`;
     case "failed":
-      return "✗";
+      return `${C.red}✖${C.reset}`;
     case "skipped":
     case "pending":
     case "todo":
-      return "⊘";
+      return `${C.yellow}◌${C.reset}`;
   }
 }
 

package/src/codegen/actions-to-script.ts

@@ -11,13 +11,10 @@ export interface SetupScript {
 }
 
 export function actionsToScript(actions: TraceAction[], title: string, setupScripts?: SetupScript[]): string {
-  // Resolve the helpers path relative to this file so it works from any cwd
-  const helpersPath = new URL("../runtime/test-helpers.ts", import.meta.url).pathname;
-
   const imports = [
     `import { test } from "vitest";`,
     `import { spawnSync } from "node:child_process";`,
-    `import { ab, abWait, abAssertTextVisible, abAssertVisible, abAssertNotVisible, abAssertUrl, abAssertEnabled, abAssertDisabled, abAssertChecked, abAssertUnchecked } from ${JSON.stringify(helpersPath)};`,
+    `import { ab, abWait, abAssertTextVisible, abAssertVisible, abAssertNotVisible, abAssertUrl, abAssertEnabled, abAssertDisabled, abAssertChecked, abAssertUnchecked } from "ccqa/test-helpers";`,
     "",
     `// Single session shared across all tests — reset per run via cookies clear in first test`,
     `process.env.AGENT_BROWSER_SESSION = \`ccqa-run-\${Date.now()}\`;`,

package/src/runtime/test-helpers.ts

@@ -2,76 +2,126 @@ import { spawnSync } from "node:child_process";
 
 const AB = new URL(import.meta.resolve("agent-browser/bin/agent-browser.js")).pathname;
 
-function spawnAB(args: string[], stdio: "inherit" | "pipe" = "inherit"): { status: number | null; stdout: string } {
-  const result = spawnSync(AB, args, { stdio });
-  return { status: result.status, stdout: result.stdout?.toString().trim() ?? "" };
+type Result = { status: number | null; stdout: string; stderr: string };
+
+function spawnAB(args: string[]): Result {
+  const result = spawnSync(AB, args, { stdio: "pipe" });
+  return {
+    status: result.status,
+    stdout: result.stdout?.toString() ?? "",
+    stderr: result.stderr?.toString() ?? "",
+  };
+}
+
+function logStep(action: string, args: readonly unknown[]): void {
+  const pretty = args.map((a) => (typeof a === "string" ? a : JSON.stringify(a))).join("  ");
+  process.stdout.write(`  ▶ ${action.padEnd(14)} ${pretty}\n`);
+}
+
+function fail(summary: string, result: Result): never {
+  process.stdout.write(`  ✗ ${summary}\n`);
+  const details = [result.stdout, result.stderr].map((s) => s.trim()).filter(Boolean).join("\n");
+  if (details) {
+    for (const line of details.split("\n")) {
+      process.stdout.write(`      ${line}\n`);
+    }
+  }
+  throw new Error(summary);
 }
 
 export function ab(...args: string[]): void {
-  const { status } = spawnAB(args);
-  if (status !== 0) throw new Error(`agent-browser ${args[0]} failed (exit ${status})`);
+  const [command = "", ...rest] = args;
+  logStep(command, rest);
+  const result = spawnAB(args);
+  if (result.status !== 0) {
+    fail(`agent-browser ${command} failed (exit ${result.status})`, result);
+  }
 }
 
 /** Wait for element/text with an explicit timeout so long-running async ops don't hang. */
 export function abWait(selector: string, timeoutMs = 180_000): void {
+  logStep("wait", [selector]);
   const args = selector.startsWith("text=")
     ? ["wait", "--text", selector.slice(5), "--timeout", String(timeoutMs)]
     : ["wait", selector, "--timeout", String(timeoutMs)];
-  const { status } = spawnAB(args);
-  if (status !== 0) throw new Error(`agent-browser wait failed (exit ${status})`);
+  const result = spawnAB(args);
+  if (result.status !== 0) {
+    fail(`wait failed: ${selector}`, result);
+  }
 }
 
 /** Assert stable text is visible on page (via wait --text). */
 export function abAssertTextVisible(text: string, timeoutMs = 30_000): void {
-  const { status } = spawnAB(["wait", "--text", text, "--timeout", String(timeoutMs)]);
-  if (status !== 0) throw new Error(`Assertion failed: text ${JSON.stringify(text)} not found within ${timeoutMs}ms`);
+  logStep("assert.text", [text]);
+  const result = spawnAB(["wait", "--text", text, "--timeout", String(timeoutMs)]);
+  if (result.status !== 0) {
+    fail(`Assertion failed: text ${JSON.stringify(text)} not found within ${timeoutMs}ms`, result);
+  }
 }
 
 /** Assert element is visible (via wait). */
 export function abAssertVisible(selector: string, timeoutMs = 30_000): void {
-  const { status } = spawnAB(["wait", selector, "--timeout", String(timeoutMs)]);
-  if (status !== 0) throw new Error(`Assertion failed: ${JSON.stringify(selector)} not visible within ${timeoutMs}ms`);
+  logStep("assert.visible", [selector]);
+  const result = spawnAB(["wait", selector, "--timeout", String(timeoutMs)]);
+  if (result.status !== 0) {
+    fail(`Assertion failed: ${JSON.stringify(selector)} not visible within ${timeoutMs}ms`, result);
+  }
 }
 
 /** Assert element is NOT visible (via wait --state hidden). */
 export function abAssertNotVisible(selector: string, timeoutMs = 30_000): void {
+  logStep("assert.hidden", [selector]);
   const args = selector.startsWith("text=")
     ? ["wait", "--text", selector.slice(5), "--state", "hidden", "--timeout", String(timeoutMs)]
     : ["wait", selector, "--state", "hidden", "--timeout", String(timeoutMs)];
-  const { status } = spawnAB(args);
-  if (status !== 0) throw new Error(`Assertion failed: ${JSON.stringify(selector)} still visible after ${timeoutMs}ms`);
+  const result = spawnAB(args);
+  if (result.status !== 0) {
+    fail(`Assertion failed: ${JSON.stringify(selector)} still visible after ${timeoutMs}ms`, result);
+  }
 }
 
 /** Assert URL contains a pattern (via get url). */
 export function abAssertUrl(pattern: string): void {
-  const { stdout: url } = spawnAB(["get", "url"], "pipe");
-  if (!url.includes(pattern)) throw new Error(`Assertion failed: URL ${JSON.stringify(url)} does not contain ${JSON.stringify(pattern)}`);
+  logStep("assert.url", [pattern]);
+  const result = spawnAB(["get", "url"]);
+  const url = result.stdout.trim();
+  if (!url.includes(pattern)) {
+    fail(`Assertion failed: URL ${JSON.stringify(url)} does not contain ${JSON.stringify(pattern)}`, result);
+  }
 }
 
 /** Assert element is enabled (via is enabled). */
 export function abAssertEnabled(selector: string): void {
-  const { status, stdout } = spawnAB(["is", "enabled", selector], "pipe");
-  if (status !== 0) throw new Error(`Assertion failed: element ${JSON.stringify(selector)} not found`);
-  if (stdout !== "true") throw new Error(`Assertion failed: ${JSON.stringify(selector)} is not enabled (got: ${stdout})`);
+  logStep("assert.enabled", [selector]);
+  const result = spawnAB(["is", "enabled", selector]);
+  if (result.status !== 0) fail(`Assertion failed: element ${JSON.stringify(selector)} not found`, result);
+  const value = result.stdout.trim();
+  if (value !== "true") fail(`Assertion failed: ${JSON.stringify(selector)} is not enabled (got: ${value})`, result);
 }
 
 /** Assert element is disabled (via is enabled). */
 export function abAssertDisabled(selector: string): void {
-  const { status, stdout } = spawnAB(["is", "enabled", selector], "pipe");
-  if (status !== 0) throw new Error(`Assertion failed: element ${JSON.stringify(selector)} not found`);
-  if (stdout !== "false") throw new Error(`Assertion failed: ${JSON.stringify(selector)} is not disabled (got: ${stdout})`);
+  logStep("assert.disabled", [selector]);
+  const result = spawnAB(["is", "enabled", selector]);
+  if (result.status !== 0) fail(`Assertion failed: element ${JSON.stringify(selector)} not found`, result);
+  const value = result.stdout.trim();
+  if (value !== "false") fail(`Assertion failed: ${JSON.stringify(selector)} is not disabled (got: ${value})`, result);
 }
 
 /** Assert checkbox is checked (via is checked). */
 export function abAssertChecked(selector: string): void {
-  const { status, stdout } = spawnAB(["is", "checked", selector], "pipe");
-  if (status !== 0) throw new Error(`Assertion failed: element ${JSON.stringify(selector)} not found`);
-  if (stdout !== "true") throw new Error(`Assertion failed: ${JSON.stringify(selector)} is not checked (got: ${stdout})`);
+  logStep("assert.checked", [selector]);
+  const result = spawnAB(["is", "checked", selector]);
+  if (result.status !== 0) fail(`Assertion failed: element ${JSON.stringify(selector)} not found`, result);
+  const value = result.stdout.trim();
+  if (value !== "true") fail(`Assertion failed: ${JSON.stringify(selector)} is not checked (got: ${value})`, result);
 }
 
 /** Assert checkbox is unchecked (via is checked). */
 export function abAssertUnchecked(selector: string): void {
-  const { status, stdout } = spawnAB(["is", "checked", selector], "pipe");
-  if (status !== 0) throw new Error(`Assertion failed: element ${JSON.stringify(selector)} not found`);
-  if (stdout !== "false") throw new Error(`Assertion failed: ${JSON.stringify(selector)} is not unchecked (got: ${stdout})`);
+  logStep("assert.unchecked", [selector]);
+  const result = spawnAB(["is", "checked", selector]);
+  if (result.status !== 0) fail(`Assertion failed: element ${JSON.stringify(selector)} not found`, result);
+  const value = result.stdout.trim();
+  if (value !== "false") fail(`Assertion failed: ${JSON.stringify(selector)} is not unchecked (got: ${value})`, result);
 }