@vizzly-testing/cli 0.3.2 → 0.4.0

package/dist/types/utils/error-messages.d.ts

@@ -1,42 +0,0 @@
-export function formatError(errorCode: any, context?: {}): {
-    message: any;
-    hint?: undefined;
-    docs?: undefined;
-    context?: undefined;
-} | {
-    message: any;
-    hint: any;
-    docs: any;
-    context: {};
-};
-export namespace ERROR_MESSAGES {
-    namespace NO_API_TOKEN {
-        let message: string;
-        let hint: string;
-        let docs: string;
-    }
-    namespace BUILD_CREATION_FAILED {
-        let message_1: string;
-        export { message_1 as message };
-        let hint_1: string;
-        export { hint_1 as hint };
-        let docs_1: string;
-        export { docs_1 as docs };
-    }
-    namespace NO_SCREENSHOTS_FOUND {
-        let message_2: string;
-        export { message_2 as message };
-        let hint_2: string;
-        export { hint_2 as hint };
-        let docs_2: string;
-        export { docs_2 as docs };
-    }
-    namespace PORT_IN_USE {
-        let message_3: string;
-        export { message_3 as message };
-        let hint_3: string;
-        export { hint_3 as hint };
-        let docs_3: string;
-        export { docs_3 as docs };
-    }
-}

package/dist/types/utils/framework-detector.d.ts

@@ -1,5 +0,0 @@
-/**
- * Detect testing framework from project dependencies
- * @returns {Promise<string|null>} Detected framework or null
- */
-export function detectFramework(): Promise<string | null>;

package/dist/types/utils/help.d.ts

@@ -1,11 +0,0 @@
-/**
- * Display help information for the CLI
- * @param {Object} globalOptions - Global CLI options
- */
-export function showHelp(globalOptions?: any): void;
-/**
- * Show error for unknown command
- * @param {string} command - Unknown command name
- * @param {Object} globalOptions - Global CLI options
- */
-export function showUnknownCommand(command: string, globalOptions?: any): void;

package/dist/types/utils/image-comparison.d.ts

@@ -1,42 +0,0 @@
-/**
- * Compare two images and return the difference
- * @param {Buffer} imageBuffer1 - First image buffer
- * @param {Buffer} imageBuffer2 - Second image buffer
- * @param {Object} options - Comparison options
- * @param {number} options.threshold - Matching threshold (0-1)
- * @param {boolean} options.ignoreAntialiasing - Ignore antialiasing
- * @param {boolean} options.ignoreColors - Ignore colors (not supported by odiff)
- * @param {Array} options.ignoreRegions - Regions to ignore in comparison
- * @returns {Promise<Object>} Comparison result
- */
-export function compareImages(imageBuffer1: Buffer, imageBuffer2: Buffer, options?: {
-    threshold: number;
-    ignoreAntialiasing: boolean;
-    ignoreColors: boolean;
-    ignoreRegions: any[];
-}): Promise<any>;
-/**
- * Check if buffer is a valid PNG image
- * @param {Buffer} buffer - Image buffer
- * @returns {boolean} True if valid PNG
- */
-export function isValidPNG(buffer: Buffer): boolean;
-/**
- * Get image dimensions from PNG buffer
- * @param {Buffer} buffer - Image buffer
- * @returns {Object|null} Dimensions or null if invalid
- */
-export function getImageDimensions(buffer: Buffer): any | null;
-/**
- * Compare images with ignore regions
- * @param {Buffer} imageBuffer1 - First image buffer
- * @param {Buffer} imageBuffer2 - Second image buffer
- * @param {Array<{x: number, y: number, width: number, height: number}>} ignoreRegions - Regions to ignore
- * @returns {Promise<Object>} Comparison result
- */
-export function compareImagesWithIgnoreRegions(imageBuffer1: Buffer, imageBuffer2: Buffer, ignoreRegions?: Array<{
-    x: number;
-    y: number;
-    width: number;
-    height: number;
-}>): Promise<any>;

package/dist/types/utils/package.d.ts

@@ -1 +0,0 @@
-export function getPackageInfo(): Promise<any>;

package/dist/types/utils/project-detection.d.ts

