@vizzly-testing/cli 0.38.0 → 0.39.0

package/dist/server/handlers/tdd-handler.js

@@ -136,12 +136,20 @@ export const createTddHandler = (config, workingDir, baselineBuild, baselineComp
   const tddService = new TddService(config, workingDir, setBaseline);
   const reportPath = join(workingDir, '.vizzly', 'report-data.json');
   const detailsPath = join(workingDir, '.vizzly', 'comparison-details.json');
+  let capture = {
+    accepted: 0,
+    rejected: 0
+  };
   let clearJsonFile = path => {
     if (existsSync(path)) {
       unlinkSync(path);
     }
   };
   let prepareRunArtifacts = () => {
+    capture = {
+      accepted: 0,
+      rejected: 0
+    };
     clearJsonFile(reportPath);
     clearJsonFile(detailsPath);
     tddService.clearRunData?.();
@@ -284,7 +292,7 @@ export const createTddHandler = (config, workingDir, baselineBuild, baselineComp
       output.debug('tdd', `baseline: ${baseline.buildName}`);
     }
   };
-  const handleScreenshot = async (_buildId, name, image, properties = {}, type, warnings = [], screenshotOptions = {}) => {
+  let processScreenshot = async (_buildId, name, image, properties = {}, type, warnings = [], screenshotOptions = {}) => {
     let handlerStart = Date.now();
     output.debug('tdd', `${name} received`);
 
@@ -411,6 +419,7 @@ export const createTddHandler = (config, workingDir, baselineBuild, baselineComp
       aaPixelsIgnored: comparison.aaPixelsIgnored,
       aaPercentage: comparison.aaPercentage,
       heightDiff: comparison.heightDiff,
+      heightChange: comparison.heightChange,
       error: comparison.error,
       warnings,
       originalName: name,
@@ -498,8 +507,30 @@ export const createTddHandler = (config, workingDir, baselineBuild, baselineComp
       }
     };
   };
+  let handleScreenshot = async (...args) => {
+    let result;
+    try {
+      result = await processScreenshot(...args);
+    } catch (error) {
+      result = {
+        statusCode: error.code === 'INVALID_IMAGE' ? 400 : 500,
+        body: {
+          error: error.message,
+          tddMode: true
+        }
+      };
+    }
+    if (result.statusCode >= 400) capture.rejected++;else capture.accepted++;
+    return result;
+  };
   const getResults = async () => {
-    return await tddService.printResults();
+    let results = await tddService.printResults();
+    return {
+      ...results,
+      capture: {
+        ...capture
+      }
+    };
   };
   const acceptBaseline = async comparisonId => {
     try {

package/dist/server/routers/auth.js

@@ -3,9 +3,10 @@
  * Handles authentication endpoints (device flow login, logout, status)
  */
 
+import { buildTokens, normalizeDeviceFlowResponse } from '../../auth/core.js';
 import * as output from '../../utils/output.js';
 import { parseJsonBody } from '../middleware/json-parser.js';
-import { sendError, sendServiceUnavailable, sendSuccess } from '../middleware/response.js';
+import { sendError, sendJson, sendServiceUnavailable, sendSuccess } from '../middleware/response.js';
 
 /**
  * Create auth router
@@ -50,22 +51,20 @@ export function createAuthRouter({
     // Initiate device flow login
     if (req.method === 'POST' && pathname === '/api/auth/login') {
       try {
-        const deviceFlow = await authService.initiateDeviceFlow();
-
-        // Transform snake_case to camelCase for frontend
-        const response = {
-          deviceCode: deviceFlow.device_code,
-          userCode: deviceFlow.user_code,
-          verificationUri: deviceFlow.verification_uri,
-          verificationUriComplete: deviceFlow.verification_uri_complete,
-          expiresIn: deviceFlow.expires_in,
+        let deviceFlow = await authService.initiateDeviceFlow();
+        let flow = normalizeDeviceFlowResponse(deviceFlow);
+        sendSuccess(res, {
+          deviceCode: flow.deviceCode,
+          userCode: flow.userCode,
+          verificationUri: flow.verificationUri,
+          verificationUriComplete: flow.urlWithCode,
+          expiresIn: deviceFlow.expires_in ?? deviceFlow.expiresIn,
           interval: deviceFlow.interval
-        };
-        sendSuccess(res, response);
+        });
         return true;
       } catch (error) {
         output.error('Error initiating device flow:', error);
-        sendError(res, 500, error.message);
+        sendAuthError(res, error);
         return true;
       }
     }
@@ -81,45 +80,25 @@ export function createAuthRouter({
           sendError(res, 400, 'deviceCode is required');
           return true;
         }
-        let result;
-        try {
-          result = await authService.pollDeviceAuthorization(deviceCode);
-        } catch (error) {
-          // Handle "Authorization pending" as a valid response
-          if (error.message?.includes('Authorization pending')) {
-            sendSuccess(res, {
-              status: 'pending'
-            });
-            return true;
-          }
-          throw error;
-        }
-
-        // Check if authorization is complete by looking for tokens
-        if (result.tokens?.accessToken) {
-          const tokensData = result.tokens;
-          const tokenExpiresIn = tokensData.expiresIn || tokensData.expires_in;
-          const tokenExpiresAt = tokenExpiresIn ? new Date(Date.now() + tokenExpiresIn * 1000).toISOString() : result.expires_at || result.expiresAt;
-          const tokens = {
-            accessToken: tokensData.accessToken || tokensData.access_token,
-            refreshToken: tokensData.refreshToken || tokensData.refresh_token,
-            expiresAt: tokenExpiresAt,
-            user: result.user
-          };
+        let result = await authService.pollDeviceAuthorization(deviceCode);
+        if (result.tokens?.accessToken || result.tokens?.access_token) {
+          let tokens = buildTokens(result);
           await authService.completeDeviceFlow(tokens);
           sendSuccess(res, {
             status: 'complete',
             user: result.user
           });
-        } else {
+        } else if (['pending', 'expired', 'denied', 'invalid'].includes(result.status)) {
           sendSuccess(res, {
-            status: 'pending'
+            status: result.status
           });
+        } else {
+          throw new Error('Unexpected response from authorization server');
         }
         return true;
       } catch (error) {
         output.error('Error polling device authorization:', error);
-        sendError(res, 500, error.message);
+        sendAuthError(res, error);
         return true;
       }
     }
@@ -135,10 +114,21 @@ export function createAuthRouter({
         return true;
       } catch (error) {
         output.error('Error logging out:', error);
-        sendError(res, 500, error.message);
+        sendAuthError(res, error);
         return true;
       }
     }
     return false;
   };
+}
+function sendAuthError(res, error) {
+  let retryAfter = error.context?.retryAfter;
+  if (retryAfter) res.setHeader('Retry-After', String(retryAfter));
+  sendJson(res, error.context?.status || 500, {
+    error: error.message,
+    code: error.context?.serverCode || error.code,
+    ...(retryAfter ? {
+      retryAfter
+    } : {})
+  });
 }

package/dist/services/index.js

@@ -26,8 +26,14 @@ import { TestRunner } from './test-runner.js';
  * @returns {Object} Services object for plugins
  */
 export function createServices(config) {
-  let serverManager = createServerManager(config, {});
-  let testRunner = new TestRunner(config, serverManager);
+  // Direct programmatic config is explicit; loadConfig already distinguishes
+  // explicit comparison settings from its local fallback defaults.
+  let serviceConfig = {
+    ...config,
+    _comparisonOverrides: config._comparisonOverrides ?? config.comparison ?? {}
+  };
+  let serverManager = createServerManager(serviceConfig, {});
+  let testRunner = new TestRunner(serviceConfig, serverManager);
   return {
     serverManager,
     testRunner

package/dist/tdd/services/comparison-service.js

@@ -27,7 +27,8 @@ export async function compareImages(baselinePath, currentPath, diffPath, options
   let analysis = await analyze(baselinePath, currentPath, {
     threshold,
     antialiasing: true,
-    minimumRegionPixels: minClusterSize
+    minimumRegionPixels: minClusterSize,
+    alignHeightChanges: true
   }, {
     diffPath,
     overwrite: true
@@ -45,6 +46,7 @@ export async function compareImages(baselinePath, currentPath, diffPath, options
     aaPixelsIgnored: comparison.pixels.suppressed.antialiasing.count,
     aaPercentage: totalPixels > 0 ? comparison.pixels.suppressed.antialiasing.count / totalPixels * 100 : 0,
     boundingBox: comparison.difference.spatial?.bounds || null,
+    heightChange: heightChange || null,
     heightDiff: heightChange ? heightChange.direction === 'added' ? heightChange.rowCount : -heightChange.rowCount : 0,
     intensityStats: comparison.difference.appearance,
     diffClusters: comparison.difference.regions.map(region => ({
@@ -181,6 +183,7 @@ export function buildFailedComparison(params) {
     aaPercentage: honeydiffResult.aaPercentage,
     boundingBox: honeydiffResult.boundingBox,
     heightDiff: honeydiffResult.heightDiff,
+    heightChange: honeydiffResult.heightChange,
     intensityStats: honeydiffResult.intensityStats,
     diffClusters
   };

package/dist/tdd/tdd-service.js

@@ -9,8 +9,9 @@
  */
 
 import { existsSync as defaultExistsSync, mkdirSync as defaultMkdirSync, readFileSync as defaultReadFileSync, writeFileSync as defaultWriteFileSync } from 'node:fs';
+import { compareSync } from '@vizzly-testing/honeydiff';
 import { createApiClient as defaultCreateApiClient, getBuilds as defaultGetBuilds, getComparison as defaultGetComparison, getTddBaselines as defaultGetTddBaselines } from '../api/index.js';
-import { NetworkError } from '../errors/vizzly-error.js';
+import { NetworkError, VizzlyError } from '../errors/vizzly-error.js';
 import { colors as defaultColors } from '../utils/colors.js';
 import { fetchWithTimeout as defaultFetchWithTimeout } from '../utils/fetch-utils.js';
 import { getDefaultBranch as defaultGetDefaultBranch } from '../utils/git.js';
@@ -809,6 +810,17 @@ export class TddService {
     let currentImagePath = getCurrentPath(this.currentPath, filename);
     let baselineImagePath = getBaselinePath(this.baselinePath, filename);
     let diffImagePath = getDiffPath(this.diffPath, filename);
+    let hasBaseline = baselineExists(this.baselinePath, filename);
+
+    // Existing baselines are decoded by normal comparison. New or explicitly
+    // replaced baselines need the same validation before persisting any bytes.
+    if (this.setBaseline || !hasBaseline) {
+      try {
+        compareSync(imageBuffer, imageBuffer);
+      } catch (error) {
+        throw new VizzlyError(`Invalid screenshot image: ${error.message}`, 'INVALID_IMAGE');
+      }
+    }
 
     // Save current screenshot
     saveCurrent(this.currentPath, filename, imageBuffer);
@@ -819,7 +831,7 @@ export class TddService {
     }
 
     // Check if baseline exists
-    if (!baselineExists(this.baselinePath, filename)) {
+    if (!hasBaseline) {
       // Create new baseline
       saveBaseline(this.baselinePath, filename, imageBuffer);
 

package/dist/test-runner/core.js

@@ -119,11 +119,20 @@ export function determineBuildMode(tdd) {
  * Build result object for disabled run (no Vizzly integration)
  * @returns {Object} Result object
  */
-export function buildDisabledRunResult() {
+export function buildDisabledRunResult(reason = null) {
   return {
     testsPassed: 1,
     testsFailed: 0,
-    screenshotsCaptured: 0
+    screenshotsCaptured: 0,
+    ...(reason ? {
+      capture: {
+        setup: 'disabled',
+        reason,
+        accepted: 0,
+        rejected: 0,
+        errors: 0
+      }
+    } : {})
   };
 }
 
@@ -157,7 +166,23 @@ export function buildRunResult({
       uploads: uploadStats
     } : {}),
     comparisons: tddResults?.comparisons || null,
-    failed: (tddResults?.failed || 0) > 0
+    failed: (tddResults?.failed || 0) > 0,
+    ...(tddResults ? {
+      summary: {
+        total: tddResults.total ?? screenshotCount,
+        passed: tddResults.passed || 0,
+        failed: tddResults.failed || 0,
+        new: tddResults.new || 0,
+        errors: tddResults.errors || 0
+      },
+      capture: {
+        setup: 'ready',
+        reason: tddResults.error || null,
+        accepted: tddResults.capture?.accepted ?? screenshotCount,
+        rejected: tddResults.capture?.rejected || 0,
+        errors: tddResults.errors || 0
+      }
+    } : {})
   };
 }
 

package/dist/test-runner/operations.js

@@ -55,7 +55,7 @@ export async function createBuild({
     throw new Error('No API key available for build creation');
   }
   let client = createApiClient(clientOptions);
-  let payload = buildApiBuildPayload(runOptions, config.comparison);
+  let payload = buildApiBuildPayload(runOptions, config._comparisonOverrides);
   let buildResult = await createApiBuild(client, payload);
   if (!buildResult?.id) {
     throw new Error('Vizzly API did not return a build ID');
@@ -242,22 +242,31 @@ export function executeTestCommand({
 async function executeDisabledTestRun({
   testCommand,
   json,
+  reason,
   deps
 }) {
   let {
     spawn,
     createError
   } = deps;
-  await executeTestCommand({
-    command: testCommand,
-    env: buildDisabledEnv(),
-    json,
-    deps: {
-      spawn,
-      createError
-    }
-  });
-  return buildDisabledRunResult();
+  let result = buildDisabledRunResult(reason);
+  try {
+    await executeTestCommand({
+      command: testCommand,
+      env: buildDisabledEnv(),
+      json,
+      deps: {
+        spawn,
+        createError
+      }
+    });
+  } catch (error) {
+    result.testsPassed = 0;
+    result.testsFailed = 1;
+    error.runResult = result;
+    throw error;
+  }
+  return result;
 }
 
 // ============================================================================
@@ -389,6 +398,7 @@ export async function runTests({
     return executeDisabledTestRun({
       testCommand,
       json: runOptions.json,
+      reason: error.message,
       deps: {
         spawn,
         createError
@@ -430,6 +440,15 @@ export async function runTests({
       output.debug('tdd', 'failed to get results', {
         error: tddError.message
       });
+      tddResults = {
+        total: 0,
+        errors: 1,
+        error: tddError.message,
+        capture: {
+          accepted: 0,
+          rejected: 0
+        }
+      };
     }
   }
 
@@ -474,23 +493,25 @@ export async function runTests({
       output.error('Failed to stop server:', stopError);
     }
   }
+  let result = buildRunResult({
+    buildId,
+    buildUrl,
+    testSuccess,
+    screenshotCount,
+    tddResults,
+    uploadStats
+  });
 
-  // Throw test error after cleanup
+  // Throw test error after cleanup, retaining any completed visual evidence.
   if (testError) {
     if (!runOptions.json) {
       output.error('Test run failed:', testError);
     }
     if (uploadStats) testError.uploads = uploadStats;
+    if (tdd) testError.runResult = result;
     throw testError;
   }
-  return buildRunResult({
-    buildId,
-    buildUrl,
-    testSuccess,
-    screenshotCount,
-    tddResults,
-    uploadStats
-  });
+  return result;
 }
 
 /**

package/dist/types/index.d.ts

@@ -48,9 +48,16 @@ export interface TddConfig {
   openReport?: boolean;
 }
 
+export interface ProjectConfig {
+  organizationSlug: string;
+  projectSlug: string;
+}
+
 export interface VizzlyConfig {
   apiKey?: string;
   apiUrl?: string;
+  /** Nonsecret repository destination. Upload credentials stay in user storage. */
+  project?: ProjectConfig;
   server?: ServerConfig;
   build?: BuildConfig;
   upload?: UploadConfig;
@@ -131,6 +138,7 @@ export interface TddResults {
   failed: number;
   new: number;
   errors: number;
+  capture?: { accepted: number; rejected: number };
   comparisons: ComparisonResult[];
   baseline: BaselineData | null;
 }

package/dist/uploader/core.js

@@ -206,6 +206,7 @@ export function fileToScreenshotFormat(file) {
   return {
     sha256: file.sha256,
     name: file.filename.replace(/\.png$/, ''),
+    filename: file.filename,
     properties: browser ? {
       browser
     } : {}

package/dist/utils/browser.js

@@ -52,7 +52,13 @@ export async function openBrowser(url) {
         args = [url];
         break;
     }
-    execFile(command, args, error => {
+
+    // Some launchers stay in the foreground. Bound the attempt so login and
+    // other CLI workflows can continue using the displayed URL.
+    execFile(command, args, {
+      timeout: 5000,
+      killSignal: 'SIGKILL'
+    }, error => {
       if (error) {
         // Browser opening failed, but don't throw - user can manually open
         resolve(false);

package/dist/utils/config-discovery.js

@@ -0,0 +1,73 @@
+import { readFile } from 'node:fs/promises';
+import path from 'node:path';
+import { cosmiconfigSync, defaultLoadersSync, getDefaultSearchPlacesSync } from 'cosmiconfig';
+let searchPlaces = getDefaultSearchPlacesSync('vizzly');
+export function createConfigExplorer() {
+  return cosmiconfigSync('vizzly', {
+    searchPlaces,
+    searchStrategy: 'none'
+  });
+}
+export async function readOptionalFile(filename) {
+  try {
+    return await readFile(filename, 'utf8');
+  } catch (error) {
+    if (error.code === 'ENOENT') return null;
+    throw error;
+  }
+}
+export function configFormat(filename) {
+  if (path.basename(filename) === 'package.json') return 'package';
+  let extension = path.extname(filename);
+  if (extension === '.json') return 'json';
+  if (extension === '.ts') return 'typescript';
+  if (extension === '.js') return 'javascript';
+  if (extension === '.cjs') return 'commonjs';
+  if (['.yaml', '.yml', ''].includes(extension)) return 'yaml';
+  return 'unknown';
+}
+async function inspectConfig(filename, allowInvalid) {
+  let source = await readOptionalFile(filename);
+  let result = {
+    configPath: filename,
+    exists: source !== null,
+    format: configFormat(filename),
+    source
+  };
+  if (source === null) return result;
+  try {
+    if (result.format === 'package') {
+      result.packageConfig = JSON.parse(source);
+      result.parsedConfig = result.packageConfig.vizzly;
+    } else if (result.format === 'json') {
+      result.parsedConfig = JSON.parse(source);
+    } else if (result.format === 'yaml') {
+      result.parsedConfig = defaultLoadersSync.noExt(filename, source);
+    }
+  } catch (error) {
+    // Replacing a standalone file does not need its old values. Package config
+    // still needs valid JSON so unrelated scripts and dependencies survive.
+    if (!allowInvalid || result.format === 'package') throw error;
+    result.parseError = error.message;
+  }
+  return result;
+}
+
+// Setup discovers source files without evaluating executable configuration or
+// reading credentials. Runtime loading remains the explorer's responsibility.
+export async function discoverConfig({
+  cwd = process.cwd(),
+  configPath = null,
+  allowInvalid = false
+} = {}) {
+  if (configPath) return inspectConfig(path.resolve(cwd, configPath), allowInvalid);
+  for (let place of searchPlaces) {
+    let candidate = await inspectConfig(path.resolve(cwd, place), allowInvalid);
+    if (!candidate.exists || !candidate.source.trim()) continue;
+    if (['package', 'json', 'yaml'].includes(candidate.format) && candidate.parsedConfig == null && !candidate.parseError) {
+      continue;
+    }
+    return candidate;
+  }
+  return inspectConfig(path.resolve(cwd, 'vizzly.config.js'), allowInvalid);
+}

package/dist/utils/config-loader.js

@@ -1,14 +1,14 @@
 import { resolve } from 'node:path';
-import { cosmiconfigSync } from 'cosmiconfig';
 import { CONFIG_DEFAULTS, deepMerge } from '../config/core.js';
+import { createConfigExplorer } from './config-discovery.js';
 import { validateVizzlyConfigWithDefaults } from './config-schema.js';
 import { getApiToken, getApiUrl, getBuildName, getMinClusterSize, getParallelId, getThreshold } from './environment-config.js';
 import { getAccessToken } from './global-config.js';
 import * as output from './output.js';
-import { getActiveProjectLink } from './project-link-store.js';
+import { getProjectLink } from './project-link-store.js';
 export async function loadConfig(configPath = null, cliOverrides = {}) {
   // 1. Load from config file using cosmiconfig
-  let explorer = cosmiconfigSync('vizzly');
+  let explorer = createConfigExplorer();
   let result = configPath ? explorer.load(configPath) : explorer.search();
   let fileConfig = {};
   if (result?.config) {
@@ -18,6 +18,12 @@ export async function loadConfig(configPath = null, cliOverrides = {}) {
 
   // 2. Validate config file using Zod schema
   let validatedFileConfig = validateVizzlyConfigWithDefaults(fileConfig);
+  let comparisonOverrides = {};
+  for (let key of ['threshold', 'minClusterSize']) {
+    if (fileConfig.comparison?.[key] !== undefined) {
+      comparisonOverrides[key] = validatedFileConfig.comparison[key];
+    }
+  }
 
   // Create a proper clone of the default config to avoid shared object references
   let config = deepMerge(CONFIG_DEFAULTS, {});
@@ -42,9 +48,13 @@ export async function loadConfig(configPath = null, cliOverrides = {}) {
     output.debug('config', 'using build name from environment');
   }
   if (envParallelId) config.parallelId = envParallelId;
-  if (envThreshold !== undefined) config.comparison.threshold = envThreshold;
+  if (envThreshold !== undefined) {
+    config.comparison.threshold = envThreshold;
+    comparisonOverrides.threshold = envThreshold;
+  }
   if (envMinClusterSize !== undefined) {
     config.comparison.minClusterSize = envMinClusterSize;
+    comparisonOverrides.minClusterSize = envMinClusterSize;
   }
 
   // 4. Apply CLI overrides (highest priority)
@@ -52,11 +62,21 @@ export async function loadConfig(configPath = null, cliOverrides = {}) {
     output.debug('config', 'using token from --token flag');
   }
   applyCLIOverrides(config, cliOverrides);
+  for (let key of ['threshold', 'minClusterSize']) {
+    if (cliOverrides[key] !== undefined) {
+      comparisonOverrides[key] = config.comparison[key];
+    }
+  }
+  let validatedComparison = validateVizzlyConfigWithDefaults({
+    comparison: comparisonOverrides
+  }).comparison;
+  config._comparisonOverrides = Object.fromEntries(Object.keys(comparisonOverrides).map(key => [key, validatedComparison[key]]));
 
-  // 5. Fall back to a linked project token for cloud upload commands.
-  if (!config.apiKey) {
-    let linkedProject = await getActiveProjectLink({
-      apiUrl: config.apiUrl
+  // 5. Use only the credential belonging to this repository's destination.
+  if (!config.apiKey && config.project) {
+    let linkedProject = await getProjectLink({
+      apiUrl: config.apiUrl,
+      ...config.project
     });
     if (linkedProject?.token) {
       config.apiKey = linkedProject.token;
@@ -83,6 +103,7 @@ export async function loadConfig(configPath = null, cliOverrides = {}) {
     output.debug('config', 'using user login for user-authenticated commands');
   }
   config._configPath = result?.filepath || null;
+  config._configApiUrl = validatedFileConfig.apiUrl;
   return config;
 }
 

package/dist/utils/config-schema.js

@@ -50,6 +50,10 @@ const comparisonSchema = z.object({
 const tddSchema = z.object({
   openReport: z.boolean().default(CONFIG_DEFAULTS.tdd.openReport)
 });
+let projectSchema = z.object({
+  organizationSlug: z.string().trim().min(1),
+  projectSlug: z.string().trim().min(1)
+});
 
 /**
  * Core Vizzly configuration schema
@@ -59,6 +63,7 @@ export const vizzlyConfigSchema = z.object({
   // Core Vizzly config
   apiKey: z.string().optional(),
   apiUrl: z.string().url().default(CONFIG_DEFAULTS.apiUrl),
+  project: projectSchema.optional(),
   server: serverSchema.default(CONFIG_DEFAULTS.server),
   build: buildSchema.default(CONFIG_DEFAULTS.build),
   upload: uploadSchema.default(CONFIG_DEFAULTS.upload),