@vizzly-testing/cli 0.30.0 → 0.32.0

package/dist/commands/api.js

@@ -5,6 +5,114 @@
 import { createApiClient as defaultCreateApiClient } from '../api/index.js';
 import { loadConfig as defaultLoadConfig } from '../utils/config-loader.js';
 import * as defaultOutput from '../utils/output.js';
+let ALLOWED_POST_ENDPOINTS = [/^\/api\/sdk\/comparisons\/[^/]+\/approve$/, /^\/api\/sdk\/comparisons\/[^/]+\/reject$/, /^\/api\/sdk\/builds\/[^/]+\/comments$/];
+function createApiCommandDeps(deps = {}) {
+  return {
+    loadConfig: deps.loadConfig || defaultLoadConfig,
+    createApiClient: deps.createApiClient || defaultCreateApiClient,
+    output: deps.output || defaultOutput,
+    exit: deps.exit || (code => process.exit(code))
+  };
+}
+function configureOutput(output, globalOptions) {
+  output.configure({
+    json: globalOptions.json,
+    verbose: globalOptions.verbose,
+    color: !globalOptions.noColor
+  });
+}
+export function normalizeApiEndpoint(endpoint) {
+  let normalizedEndpoint = endpoint.startsWith('/') ? endpoint : `/${endpoint}`;
+  if (!normalizedEndpoint.startsWith('/api/')) {
+    normalizedEndpoint = `/api${normalizedEndpoint}`;
+  }
+  return normalizedEndpoint;
+}
+export function normalizeApiMethod(method = 'GET') {
+  return method.toUpperCase();
+}
+export function isAllowedPostEndpoint(endpoint) {
+  return ALLOWED_POST_ENDPOINTS.some(pattern => pattern.test(endpoint));
+}
+export function parseApiHeaders(headerOption) {
+  let headers = {};
+  let headerList = Array.isArray(headerOption) ? headerOption : [headerOption];
+  for (let header of headerList.filter(Boolean)) {
+    let [key, ...valueParts] = header.split(':');
+    if (key && valueParts.length > 0) {
+      headers[key.trim()] = valueParts.join(':').trim();
+    }
+  }
+  return headers;
+}
+export function appendApiQuery(endpoint, queryOption) {
+  if (!queryOption) {
+    return endpoint;
+  }
+  let params = new URLSearchParams();
+  let queryList = Array.isArray(queryOption) ? queryOption : [queryOption];
+  for (let query of queryList) {
+    let [key, ...valueParts] = query.split('=');
+    if (key && valueParts.length > 0) {
+      params.append(key.trim(), valueParts.join('=').trim());
+    }
+  }
+  let queryString = params.toString();
+  if (!queryString) {
+    return endpoint;
+  }
+  return endpoint + (endpoint.includes('?') ? '&' : '?') + queryString;
+}
+export function validateApiRequest({
+  endpoint,
+  method
+}) {
+  let errors = [];
+  if (method !== 'GET' && method !== 'POST') {
+    errors.push(`Method ${method} not allowed. Use GET for queries or POST for approve/reject/comment.`);
+    return errors;
+  }
+  if (method === 'POST' && !isAllowedPostEndpoint(endpoint)) {
+    errors.push(`POST not allowed for ${endpoint}. Only approve, reject, and comment endpoints support POST.`);
+  }
+  return errors;
+}
+export function buildApiRequest({
+  endpoint,
+  options = {}
+}) {
+  let normalizedEndpoint = normalizeApiEndpoint(endpoint);
+  let method = normalizeApiMethod(options.method || 'GET');
+  let errors = validateApiRequest({
+    endpoint: normalizedEndpoint,
+    method
+  });
+  if (errors.length > 0) {
+    return {
+      errors,
+      method,
+      normalizedEndpoint,
+      requestOptions: null
+    };
+  }
+  let headers = parseApiHeaders(options.header);
+  let requestOptions = {
+    method
+  };
+  if (options.data && method === 'POST') {
+    headers['Content-Type'] = headers['Content-Type'] || 'application/json';
+    requestOptions.body = options.data;
+  }
+  if (Object.keys(headers).length > 0) {
+    requestOptions.headers = headers;
+  }
+  return {
+    errors: [],
+    method,
+    normalizedEndpoint: appendApiQuery(normalizedEndpoint, options.query),
+    requestOptions
+  };
+}
 
 /**
  * API command - make raw API requests
@@ -15,16 +123,14 @@ import * as defaultOutput from '../utils/output.js';
  */
 export async function apiCommand(endpoint, options = {}, globalOptions = {}, deps = {}) {
   let {
-    loadConfig = defaultLoadConfig,
-    createApiClient = defaultCreateApiClient,
-    output = defaultOutput,
-    exit = code => process.exit(code)
-  } = deps;
-  output.configure({
-    json: globalOptions.json,
-    verbose: globalOptions.verbose,
-    color: !globalOptions.noColor
-  });
+    loadConfig,
+    createApiClient,
+    output,
+    exit
+  } = createApiCommandDeps(deps);
+  let displayEndpoint = normalizeApiEndpoint(endpoint);
+  let displayMethod = normalizeApiMethod(options.method || 'GET');
+  configureOutput(output, globalOptions);
   try {
     // Load configuration
     let allOptions = {
@@ -36,71 +142,31 @@ export async function apiCommand(endpoint, options = {}, globalOptions = {}, dep
     // Validate API token
     if (!config.apiKey) {
       output.error('API token required. Use --token or set VIZZLY_TOKEN environment variable');
+      output.cleanup();
       exit(1);
       return;
     }
-
-    // Normalize endpoint
-    let normalizedEndpoint = endpoint.startsWith('/') ? endpoint : `/${endpoint}`;
-    if (!normalizedEndpoint.startsWith('/api/')) {
-      normalizedEndpoint = `/api${normalizedEndpoint}`;
-    }
-
-    // Build request options
-    let method = (options.method || 'GET').toUpperCase();
-
-    // Validate method and endpoint combination
-    if (method === 'POST' && !isAllowedPostEndpoint(normalizedEndpoint)) {
-      output.error(`POST not allowed for ${normalizedEndpoint}. Only approve, reject, and comment endpoints support POST.`);
-      output.hint('Use GET for queries, or use dedicated commands (vizzly approve, vizzly reject, vizzly comment)');
-      exit(1);
-      return;
-    }
-    if (method !== 'GET' && method !== 'POST') {
-      output.error(`Method ${method} not allowed. Use GET for queries.`);
+    let {
+      errors,
+      method,
+      normalizedEndpoint,
+      requestOptions
+    } = buildApiRequest({
+      endpoint,
+      options
+    });
+    displayEndpoint = normalizedEndpoint;
+    displayMethod = method;
+    if (errors.length > 0) {
+      output.error(errors[0]);
+      if (method === 'POST') {
+        output.hint('Use GET for queries, or use dedicated commands (vizzly approve, vizzly reject, vizzly comment)');
+      }
+      output.hint('Most raw API use should stay read-only; prefer dedicated commands for mutations.');
+      output.cleanup();
       exit(1);
       return;
     }
-    let requestOptions = {
-      method
-    };
-
-    // Add headers
-    let headers = {};
-    if (options.header) {
-      let headerList = Array.isArray(options.header) ? options.header : [options.header];
-      for (let h of headerList) {
-        let [key, ...valueParts] = h.split(':');
-        if (key && valueParts.length > 0) {
-          headers[key.trim()] = valueParts.join(':').trim();
-        }
-      }
-    }
-
-    // Add body for POST/PUT/PATCH
-    if (options.data && ['POST', 'PUT', 'PATCH'].includes(method)) {
-      headers['Content-Type'] = headers['Content-Type'] || 'application/json';
-      requestOptions.body = options.data;
-    }
-    if (Object.keys(headers).length > 0) {
-      requestOptions.headers = headers;
-    }
-
-    // Add query parameters
-    if (options.query) {
-      let params = new URLSearchParams();
-      let queryList = Array.isArray(options.query) ? options.query : [options.query];
-      for (let q of queryList) {
-        let [key, ...valueParts] = q.split('=');
-        if (key && valueParts.length > 0) {
-          params.append(key.trim(), valueParts.join('=').trim());
-        }
-      }
-      let queryString = params.toString();
-      if (queryString) {
-        normalizedEndpoint += (normalizedEndpoint.includes('?') ? '&' : '?') + queryString;
-      }
-    }
 
     // Make the request
     output.startSpinner(`${method} ${normalizedEndpoint}`);
@@ -140,8 +206,8 @@ export async function apiCommand(endpoint, options = {}, globalOptions = {}, dep
     output.stopSpinner();
     if (globalOptions.json) {
       output.data({
-        endpoint,
-        method: options.method || 'GET',
+        endpoint: displayEndpoint,
+        method: displayMethod,
         error: {
           message: error.message,
           code: error.code,
@@ -158,19 +224,6 @@ export async function apiCommand(endpoint, options = {}, globalOptions = {}, dep
   }
 }
 
-/**
- * Allowed POST endpoints (whitelist for mutations)
- * Most mutations should use dedicated commands, but these are allowed for raw API access
- */
-const ALLOWED_POST_ENDPOINTS = [/^\/api\/sdk\/comparisons\/[^/]+\/approve$/, /^\/api\/sdk\/comparisons\/[^/]+\/reject$/, /^\/api\/sdk\/builds\/[^/]+\/comments$/];
-
-/**
- * Check if a POST endpoint is allowed
- */
-function isAllowedPostEndpoint(endpoint) {
-  return ALLOWED_POST_ENDPOINTS.some(pattern => pattern.test(endpoint));
-}
-
 /**
  * Validate API command options
  */
@@ -179,12 +232,14 @@ export function validateApiOptions(endpoint, options = {}) {
   if (!endpoint || endpoint.trim() === '') {
     errors.push('Endpoint is required');
   }
-  let method = (options.method || 'GET').toUpperCase();
-
-  // Only GET is allowed by default
-  // POST is allowed only for whitelisted endpoints
-  if (method !== 'GET' && method !== 'POST') {
-    errors.push(`Method ${method} not allowed. Use GET for queries or POST for approve/reject/comment.`);
+  if (!endpoint || endpoint.trim() === '') {
+    return errors;
   }
+  let normalizedEndpoint = normalizeApiEndpoint(endpoint);
+  let method = normalizeApiMethod(options.method || 'GET');
+  errors.push(...validateApiRequest({
+    endpoint: normalizedEndpoint,
+    method
+  }));
   return errors;
 }

package/dist/commands/baselines.js

@@ -2,15 +2,16 @@
  * Baselines command - query local TDD baselines
  */
 
-import { existsSync, readdirSync, statSync } from 'node:fs';
+import { existsSync as defaultExistsSync, readdirSync as defaultReaddirSync, statSync as defaultStatSync } from 'node:fs';
 import { basename, join, resolve } from 'node:path';
-import { loadBaselineMetadata } from '../tdd/metadata/baseline-metadata.js';
+import { loadBaselineMetadata as defaultLoadBaselineMetadata } from '../tdd/metadata/baseline-metadata.js';
 import * as defaultOutput from '../utils/output.js';
+import { createWildcardMatcher } from '../utils/patterns.js';
 
 /**
  * Extract filename from a path
  */
-function getFilename(screenshot) {
+export function getFilename(screenshot) {
   if (screenshot.filename) return screenshot.filename;
   if (screenshot.path) return basename(screenshot.path);
   return null;
@@ -19,7 +20,7 @@ function getFilename(screenshot) {
 /**
  * Extract viewport from screenshot properties
  */
-function getViewport(screenshot) {
+export function getViewport(screenshot) {
   if (screenshot.viewport) return screenshot.viewport;
   if (screenshot.properties?.viewport_width && screenshot.properties?.viewport_height) {
     return {
@@ -29,6 +30,59 @@ function getViewport(screenshot) {
   }
   return null;
 }
+export function createBaselineNameMatcher(pattern) {
+  return createWildcardMatcher(pattern);
+}
+export function getBaselineFiles(baselinesDir, fs = {}) {
+  let {
+    existsSync = defaultExistsSync,
+    readdirSync = defaultReaddirSync,
+    statSync = defaultStatSync
+  } = fs;
+  if (!existsSync(baselinesDir)) {
+    return [];
+  }
+  return readdirSync(baselinesDir).filter(filename => filename.endsWith('.png')).map(filename => {
+    let filePath = join(baselinesDir, filename);
+    try {
+      let stat = statSync(filePath);
+      return {
+        filename,
+        path: filePath,
+        size: stat.size,
+        modifiedAt: stat.mtime.toISOString()
+      };
+    } catch {
+      // File was deleted between readdir and stat, skip it.
+      return null;
+    }
+  }).filter(Boolean);
+}
+export function createBaselineList({
+  baselinesDir,
+  baselineFiles,
+  screenshots
+}) {
+  return screenshots.map(screenshot => {
+    let filename = getFilename(screenshot);
+    let viewport = getViewport(screenshot);
+    let file = baselineFiles.find(candidate => candidate.filename === filename);
+    return {
+      name: screenshot.name,
+      signature: screenshot.signature,
+      filename,
+      path: screenshot.path || file?.path || getFallbackPath(baselinesDir, filename),
+      sha256: screenshot.sha256,
+      viewport,
+      browser: screenshot.browser || null,
+      createdAt: screenshot.createdAt,
+      fileSize: file?.size
+    };
+  });
+}
+function getFallbackPath(baselinesDir, filename) {
+  return filename ? join(baselinesDir, filename) : null;
+}
 
 /**
  * Baselines command - list and query local TDD baselines
@@ -40,7 +94,11 @@ export async function baselinesCommand(options = {}, globalOptions = {}, deps =
   let {
     output = defaultOutput,
     exit = code => process.exit(code),
-    cwd = process.cwd
+    cwd = process.cwd,
+    existsSync = defaultExistsSync,
+    loadBaselineMetadata = defaultLoadBaselineMetadata,
+    readdirSync = defaultReaddirSync,
+    statSync = defaultStatSync
   } = deps;
   output.configure({
     json: globalOptions.json,
@@ -71,33 +129,17 @@ export async function baselinesCommand(options = {}, globalOptions = {}, deps =
     // Load metadata
     let metadata = loadBaselineMetadata(baselinesDir);
     let screenshots = metadata?.screenshots || [];
-
-    // Get actual baseline files
-    let baselineFiles = [];
-    if (existsSync(baselinesDir)) {
-      baselineFiles = readdirSync(baselinesDir).filter(f => f.endsWith('.png')).map(f => {
-        let filePath = join(baselinesDir, f);
-        try {
-          let stat = statSync(filePath);
-          return {
-            filename: f,
-            path: filePath,
-            size: stat.size,
-            modifiedAt: stat.mtime.toISOString()
-          };
-        } catch {
-          // File was deleted between readdir and stat, skip it
-          return null;
-        }
-      }).filter(Boolean);
-    }
+    let baselineFiles = getBaselineFiles(baselinesDir, {
+      existsSync,
+      readdirSync,
+      statSync
+    });
 
     // Filter by name if provided
     if (options.name) {
-      let pattern = options.name.replace(/\*/g, '.*');
-      let regex = new RegExp(pattern, 'i');
-      screenshots = screenshots.filter(s => regex.test(s.name));
-      baselineFiles = baselineFiles.filter(f => regex.test(f.filename));
+      let matchesName = createBaselineNameMatcher(options.name);
+      screenshots = screenshots.filter(s => matchesName(s.name));
+      baselineFiles = baselineFiles.filter(f => matchesName(f.filename));
     }
 
     // Get specific baseline info
@@ -125,7 +167,7 @@ export async function baselinesCommand(options = {}, globalOptions = {}, deps =
           name: screenshot.name,
           signature: screenshot.signature,
           filename,
-          path: screenshot.path || file?.path || join(baselinesDir, filename),
+          path: screenshot.path || file?.path || getFallbackPath(baselinesDir, filename),
           sha256: screenshot.sha256,
           viewport,
           browser: screenshot.browser || null,
@@ -162,21 +204,10 @@ export async function baselinesCommand(options = {}, globalOptions = {}, deps =
 
     // JSON output for list
     if (globalOptions.json) {
-      let baselines = screenshots.map(s => {
-        let filename = getFilename(s);
-        let viewport = getViewport(s);
-        let file = baselineFiles.find(f => f.filename === filename);
-        return {
-          name: s.name,
-          signature: s.signature,
-          filename,
-          path: s.path || file?.path || join(baselinesDir, filename),
-          sha256: s.sha256,
-          viewport,
-          browser: s.browser || null,
-          createdAt: s.createdAt,
-          fileSize: file?.size
-        };
+      let baselines = createBaselineList({
+        baselinesDir,
+        baselineFiles,
+        screenshots
       });
       output.data({
         baselines,
@@ -208,7 +239,7 @@ export async function baselinesCommand(options = {}, globalOptions = {}, deps =
       if (metadata.branch && metadata.branch !== 'local') {
         output.labelValue('Branch', metadata.branch);
       }
-      output.labelValue('Threshold', `${metadata.threshold || 2.0}%`);
+      output.labelValue('Threshold', `${metadata.threshold ?? 2.0} CIEDE2000`);
       output.blank();
     }
     output.labelValue('Count', String(screenshots.length));
@@ -251,7 +282,7 @@ export async function baselinesCommand(options = {}, globalOptions = {}, deps =
 /**
  * Format bytes to human readable
  */
-function formatBytes(bytes) {
+export function formatBytes(bytes) {
   if (bytes < 1024) return `${bytes} B`;
   if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`;
   return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;

package/dist/commands/builds.js

@@ -33,16 +33,17 @@ export async function buildsCommand(options = {}, globalOptions = {}, deps = {})
       ...options
     };
     let config = await loadConfig(globalOptions.config, allOptions);
+    let token = config.apiKey || config.userToken;
 
-    // Validate API token
-    if (!config.apiKey) {
-      output.error('API token required. Use --token or set VIZZLY_TOKEN environment variable');
+    // Validate cloud auth
+    if (!token) {
+      output.error('Authentication required. Use --token, set VIZZLY_TOKEN, or run "vizzly login"');
       exit(1);
       return;
     }
     let client = createApiClient({
       baseUrl: config.apiUrl,
-      token: config.apiKey,
+      token,
       command: 'builds'
     });
 
@@ -328,11 +329,11 @@ function getComparisonStatusIcon(colors, status) {
  */
 export function validateBuildsOptions(options = {}) {
   let errors = [];
-  if (options.limit && (Number.isNaN(options.limit) || options.limit < 1 || options.limit > 250)) {
-    errors.push('--limit must be a number between 1 and 250');
+  if (options.limit !== undefined && (!Number.isInteger(options.limit) || options.limit < 1 || options.limit > 250)) {
+    errors.push('--limit must be an integer between 1 and 250');
   }
-  if (options.offset && (Number.isNaN(options.offset) || options.offset < 0)) {
-    errors.push('--offset must be a non-negative number');
+  if (options.offset !== undefined && (!Number.isInteger(options.offset) || options.offset < 0)) {
+    errors.push('--offset must be a non-negative integer');
   }
   return errors;
 }

package/dist/commands/comparisons.js

@@ -5,6 +5,7 @@
 import { createApiClient as defaultCreateApiClient, getBuild as defaultGetBuild, getComparison as defaultGetComparison, searchComparisons as defaultSearchComparisons } from '../api/index.js';
 import { loadConfig as defaultLoadConfig } from '../utils/config-loader.js';
 import * as defaultOutput from '../utils/output.js';
+import { createWildcardMatcher } from '../utils/patterns.js';
 
 /**
  * Comparisons command - query comparisons with various filters
@@ -77,9 +78,8 @@ export async function comparisonsCommand(options = {}, globalOptions = {}, deps
 
       // Apply name filter if provided
       if (options.name) {
-        let pattern = options.name.replace(/\*/g, '.*');
-        let regex = new RegExp(pattern, 'i');
-        comparisons = comparisons.filter(c => regex.test(c.name));
+        let matchesName = createWildcardMatcher(options.name);
+        comparisons = comparisons.filter(c => matchesName(c.name));
       }
       if (globalOptions.json) {
         output.data({
@@ -202,7 +202,6 @@ function formatComparisonForJson(comparison) {
  * Display a single comparison in detail
  */
 function displayComparison(output, comparison, verbose) {
-  let _colors = output.getColors();
   output.header('comparison', comparison.status);
   output.keyValue({
     Name: comparison.name,
@@ -388,11 +387,11 @@ function getStatusIcon(colors, status) {
  */
 export function validateComparisonsOptions(options = {}) {
   let errors = [];
-  if (options.limit && (Number.isNaN(options.limit) || options.limit < 1 || options.limit > 250)) {
-    errors.push('--limit must be a number between 1 and 250');
+  if (options.limit !== undefined && (!Number.isInteger(options.limit) || options.limit < 1 || options.limit > 250)) {
+    errors.push('--limit must be an integer between 1 and 250');
   }
-  if (options.offset && (Number.isNaN(options.offset) || options.offset < 0)) {
-    errors.push('--offset must be a non-negative number');
+  if (options.offset !== undefined && (!Number.isInteger(options.offset) || options.offset < 0)) {
+    errors.push('--offset must be a non-negative integer');
   }
   return errors;
 }

package/dist/commands/config-cmd.js

@@ -2,6 +2,7 @@
  * Config command - query and display configuration
  */
 
+import { CONFIG_DEFAULTS } from '../config/core.js';
 import { loadConfig as defaultLoadConfig } from '../utils/config-loader.js';
 import * as defaultOutput from '../utils/output.js';
 
@@ -33,15 +34,10 @@ export async function configCommand(key = null, options = {}, globalOptions = {}
 
     // Build the config object to display
     let displayConfig = {
-      server: config.server || {
-        port: 47392,
-        timeout: 30000
-      },
+      server: config.server || CONFIG_DEFAULTS.server,
       build: config.build || {},
       upload: config.upload || {},
-      comparison: config.comparison || {
-        threshold: 2.0
-      },
+      comparison: config.comparison || CONFIG_DEFAULTS.comparison,
       tdd: config.tdd || {}
     };
 
@@ -53,6 +49,15 @@ export async function configCommand(key = null, options = {}, globalOptions = {}
         tokenPrefix: `${config.apiKey.substring(0, 8)}...`
       };
     }
+    if (config.linkedProject) {
+      displayConfig.linkedProject = {
+        organization: config.linkedProject.organizationSlug,
+        project: config.linkedProject.projectSlug,
+        tokenPrefix: config.linkedProject.tokenPrefix,
+        storage: config.linkedProject.storage,
+        expiresAt: config.linkedProject.expiresAt || null
+      };
+    }
 
     // If a specific key is requested, extract it
     if (key) {
@@ -110,6 +115,9 @@ export async function configCommand(key = null, options = {}, globalOptions = {}
       if (displayConfig.api) {
         displaySection(output, 'API', displayConfig.api);
       }
+      if (displayConfig.linkedProject) {
+        displaySection(output, 'Linked Project', displayConfig.linkedProject);
+      }
     } else {
       output.hint('Use --verbose to see all configuration options');
     }