@@ -1,19 +0,0 @@
-/**
- * Detect project type and framework
- * @param {string} directory - Directory to analyze
- * @returns {Promise<Object>} Project information
- */
-export function detectProjectType(directory?: string): Promise<any>;
-/**
- * Get suggested test command for framework
- * @param {string} framework - Framework name
- * @param {Object} packageJson - Package.json content
- * @returns {string} Suggested test command
- */
-export function getSuggestedTestCommand(framework: string, packageJson: any): string;
-/**
- * Get suggested screenshots directory for framework
- * @param {string} framework - Framework name
- * @returns {string} Screenshots directory
- */
-export function getSuggestedScreenshotsDir(framework: string): string;

package/dist/types/utils/ui-helpers.d.ts

@@ -1,23 +0,0 @@
-/**
- * Color and styling utilities for Ink components
- */
-/**
- * Check if colors should be used
- */
-export function shouldUseColors(flags?: {}): boolean;
-/**
- * Get color for text based on type and color support
- */
-export function getColor(type: any, flags?: {}): any;
-/**
- * Get status icon with fallback for no-color mode
- */
-export function getStatusIcon(status: any, flags?: {}): any;
-/**
- * Responsive layout helper
- */
-export function getLayout(columns?: number): {
-    type: string;
-    showDetails: boolean;
-    maxWidth: number;
-};

package/dist/utils/diagnostics.js

@@ -1,184 +0,0 @@
-/**
- * Diagnostics utilities for the doctor command
- */
-import { spawn } from 'child_process';
-import { access, constants } from 'fs/promises';
-import { getApiToken } from './environment-config.js';
-
-/**
- * Check if required dependencies are available
- */
-export async function checkDependencies() {
-  const dependencies = {
-    node: await checkNodeVersion(),
-    npm: await checkCommandAvailable('npm'),
-    git: await checkCommandAvailable('git'),
-    odiff: await checkOdiffBinary()
-  };
-  const allOk = Object.values(dependencies).every(dep => dep.available);
-  return {
-    all_ok: allOk,
-    details: dependencies
-  };
-}
-
-/**
- * Check Node.js version
- */
-async function checkNodeVersion() {
-  try {
-    const version = process.version;
-    const majorVersion = parseInt(version.slice(1).split('.')[0]);
-    const supported = majorVersion >= 20;
-    return {
-      available: true,
-      version,
-      supported,
-      message: supported ? 'OK' : 'Node.js 20+ required'
-    };
-  } catch (error) {
-    return {
-      available: false,
-      error: error.message
-    };
-  }
-}
-
-/**
- * Check if a command is available
- */
-async function checkCommandAvailable(command) {
-  return new Promise(resolve => {
-    const child = spawn(command, ['--version'], {
-      stdio: 'pipe'
-    });
-    let output = '';
-    child.stdout.on('data', data => {
-      output += data.toString();
-    });
-    child.on('close', code => {
-      resolve({
-        available: code === 0,
-        version: output.trim().split('\n')[0] || 'Unknown',
-        message: code === 0 ? 'OK' : `Command '${command}' not found`
-      });
-    });
-    child.on('error', () => {
-      resolve({
-        available: false,
-        message: `Command '${command}' not found`
-      });
-    });
-  });
-}
-
-/**
- * Check if odiff binary is available
- */
-async function checkOdiffBinary() {
-  try {
-    // Check if odiff-bin package is installed and binary is accessible
-    const {
-      findOdiffBin
-    } = await import('odiff-bin');
-    const odiffPath = findOdiffBin();
-    await access(odiffPath, constants.F_OK | constants.X_OK);
-    return {
-      available: true,
-      path: odiffPath,
-      message: 'OK'
-    };
-  } catch (error) {
-    return {
-      available: false,
-      error: error.message,
-      message: 'odiff binary not found or not executable'
-    };
-  }
-}
-
-/**
- * Check API connectivity
- */
-
-export async function checkApiConnectivity(config) {
-  try {
-    const apiUrl = config?.apiUrl || 'https://vizzly.dev';
-    const apiKey = config?.apiKey || getApiToken();
-
-    // Basic URL validation
-    try {
-      new globalThis.URL(apiUrl);
-    } catch {
-      throw new Error(`Invalid API URL: ${apiUrl}`);
-    }
-    const result = {
-      url: apiUrl,
-      has_token: !!apiKey,
-      reachable: false,
-      authenticated: false
-    };
-
-    // Try to reach the API
-    try {
-      const response = await fetch(`${apiUrl}/health`, {
-        method: 'GET',
-        timeout: 5000
-      });
-      result.reachable = response.ok;
-      result.status_code = response.status;
-
-      // Test authentication if we have a token
-      if (apiKey && result.reachable) {
-        const authResponse = await fetch(`${apiUrl}/api/user`, {
-          method: 'GET',
-          headers: {
-            Authorization: `Bearer ${apiKey}`,
-            'Content-Type': 'application/json'
-          },
-          timeout: 5000
-        });
-        result.authenticated = authResponse.ok;
-        result.auth_status_code = authResponse.status;
-      }
-    } catch (fetchError) {
-      result.reachable = false;
-      result.error = fetchError.message;
-    }
-    return result;
-  } catch (error) {
-    return {
-      error: error.message,
-      reachable: false,
-      authenticated: false
-    };
-  }
-}
-
-/**
- * Check terminal capabilities
- */
-export function checkTerminalCapabilities() {
-  return {
-    stdout_is_tty: Boolean(process.stdout.isTTY),
-    stdin_is_tty: Boolean(process.stdin.isTTY),
-    supports_color: Boolean(process.stdout.isTTY && process.env.TERM !== 'dumb'),
-    terminal_type: process.env.TERM || 'unknown',
-    columns: process.stdout.columns || 0,
-    rows: process.stdout.rows || 0
-  };
-}
-
-/**
- * Get system information
- */
-export function getSystemInfo() {
-  return {
-    platform: process.platform,
-    arch: process.arch,
-    node_version: process.version,
-    memory_usage: process.memoryUsage(),
-    uptime: process.uptime(),
-    working_directory: process.cwd()
-  };
-}

