@vizzly-testing/cli 0.10.0 → 0.10.2

package/dist/cli.js

@@ -34,8 +34,9 @@ let logger = createComponentLogger('CLI', {
   verbose: verboseMode || false
 });
 let container = await createServiceContainer(config);
+let plugins = [];
 try {
-  let plugins = await loadPlugins(configPath, config, logger);
+  plugins = await loadPlugins(configPath, config, logger);
   for (let plugin of plugins) {
     try {
       // Add timeout protection for plugin registration (5 seconds)
@@ -58,7 +59,8 @@ program.command('init').description('Initialize Vizzly in your project').option(
   const globalOptions = program.opts();
   await init({
     ...globalOptions,
-    ...options
+    ...options,
+    plugins
   });
 });
 program.command('upload').description('Upload screenshots to Vizzly').argument('<path>', 'Path to screenshots directory or file').option('-b, --build-name <name>', 'Build name for grouping').option('-m, --metadata <json>', 'Additional metadata as JSON').option('--batch-size <n>', 'Upload batch size', v => parseInt(v, 10)).option('--upload-timeout <ms>', 'Upload timeout in milliseconds', v => parseInt(v, 10)).option('--branch <branch>', 'Git branch').option('--commit <sha>', 'Git commit SHA').option('--message <msg>', 'Commit message').option('--environment <env>', 'Environment name', 'test').option('--threshold <number>', 'Comparison threshold', parseFloat).option('--token <token>', 'API token override').option('--wait', 'Wait for build completion').option('--upload-all', 'Upload all screenshots without SHA deduplication').option('--parallel-id <id>', 'Unique identifier for parallel test execution').action(async (path, options) => {

package/dist/commands/init.js

@@ -3,15 +3,19 @@ import fs from 'fs/promises';
 import path from 'path';
 import { VizzlyError } from '../errors/vizzly-error.js';
 import { createComponentLogger } from '../utils/logger-factory.js';
+import { loadPlugins } from '../plugin-loader.js';
+import { loadConfig } from '../utils/config-loader.js';
+import { z } from 'zod';
 
 /**
  * Simple configuration setup for Vizzly CLI
  */
 export class InitCommand {
-  constructor(logger) {
+  constructor(logger, plugins = []) {
     this.logger = logger || createComponentLogger('INIT', {
       level: 'info'
     });
+    this.plugins = plugins;
   }
   async run(options = {}) {
     this.logger.info('🎯 Initializing Vizzly configuration...\n');
@@ -37,7 +41,7 @@ export class InitCommand {
     }
   }
   async generateConfigFile(configPath) {
-    const configContent = `export default {
+    let coreConfig = `export default {
   // Server configuration (for run command)
   server: {
     port: 47392,
@@ -65,11 +69,103 @@ export class InitCommand {
   // TDD configuration
   tdd: {
     openReport: false // Whether to auto-open HTML report in browser
-  }
-};
-`;
-    await fs.writeFile(configPath, configContent, 'utf8');
+  }`;
+
+    // Add plugin configurations
+    let pluginConfigs = this.generatePluginConfigs();
+    if (pluginConfigs) {
+      coreConfig += ',\n\n' + pluginConfigs;
+    }
+    coreConfig += '\n};\n';
+    await fs.writeFile(configPath, coreConfig, 'utf8');
     this.logger.info(`📄 Created vizzly.config.js`);
+
+    // Log discovered plugins
+    let pluginsWithConfig = this.plugins.filter(p => p.configSchema);
+    if (pluginsWithConfig.length > 0) {
+      this.logger.info(`   Added config for ${pluginsWithConfig.length} plugin(s):`);
+      pluginsWithConfig.forEach(p => {
+        this.logger.info(`   - ${p.name}`);
+      });
+    }
+  }
+
+  /**
+   * Generate configuration sections for plugins
+   * @returns {string} Plugin config sections as formatted string
+   */
+  generatePluginConfigs() {
+    let sections = [];
+    for (let plugin of this.plugins) {
+      if (plugin.configSchema) {
+        let configStr = this.formatPluginConfig(plugin);
+        if (configStr) {
+          sections.push(configStr);
+        }
+      }
+    }
+    return sections.length > 0 ? sections.join(',\n\n') : '';
+  }
+
+  /**
+   * Format a plugin's config schema as JavaScript code
+   * @param {Object} plugin - Plugin with configSchema
+   * @returns {string} Formatted config string
+   */
+  formatPluginConfig(plugin) {
+    try {
+      // Validate config schema structure with Zod (defensive check)
+      let configValueSchema = z.lazy(() => z.union([z.string(), z.number(), z.boolean(), z.null(), z.array(configValueSchema), z.record(configValueSchema)]));
+      let configSchemaValidator = z.record(configValueSchema);
+      configSchemaValidator.parse(plugin.configSchema);
+      let configEntries = [];
+      for (let [key, value] of Object.entries(plugin.configSchema)) {
+        let formattedValue = this.formatValue(value, 1);
+        configEntries.push(`  // ${plugin.name} plugin configuration\n  ${key}: ${formattedValue}`);
+      }
+      return configEntries.join(',\n\n');
+    } catch (error) {
+      if (error instanceof z.ZodError) {
+        let messages = error.errors.map(e => `${e.path.join('.')}: ${e.message}`);
+        this.logger.warn(`Invalid config schema for plugin ${plugin.name}: ${messages.join(', ')}`);
+      } else {
+        this.logger.warn(`Failed to format config for plugin ${plugin.name}: ${error.message}`);
+      }
+      return '';
+    }
+  }
+
+  /**
+   * Format a JavaScript value with proper indentation
+   * @param {*} value - Value to format
+   * @param {number} depth - Current indentation depth
+   * @returns {string} Formatted value
+   */
+  formatValue(value, depth = 0) {
+    let indent = '  '.repeat(depth);
+    let nextIndent = '  '.repeat(depth + 1);
+    if (value === null) return 'null';
+    if (value === undefined) return 'undefined';
+    if (typeof value === 'string') return `'${value.replace(/'/g, "\\'")}'`;
+    if (typeof value === 'number' || typeof value === 'boolean') return String(value);
+    if (Array.isArray(value)) {
+      if (value.length === 0) return '[]';
+      let items = value.map(item => {
+        let formatted = this.formatValue(item, depth + 1);
+        return `${nextIndent}${formatted}`;
+      });
+      return `[\n${items.join(',\n')}\n${indent}]`;
+    }
+    if (typeof value === 'object') {
+      let entries = Object.entries(value);
+      if (entries.length === 0) return '{}';
+      let props = entries.map(([k, v]) => {
+        let formatted = this.formatValue(v, depth + 1);
+        return `${nextIndent}${k}: ${formatted}`;
+      });
+      return `{\n${props.join(',\n')}\n${indent}}`;
+    }
+    return String(value);
   }
   showNextSteps() {
     this.logger.info('\n📚 Next steps:');
@@ -92,12 +188,28 @@ export class InitCommand {
 
 // Export factory function for CLI
 export function createInitCommand(options) {
-  const command = new InitCommand(options.logger);
+  const command = new InitCommand(options.logger, options.plugins);
   return () => command.run(options);
 }
 
 // Simple export for direct CLI usage
 export async function init(options = {}) {
-  const command = new InitCommand();
+  let plugins = [];
+
+  // Try to load plugins if not provided
+  if (!options.plugins) {
+    try {
+      let config = await loadConfig(options.config, {});
+      let logger = createComponentLogger('INIT', {
+        level: 'debug'
+      });
+      plugins = await loadPlugins(options.config, config, logger);
+    } catch {
+      // Silent fail - plugins are optional for init
+    }
+  } else {
+    plugins = options.plugins;
+  }
+  const command = new InitCommand(null, plugins);
   return await command.run(options);
 }

package/dist/commands/tdd-daemon.js

@@ -1,4 +1,4 @@
-import { writeFileSync, readFileSync, existsSync, unlinkSync, mkdirSync, openSync } from 'fs';
+import { writeFileSync, readFileSync, existsSync, unlinkSync, mkdirSync } from 'fs';
 import { join } from 'path';
 import { spawn } from 'child_process';
 import { ConsoleUI } from '../utils/console-ui.js';
@@ -36,21 +36,56 @@ export async function tddStartCommand(options = {}, globalOptions = {}) {
     }
     const port = options.port || 47392;
 
-    // Prepare log files for daemon output
-    const logFile = join(vizzlyDir, 'daemon.log');
-    const errorFile = join(vizzlyDir, 'daemon-error.log');
+    // Show loading indicator if downloading baselines (but not in verbose mode since child shows progress)
+    if (options.baselineBuild && !globalOptions.verbose) {
+      ui.startSpinner(`Downloading baselines from build ${options.baselineBuild}...`);
+    }
 
-    // Spawn detached child process to run the server
+    // Spawn child process with stdio inherited during init for direct error visibility
     const child = spawn(process.execPath, [process.argv[1],
     // CLI entry point
     'tdd', 'start', '--daemon-child',
     // Special flag for child process
     '--port', port.toString(), ...(options.open ? ['--open'] : []), ...(options.baselineBuild ? ['--baseline-build', options.baselineBuild] : []), ...(options.baselineComparison ? ['--baseline-comparison', options.baselineComparison] : []), ...(options.environment ? ['--environment', options.environment] : []), ...(options.threshold !== undefined ? ['--threshold', options.threshold.toString()] : []), ...(options.timeout ? ['--timeout', options.timeout] : []), ...(options.token ? ['--token', options.token] : []), ...(globalOptions.json ? ['--json'] : []), ...(globalOptions.verbose ? ['--verbose'] : []), ...(globalOptions.noColor ? ['--no-color'] : [])], {
       detached: true,
-      stdio: ['ignore', openSync(logFile, 'a'), openSync(errorFile, 'a')],
+      stdio: ['ignore', 'inherit', 'inherit', 'ipc'],
       cwd: process.cwd()
     });
 
+    // Wait for child to signal successful init or exit with error
+    let initComplete = false;
+    let initFailed = false;
+    await new Promise(resolve => {
+      // Child disconnects IPC when initialization succeeds
+      child.on('disconnect', () => {
+        initComplete = true;
+        resolve();
+      });
+
+      // Child exits before disconnecting = initialization failed
+      child.on('exit', () => {
+        if (!initComplete) {
+          initFailed = true;
+          resolve();
+        }
+      });
+
+      // Timeout after 30 seconds to prevent indefinite wait
+      setTimeout(() => {
+        if (!initComplete && !initFailed) {
+          initFailed = true;
+          resolve();
+        }
+      }, 30000);
+    });
+    if (initFailed) {
+      if (options.baselineBuild && !globalOptions.verbose) {
+        ui.stopSpinner();
+      }
+      ui.error('TDD server failed to start');
+      process.exit(1);
+    }
+
     // Unref so parent can exit
     child.unref();
 
@@ -62,6 +97,9 @@ export async function tddStartCommand(options = {}, globalOptions = {}) {
       await new Promise(resolve => setTimeout(resolve, retryDelay * (i + 1)));
       running = await isServerRunning(port);
     }
+    if (options.baselineBuild && !globalOptions.verbose) {
+      ui.stopSpinner();
+    }
     if (!running) {
       ui.error('Failed to start TDD server - server not responding to health checks');
       process.exit(1);
@@ -106,6 +144,11 @@ export async function runDaemonChild(options = {}, globalOptions = {}) {
       daemon: true
     }, globalOptions);
 
+    // Disconnect IPC after successful initialization to signal parent
+    if (process.send) {
+      process.disconnect();
+    }
+
     // Store our PID for the stop command
     const pidFile = join(vizzlyDir, 'server.pid');
     writeFileSync(pidFile, process.pid.toString());
@@ -139,15 +182,8 @@ export async function runDaemonChild(options = {}, globalOptions = {}) {
     // Keep process alive
     process.stdin.resume();
   } catch (error) {
-    // Log error to file for debugging
-    const logFile = join(vizzlyDir, 'daemon-error.log');
-    try {
-      writeFileSync(logFile, `[${new Date().toISOString()}] ${error.stack || error}\n`, {
-        flag: 'a'
-      });
-    } catch {
-      // Silent failure if we can't write log
-    }
+    // Most errors shown via inherited stdio, but catch any that weren't
+    console.error(`Fatal error: ${error.message}`);
     process.exit(1);
   }
 }

package/dist/commands/tdd.js

@@ -53,7 +53,9 @@ export async function tddCommand(testCommand, options = {}, globalOptions = {})
     // Collect git metadata
     const branch = await detectBranch(options.branch);
     const commit = await detectCommit(options.commit);
-    if (globalOptions.verbose) {
+
+    // Only show config in verbose mode for non-daemon (daemon shows baseline info instead)
+    if (globalOptions.verbose && !options.daemon) {
       ui.info('TDD Configuration loaded', {
         testCommand,
         port: config.server.port,
@@ -97,8 +99,13 @@ export async function tddCommand(testCommand, options = {}, globalOptions = {})
         ui.info(`TDD screenshot server running on port ${serverInfo.port}`);
         ui.info(`Dashboard: http://localhost:${serverInfo.port}/dashboard`);
       }
-      if (globalOptions.verbose) {
-        ui.info('Server details', serverInfo);
+      // Verbose server details only in non-daemon mode
+      if (globalOptions.verbose && !options.daemon) {
+        ui.info('Server started', {
+          port: serverInfo.port,
+          pid: serverInfo.pid,
+          uptime: serverInfo.uptime
+        });
       }
     });
     testRunner.on('screenshot-captured', screenshotInfo => {

package/dist/plugin-loader.js

@@ -2,6 +2,7 @@ import { glob } from 'glob';
 import { readFileSync } from 'fs';
 import { resolve, dirname } from 'path';
 import { pathToFileURL } from 'url';
+import { z } from 'zod';
 
 /**
  * Load and register plugins from node_modules and config
@@ -128,23 +129,43 @@ async function loadPlugin(pluginPath) {
   }
 }
 
+/**
+ * Zod schema for validating plugin structure
+ */
+const pluginSchema = z.object({
+  name: z.string().min(1, 'Plugin name is required'),
+  version: z.string().optional(),
+  register: z.function(z.tuple([z.any(), z.any()]), z.void()),
+  configSchema: z.record(z.any()).optional()
+});
+
+/**
+ * Zod schema for validating plugin config values
+ * Supports: string, number, boolean, null, arrays, and nested objects
+ */
+const configValueSchema = z.lazy(() => z.union([z.string(), z.number(), z.boolean(), z.null(), z.array(configValueSchema), z.record(configValueSchema)]));
+
 /**
  * Validate plugin has required structure
  * @param {Object} plugin - Plugin object
  * @throws {Error} If plugin structure is invalid
  */
 function validatePluginStructure(plugin) {
-  if (!plugin || typeof plugin !== 'object') {
-    throw new Error('Plugin must export an object');
-  }
-  if (!plugin.name || typeof plugin.name !== 'string') {
-    throw new Error('Plugin must have a name (string)');
-  }
-  if (!plugin.register || typeof plugin.register !== 'function') {
-    throw new Error('Plugin must have a register function');
-  }
-  if (plugin.version && typeof plugin.version !== 'string') {
-    throw new Error('Plugin version must be a string');
+  try {
+    // Validate basic plugin structure
+    pluginSchema.parse(plugin);
+
+    // If configSchema exists, validate it contains valid config values
+    if (plugin.configSchema) {
+      let configSchemaValidator = z.record(configValueSchema);
+      configSchemaValidator.parse(plugin.configSchema);
+    }
+  } catch (error) {
+    if (error instanceof z.ZodError) {
+      let messages = error.errors.map(e => `${e.path.join('.')}: ${e.message}`);
+      throw new Error(`Invalid plugin structure: ${messages.join(', ')}`);
+    }
+    throw error;
   }
 }
 

package/dist/services/tdd-service.js

@@ -90,8 +90,6 @@ export class TddService {
     });
   }
   async downloadBaselines(environment = 'test', branch = null, buildId = null, comparisonId = null) {
-    logger.info('🔍 Looking for baseline build...');
-
     // If no branch specified, try to detect the default branch
     if (!branch) {
       branch = await getDefaultBranch();
@@ -107,7 +105,6 @@ export class TddService {
       let baselineBuild;
       if (buildId) {
         // Use specific build ID - get it with screenshots in one call
-        logger.info(`📌 Using specified build: ${buildId}`);
         const apiResponse = await this.api.getBuild(buildId, 'screenshots');
 
         // Debug the full API response (only in debug mode)
@@ -154,7 +151,6 @@ export class TddService {
         }
         baselineBuild = builds.data[0];
       }
-      logger.info(`📥 Found baseline build: ${colors.cyan(baselineBuild.name || 'Unknown')} (${baselineBuild.id || 'Unknown ID'})`);
 
       // For specific buildId, we already have screenshots, otherwise get build details
       let buildDetails = baselineBuild;
@@ -167,7 +163,8 @@ export class TddService {
         logger.warn('⚠️  No screenshots found in baseline build');
         return null;
       }
-      logger.info(`📸 Downloading ${colors.cyan(buildDetails.screenshots.length)} baseline screenshots...`);
+      logger.info(`Using baseline from build: ${colors.cyan(baselineBuild.name || 'Unknown')} (${baselineBuild.id || 'Unknown ID'})`);
+      logger.info(`Checking ${colors.cyan(buildDetails.screenshots.length)} baseline screenshots...`);
 
       // Debug screenshots structure (only in debug mode)
       logger.debug(`📊 Screenshots array structure:`, {
@@ -352,17 +349,37 @@ export class TddService {
       const metadataPath = join(this.baselinePath, 'metadata.json');
       writeFileSync(metadataPath, JSON.stringify(this.baselineData, null, 2));
 
+      // Save baseline build metadata for MCP plugin
+      const baselineMetadataPath = safePath(this.workingDir, '.vizzly', 'baseline-metadata.json');
+      const buildMetadata = {
+        buildId: baselineBuild.id,
+        buildName: baselineBuild.name,
+        branch: branch,
+        environment: environment,
+        commitSha: baselineBuild.commit_sha,
+        commitMessage: baselineBuild.commit_message,
+        approvalStatus: baselineBuild.approval_status,
+        completedAt: baselineBuild.completed_at,
+        downloadedAt: new Date().toISOString()
+      };
+      writeFileSync(baselineMetadataPath, JSON.stringify(buildMetadata, null, 2));
+
       // Final summary
       const actualDownloads = downloadedCount - skippedCount;
-      const totalAttempted = downloadedCount + errorCount;
-      if (skippedCount > 0 || errorCount > 0) {
-        let summaryParts = [];
-        if (actualDownloads > 0) summaryParts.push(`${actualDownloads} downloaded`);
-        if (skippedCount > 0) summaryParts.push(`${skippedCount} skipped (matching SHA)`);
-        if (errorCount > 0) summaryParts.push(`${errorCount} failed`);
-        logger.info(`✅ Baseline ready - ${summaryParts.join(', ')} - ${totalAttempted}/${buildDetails.screenshots.length} total`);
+      if (skippedCount > 0) {
+        // All skipped (up-to-date)
+        if (actualDownloads === 0) {
+          logger.info(`✅ All ${skippedCount} baselines up-to-date (matching local SHA)`);
+        } else {
+          // Mixed: some downloaded, some skipped
+          logger.info(`✅ Downloaded ${actualDownloads} new screenshots, ${skippedCount} already up-to-date`);
+        }
       } else {
-        logger.info(`✅ Baseline downloaded successfully - ${downloadedCount}/${buildDetails.screenshots.length} screenshots`);
+        // Fresh download
+        logger.info(`✅ Downloaded ${downloadedCount}/${buildDetails.screenshots.length} screenshots successfully`);
+      }
+      if (errorCount > 0) {
+        logger.warn(`⚠️  ${errorCount} screenshots failed to download`);
       }
       return this.baselineData;
     } catch (error) {

package/dist/types/commands/init.d.ts

@@ -5,10 +5,29 @@ export function init(options?: {}): Promise<void>;
  * Simple configuration setup for Vizzly CLI
  */
 export class InitCommand {
-    constructor(logger: any);
+    constructor(logger: any, plugins?: any[]);
     logger: any;
+    plugins: any[];
     run(options?: {}): Promise<void>;
     generateConfigFile(configPath: any): Promise<void>;
+    /**
+     * Generate configuration sections for plugins
+     * @returns {string} Plugin config sections as formatted string
+     */
+    generatePluginConfigs(): string;
+    /**
+     * Format a plugin's config schema as JavaScript code
+     * @param {Object} plugin - Plugin with configSchema
+     * @returns {string} Formatted config string
+     */
+    formatPluginConfig(plugin: any): string;
+    /**
+     * Format a JavaScript value with proper indentation
+     * @param {*} value - Value to format
+     * @param {number} depth - Current indentation depth
+     * @returns {string} Formatted value
+     */
+    formatValue(value: any, depth?: number): string;
     showNextSteps(): void;
     fileExists(filePath: any): Promise<boolean>;
 }

package/dist/types/utils/config-schema.d.ts

@@ -35,14 +35,14 @@ export let vizzlyConfigSchema: z.ZodDefault<z.ZodObject<{
         commit: z.ZodOptional<z.ZodString>;
         message: z.ZodOptional<z.ZodString>;
     }, "strip", z.ZodTypeAny, {
-        message?: string;
         name?: string;
+        message?: string;
         environment?: string;
         branch?: string;
         commit?: string;
     }, {
-        message?: string;
         name?: string;
+        message?: string;
         environment?: string;
         branch?: string;
         commit?: string;
@@ -101,14 +101,14 @@ export let vizzlyConfigSchema: z.ZodDefault<z.ZodObject<{
         commit: z.ZodOptional<z.ZodString>;
         message: z.ZodOptional<z.ZodString>;
     }, "strip", z.ZodTypeAny, {
-        message?: string;
         name?: string;
+        message?: string;
         environment?: string;
         branch?: string;
         commit?: string;
     }, {
-        message?: string;
         name?: string;
+        message?: string;
         environment?: string;
         branch?: string;
         commit?: string;
@@ -167,14 +167,14 @@ export let vizzlyConfigSchema: z.ZodDefault<z.ZodObject<{
         commit: z.ZodOptional<z.ZodString>;
         message: z.ZodOptional<z.ZodString>;
     }, "strip", z.ZodTypeAny, {
-        message?: string;
         name?: string;
+        message?: string;
         environment?: string;
         branch?: string;
         commit?: string;
     }, {
-        message?: string;
         name?: string;
+        message?: string;
         environment?: string;
         branch?: string;
         commit?: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vizzly-testing/cli",
-  "version": "0.10.0",
+  "version": "0.10.2",
   "description": "Visual review platform for UI developers and designers",
   "keywords": [
     "visual-testing",
@@ -84,7 +84,7 @@
     "form-data": "^4.0.0",
     "glob": "^11.0.3",
     "odiff-bin": "^3.2.1",
-    "zod": "^3.24.1"
+    "zod": "^3.25.76"
   },
   "devDependencies": {
     "@babel/cli": "^7.28.0",