package/dist/utils/error-messages.js

@@ -1,34 +0,0 @@
-export const ERROR_MESSAGES = {
-  NO_API_TOKEN: {
-    message: 'No API token provided',
-    hint: 'Set the VIZZLY_TOKEN environment variable or pass --token flag',
-    docs: 'https://github.com/vizzly-testing/cli#set-up-your-api-token'
-  },
-  BUILD_CREATION_FAILED: {
-    message: 'Failed to create build',
-    hint: 'Check your API token permissions and network connection',
-    docs: 'https://github.com/vizzly-testing/cli/blob/main/docs/upload-command.md#troubleshooting'
-  },
-  NO_SCREENSHOTS_FOUND: {
-    message: 'No screenshots found',
-    hint: 'Make sure your test code calls vizzlyScreenshot() or check the screenshots directory',
-    docs: 'https://github.com/vizzly-testing/cli/blob/main/docs/getting-started.md'
-  },
-  PORT_IN_USE: {
-    message: 'Port is already in use',
-    hint: 'Try a different port with --port flag or stop the process using this port',
-    docs: 'https://github.com/vizzly-testing/cli/blob/main/docs/test-integration.md#troubleshooting'
-  }
-};
-export function formatError(errorCode, context = {}) {
-  const errorInfo = ERROR_MESSAGES[errorCode];
-  if (!errorInfo) return {
-    message: errorCode
-  };
-  return {
-    message: errorInfo.message,
-    hint: errorInfo.hint,
-    docs: errorInfo.docs,
-    context
-  };
-}

package/dist/utils/framework-detector.js

@@ -1,40 +0,0 @@
-import fs from 'fs/promises';
-import path from 'path';
-
-/**
- * Detect testing framework from project dependencies
- * @returns {Promise<string|null>} Detected framework or null
- */
-export async function detectFramework() {
-  try {
-    const packageJsonPath = path.join(process.cwd(), 'package.json');
-    const packageJson = JSON.parse(await fs.readFile(packageJsonPath, 'utf8'));
-    const dependencies = {
-      ...(packageJson.dependencies || {}),
-      ...(packageJson.devDependencies || {})
-    };
-
-    // Check for common testing frameworks
-    if (dependencies['@playwright/test'] || dependencies.playwright) {
-      return 'playwright';
-    }
-    if (dependencies.cypress) {
-      return 'cypress';
-    }
-    if (dependencies.puppeteer) {
-      return 'puppeteer';
-    }
-
-    // Check for config files
-    const files = await fs.readdir(process.cwd());
-    if (files.some(f => f.includes('playwright.config'))) {
-      return 'playwright';
-    }
-    if (files.some(f => f.includes('cypress.config'))) {
-      return 'cypress';
-    }
-    return null;
-  } catch {
-    return null;
-  }
-}

package/dist/utils/help.js

@@ -1,66 +0,0 @@
-import { createColors } from './colors.js';
-
-/**
- * Display help information for the CLI
- * @param {Object} globalOptions - Global CLI options
- */
-export function showHelp(globalOptions = {}) {
-  const colors = createColors({
-    useColor: !globalOptions.noColor
-  });
-  if (globalOptions.json) {
-    console.log(JSON.stringify({
-      status: 'info',
-      message: 'Vizzly CLI Help',
-      commands: [{
-        name: 'run',
-        description: 'Run tests with Vizzly visual testing'
-      }, {
-        name: 'upload',
-        description: 'Upload screenshots to Vizzly'
-      }, {
-        name: 'init',
-        description: 'Initialize Vizzly configuration'
-      }],
-      timestamp: new Date().toISOString()
-    }));
-    return;
-  }
-  console.log('');
-  console.log(colors.cyan(colors.bold('🔍 Vizzly CLI')));
-  console.log(colors.dim('Visual testing tool for UI developers'));
-  console.log('');
-  console.log(colors.yellow(colors.bold('Available Commands:')));
-  console.log('');
-  console.log(`  ${colors.green(colors.bold('run'))}     Run tests with Vizzly visual testing`);
-  console.log(`  ${colors.green(colors.bold('upload'))}  Upload screenshots to Vizzly`);
-  console.log(`  ${colors.green(colors.bold('init'))}    Initialize Vizzly configuration`);
-  console.log('');
-  console.log(colors.dim('Use ') + colors.cyan('vizzly <command> --help') + colors.dim(' for command-specific options'));
-  console.log('');
-}
-
-/**
- * Show error for unknown command
- * @param {string} command - Unknown command name
- * @param {Object} globalOptions - Global CLI options
- */
-export function showUnknownCommand(command, globalOptions = {}) {
-  const colors = createColors({
-    useColor: !globalOptions.noColor
-  });
-  if (globalOptions.json) {
-    console.error(JSON.stringify({
-      status: 'error',
-      message: `Unknown command: ${command}`,
-      availableCommands: ['run', 'upload', 'init'],
-      timestamp: new Date().toISOString()
-    }));
-    process.exit(1);
-  }
-  console.error(colors.red(`✖ Unknown command: ${command}`));
-  console.error('');
-  console.error(colors.dim('Available commands: run, upload, init'));
-  console.error('');
-  process.exit(1);
-}

package/dist/utils/image-comparison.js

@@ -1,172 +0,0 @@
-import { compare } from 'odiff-bin';
-import fs from 'fs/promises';
-import path from 'path';
-import os from 'os';
-import crypto from 'crypto';
-import { VizzlyError } from '../errors/vizzly-error.js';
-
-/**
- * Compare two images and return the difference
- * @param {Buffer} imageBuffer1 - First image buffer
- * @param {Buffer} imageBuffer2 - Second image buffer
- * @param {Object} options - Comparison options
- * @param {number} options.threshold - Matching threshold (0-1)
- * @param {boolean} options.ignoreAntialiasing - Ignore antialiasing
- * @param {boolean} options.ignoreColors - Ignore colors (not supported by odiff)
- * @param {Array} options.ignoreRegions - Regions to ignore in comparison
- * @returns {Promise<Object>} Comparison result
- */
-export async function compareImages(imageBuffer1, imageBuffer2, options = {}) {
-  // Create temporary files for odiff
-  const tempDir = os.tmpdir();
-  const tempId = crypto.randomBytes(8).toString('hex');
-  const basePath = path.join(tempDir, `vizzly-base-${tempId}.png`);
-  const comparePath = path.join(tempDir, `vizzly-compare-${tempId}.png`);
-  const diffPath = path.join(tempDir, `vizzly-diff-${tempId}.png`);
-  try {
-    // Write buffers to temporary files
-    await fs.writeFile(basePath, imageBuffer1);
-    await fs.writeFile(comparePath, imageBuffer2);
-
-    // Configure odiff options
-    const odiffOptions = {
-      threshold: options.threshold || 0.1,
-      antialiasing: options.ignoreAntialiasing !== false,
-      outputDiffMask: true,
-      failOnLayoutDiff: false,
-      noFailOnFsErrors: false,
-      diffColor: '#ff0000',
-      // Red for differences
-      captureDiffLines: true,
-      reduceRamUsage: false,
-      ignoreRegions: options.ignoreRegions || []
-    };
-
-    // Run odiff comparison
-    const result = await compare(basePath, comparePath, diffPath, odiffOptions);
-
-    // Process results
-    if (result.match) {
-      return {
-        misMatchPercentage: 0,
-        diffPixels: 0,
-        totalPixels: 0,
-        dimensionDifference: {
-          width: 0,
-          height: 0
-        },
-        diffBuffer: null
-      };
-    }
-
-    // Handle different failure reasons
-    switch (result.reason) {
-      case 'layout-diff':
-        {
-          return {
-            misMatchPercentage: 100,
-            dimensionDifference: {
-              width: 'unknown',
-              height: 'unknown'
-            },
-            error: 'Image dimensions do not match',
-            diffBuffer: null
-          };
-        }
-      case 'pixel-diff':
-        {
-          // Read the diff image
-          const diffBuffer = await fs.readFile(diffPath);
-          return {
-            misMatchPercentage: result.diffPercentage,
-            diffPixels: result.diffCount,
-            totalPixels: Math.round(result.diffCount / (result.diffPercentage / 100)),
-            dimensionDifference: {
-              width: 0,
-              height: 0
-            },
-            diffBuffer,
-            diffLines: result.diffLines
-          };
-        }
-      case 'file-not-exists':
-        throw new VizzlyError(`Image file not found: ${result.file}`, 'IMAGE_NOT_FOUND', {
-          file: result.file
-        });
-      default:
-        throw new VizzlyError('Unknown comparison result', 'COMPARISON_UNKNOWN', {
-          result
-        });
-    }
-  } catch (error) {
-    // Re-throw VizzlyErrors
-    if (error instanceof VizzlyError) {
-      throw error;
-    }
-    throw new VizzlyError('Failed to compare images', 'IMAGE_COMPARISON_FAILED', {
-      error: error.message
-    });
-  } finally {
-    // Clean up temporary files
-    await Promise.all([fs.unlink(basePath).catch(() => {}), fs.unlink(comparePath).catch(() => {}), fs.unlink(diffPath).catch(() => {})]);
-  }
-}
-
-/**
- * Check if buffer is a valid PNG image
- * @param {Buffer} buffer - Image buffer
- * @returns {boolean} True if valid PNG
- */
-export function isValidPNG(buffer) {
-  // Check PNG signature
-  if (!buffer || buffer.length < 8) {
-    return false;
-  }
-
-  // PNG signature: 137 80 78 71 13 10 26 10
-  const pngSignature = Buffer.from([137, 80, 78, 71, 13, 10, 26, 10]);
-  return buffer.subarray(0, 8).equals(pngSignature);
-}
-
-/**
- * Get image dimensions from PNG buffer
- * @param {Buffer} buffer - Image buffer
- * @returns {Object|null} Dimensions or null if invalid
- */
-export function getImageDimensions(buffer) {
-  if (!isValidPNG(buffer)) {
-    return null;
-  }
-  try {
-    // PNG dimensions are stored in the IHDR chunk
-    // Skip PNG signature (8 bytes) + chunk length (4 bytes) + chunk type (4 bytes)
-    const width = buffer.readUInt32BE(16);
-    const height = buffer.readUInt32BE(20);
-    return {
-      width,
-      height
-    };
-  } catch {
-    return null;
-  }
-}
-
-/**
- * Compare images with ignore regions
- * @param {Buffer} imageBuffer1 - First image buffer
- * @param {Buffer} imageBuffer2 - Second image buffer
- * @param {Array<{x: number, y: number, width: number, height: number}>} ignoreRegions - Regions to ignore
- * @returns {Promise<Object>} Comparison result
- */
-export async function compareImagesWithIgnoreRegions(imageBuffer1, imageBuffer2, ignoreRegions = []) {
-  // Convert ignore regions to odiff format
-  const odiffIgnoreRegions = ignoreRegions.map(region => ({
-    x1: region.x,
-    y1: region.y,
-    x2: region.x + region.width,
-    y2: region.y + region.height
-  }));
-  return compareImages(imageBuffer1, imageBuffer2, {
-    ignoreRegions: odiffIgnoreRegions
-  });
-}

package/dist/utils/package.js

@@ -1,9 +0,0 @@
-import { readFile } from 'fs/promises';
-import { resolve, dirname } from 'path';
-import { fileURLToPath } from 'url';
-const __dirname = dirname(fileURLToPath(import.meta.url));
-export async function getPackageInfo() {
-  const packagePath = resolve(__dirname, '../../package.json');
-  const content = await readFile(packagePath, 'utf-8');
-  return JSON.parse(content);
-}