@vizzly-testing/cli 0.30.0 → 0.32.0

package/dist/utils/project-link-store.js

@@ -0,0 +1,105 @@
+import { loadGlobalConfig, saveGlobalConfig } from './global-config.js';
+import { deleteSecret as defaultDeleteSecret, getSecret as defaultGetSecret, saveSecret as defaultSaveSecret } from './secret-store.js';
+export function buildProjectLinkAccount({
+  apiUrl,
+  organizationSlug,
+  projectSlug
+}) {
+  return `${apiUrl || 'https://app.vizzly.dev'}|${organizationSlug}/${projectSlug}`;
+}
+function getProjectLinkConfig(config) {
+  return config.projectLink || {
+    active: null,
+    links: {}
+  };
+}
+export async function saveProjectLink(link, deps = {}) {
+  let {
+    loadConfig = loadGlobalConfig,
+    saveConfig = saveGlobalConfig,
+    saveSecret = defaultSaveSecret,
+    now = () => new Date()
+  } = deps;
+  let config = await loadConfig();
+  let projectLink = getProjectLinkConfig(config);
+  let account = buildProjectLinkAccount(link);
+  let storedInKeychain = await saveSecret(account, link.token);
+  projectLink.active = account;
+  projectLink.links = {
+    ...projectLink.links,
+    [account]: {
+      apiUrl: link.apiUrl,
+      organizationSlug: link.organizationSlug,
+      organizationName: link.organizationName,
+      projectSlug: link.projectSlug,
+      projectName: link.projectName,
+      tokenId: link.tokenId,
+      tokenPrefix: link.tokenPrefix,
+      expiresAt: link.expiresAt || null,
+      createdAt: link.createdAt || now().toISOString(),
+      storage: storedInKeychain ? 'keychain' : 'file',
+      token: storedInKeychain ? undefined : link.token
+    }
+  };
+  config.projectLink = projectLink;
+  await saveConfig(config);
+  return {
+    ...projectLink.links[account],
+    account,
+    token: link.token
+  };
+}
+export async function getActiveProjectLink(options = {}, deps = {}) {
+  let {
+    loadConfig = loadGlobalConfig,
+    getSecret = defaultGetSecret
+  } = deps;
+  let config = await loadConfig();
+  let projectLink = getProjectLinkConfig(config);
+  let account = options.account || projectLink.active;
+  let link = account ? projectLink.links?.[account] : null;
+  if (!link && options.apiUrl && options.organizationSlug && options.projectSlug) {
+    account = buildProjectLinkAccount(options);
+    link = projectLink.links?.[account] || null;
+  }
+  if (!link) {
+    return null;
+  }
+  if (options.apiUrl && link.apiUrl && link.apiUrl !== options.apiUrl) {
+    return null;
+  }
+  let token = link.storage === 'keychain' ? await getSecret(account) : link.token;
+  if (!token) {
+    return null;
+  }
+  return {
+    ...link,
+    account,
+    token
+  };
+}
+export async function clearActiveProjectLink(deps = {}) {
+  let {
+    loadConfig = loadGlobalConfig,
+    saveConfig = saveGlobalConfig,
+    deleteSecret = defaultDeleteSecret
+  } = deps;
+  let config = await loadConfig();
+  let projectLink = getProjectLinkConfig(config);
+  let account = projectLink.active;
+  if (!account || !projectLink.links?.[account]) {
+    return null;
+  }
+  let link = projectLink.links[account];
+  if (link.storage === 'keychain') {
+    await deleteSecret(account);
+  }
+  delete projectLink.links[account];
+  projectLink.active = null;
+  config.projectLink = projectLink;
+  await saveConfig(config);
+  return {
+    ...link,
+    account
+  };
+}

package/dist/utils/screenshot-options.js

@@ -0,0 +1,28 @@
+/**
+ * Normalize screenshot SDK options into the properties payload consumed by the
+ * local TDD server and cloud-compatible comparison path.
+ */
+export function createScreenshotProperties(options = {}) {
+  let {
+    buildId: _buildId,
+    properties = {},
+    threshold,
+    minClusterSize,
+    fullPage,
+    ...topLevelProperties
+  } = options;
+  let normalizedProperties = {
+    ...topLevelProperties,
+    ...properties
+  };
+  if (threshold !== undefined) {
+    normalizedProperties.threshold = threshold;
+  }
+  if (minClusterSize !== undefined) {
+    normalizedProperties.minClusterSize = minClusterSize;
+  }
+  if (fullPage !== undefined) {
+    normalizedProperties.fullPage = fullPage;
+  }
+  return normalizedProperties;
+}

package/dist/utils/secret-store.js

@@ -0,0 +1,65 @@
+import { execFile } from 'node:child_process';
+import { promisify } from 'node:util';
+let execFileAsync = promisify(execFile);
+let KEYCHAIN_SERVICE = 'vizzly-cli';
+export function canUseKeychain(platform = process.platform, env = process.env) {
+  return platform === 'darwin' && env.VIZZLY_DISABLE_KEYCHAIN !== 'true';
+}
+export async function saveSecret(account, secret, options = {}) {
+  let {
+    service = KEYCHAIN_SERVICE,
+    platform = process.platform,
+    env = process.env,
+    execFileFn = execFileAsync
+  } = options;
+  if (!canUseKeychain(platform, env)) {
+    return false;
+  }
+  try {
+    try {
+      await execFileFn('security', ['delete-generic-password', '-s', service, '-a', account]);
+    } catch {
+      // Missing secrets are fine; add-generic-password creates the current value.
+    }
+    await execFileFn('security', ['add-generic-password', '-s', service, '-a', account, '-w', secret, '-U']);
+    return true;
+  } catch {
+    return false;
+  }
+}
+export async function getSecret(account, options = {}) {
+  let {
+    service = KEYCHAIN_SERVICE,
+    platform = process.platform,
+    env = process.env,
+    execFileFn = execFileAsync
+  } = options;
+  if (!canUseKeychain(platform, env)) {
+    return null;
+  }
+  try {
+    let {
+      stdout
+    } = await execFileFn('security', ['find-generic-password', '-s', service, '-a', account, '-w']);
+    return stdout.trim() || null;
+  } catch {
+    return null;
+  }
+}
+export async function deleteSecret(account, options = {}) {
+  let {
+    service = KEYCHAIN_SERVICE,
+    platform = process.platform,
+    env = process.env,
+    execFileFn = execFileAsync
+  } = options;
+  if (!canUseKeychain(platform, env)) {
+    return false;
+  }
+  try {
+    await execFileFn('security', ['delete-generic-password', '-s', service, '-a', account]);
+    return true;
+  } catch {
+    return false;
+  }
+}

package/package.json

@@ -1,11 +1,13 @@
 {
   "name": "@vizzly-testing/cli",
-  "version": "0.30.0",
-  "description": "Visual review platform for UI developers and designers",
+  "version": "0.32.0",
+  "description": "Visual review for agents and teams",
   "keywords": [
+    "llm-context",
+    "visual-context",
+    "approved-baselines",
     "visual-testing",
     "screenshot-testing",
-    "visual-regression",
     "visual-review",
     "ui-testing",
     "collaboration",
@@ -51,7 +53,6 @@
   "files": [
     "bin",
     "dist",
-    "claude-plugin",
     "README.md",
     "LICENSE"
   ],
@@ -71,12 +72,14 @@
     "test:watch": "node --test --test-reporter=spec --watch $(find tests -name '*.test.js')",
     "test:reporter": "playwright test --config=tests/reporter/playwright.config.js",
     "test:reporter:visual": "node bin/vizzly.js run \"npm run test:reporter\"",
+    "test:swift:e2e": "npm run build && node clients/swift/scripts/run-e2e.js",
     "test:tui": "node --test --test-reporter=spec tests/tui/*.test.js",
     "test:tui:docker": "./tests/tui/run-tui-tests.sh",
-    "lint": "biome check src tests",
-    "lint:fix": "biome check --write --unsafe src tests",
-    "format": "biome format --write src tests",
-    "format:check": "biome format src tests",
+    "smoke:prod:pack": "node scripts/smoke-prod-pack.js",
+    "lint": "biome check src tests clients/storybook/src clients/storybook/tests clients/static-site/src clients/static-site/tests clients/vitest/src clients/vitest/tests clients/ember/src clients/ember/tests clients/ember/bin",
+    "lint:fix": "biome check --write --unsafe src tests clients/storybook/src clients/storybook/tests clients/static-site/src clients/static-site/tests clients/vitest/src clients/vitest/tests clients/ember/src clients/ember/tests clients/ember/bin",
+    "format": "biome format --write src tests clients/storybook/src clients/storybook/tests clients/static-site/src clients/static-site/tests clients/vitest/src clients/vitest/tests clients/ember/src clients/ember/tests clients/ember/bin",
+    "format:check": "biome format src tests clients/storybook/src clients/storybook/tests clients/static-site/src clients/static-site/tests clients/vitest/src clients/vitest/tests clients/ember/src clients/ember/tests clients/ember/bin",
     "fix": "npm run format && npm run lint:fix"
   },
   "engines": {
@@ -87,13 +90,15 @@
     "registry": "https://registry.npmjs.org/"
   },
   "dependencies": {
-    "@vizzly-testing/honeydiff": "^0.10.0",
+    "@vizzly-testing/honeydiff": "^0.10.3",
     "ansis": "^4.2.0",
     "commander": "^14.0.0",
     "cosmiconfig": "^9.0.0",
     "dotenv": "^17.2.1",
     "form-data": "^4.0.0",
     "glob": "^13.0.0",
+    "react": "^19.1.1",
+    "react-dom": "^19.1.1",
     "zod": "^4.1.12"
   },
   "tsd": {
@@ -125,8 +130,6 @@
     "babel-plugin-react-compiler": "^1.0.0",
     "babel-plugin-transform-remove-console": "^6.9.4",
     "postcss": "^8.5.6",
-    "react": "^19.1.1",
-    "react-dom": "^19.1.1",
     "rimraf": "^6.0.1",
     "tailwindcss": "^4.1.13",
     "tsd": "^0.33.0",

package/dist/services/screenshot-server.js

@@ -1,65 +0,0 @@
-/**
- * Screenshot Server Service
- * Listens for and processes screenshots from the test runner
- *
- * This class is a thin wrapper around the functional operations in
- * src/screenshot-server/. It maintains backwards compatibility while
- * delegating to pure functions for testability.
- */
-
-import { createServer } from 'node:http';
-import { VizzlyError } from '../errors/vizzly-error.js';
-import { handleRequest, parseRequestBody, startServer, stopServer } from '../screenshot-server/index.js';
-import * as output from '../utils/output.js';
-export class ScreenshotServer {
-  constructor(config, buildManager, options = {}) {
-    this.config = config;
-    this.buildManager = buildManager;
-    this.server = null;
-
-    // Dependency injection for testing
-    this.deps = options.deps || {
-      createHttpServer: createServer,
-      output,
-      createError: (message, code) => new VizzlyError(message, code)
-    };
-  }
-  async start() {
-    this.server = await startServer({
-      config: this.config,
-      requestHandler: this.handleRequest.bind(this),
-      deps: {
-        createHttpServer: this.deps.createHttpServer,
-        createError: this.deps.createError,
-        output: this.deps.output
-      }
-    });
-  }
-  async stop() {
-    await stopServer({
-      server: this.server,
-      deps: {
-        output: this.deps.output
-      }
-    });
-  }
-  async handleRequest(req, res) {
-    await handleRequest({
-      req,
-      res,
-      deps: {
-        buildManager: this.buildManager,
-        createError: this.deps.createError,
-        output: this.deps.output
-      }
-    });
-  }
-  async parseRequestBody(req) {
-    return parseRequestBody({
-      req,
-      deps: {
-        createError: this.deps.createError
-      }
-    });
-  }
-}

package/dist/services/server-manager.js

@@ -1,81 +0,0 @@
-/**
- * Server Manager Service
- * Manages the HTTP server with functional handlers
- *
- * This class is a thin wrapper around the functional operations in
- * src/server-manager/. It maintains backwards compatibility while
- * delegating to pure functions for testability.
- */
-
-import { existsSync, mkdirSync, unlinkSync, writeFileSync } from 'node:fs';
-import { createApiClient } from '../api/index.js';
-import { createApiHandler } from '../server/handlers/api-handler.js';
-import { createTddHandler } from '../server/handlers/tdd-handler.js';
-import { createHttpServer } from '../server/http-server.js';
-import { buildServerInterface, getTddResults, startServer, stopServer } from '../server-manager/index.js';
-export class ServerManager {
-  constructor(config, options = {}) {
-    this.config = config;
-    this.httpServer = null;
-    this.handler = null;
-    this.services = options.services || {};
-    this.tddMode = false;
-
-    // Dependency injection for testing - defaults to real implementations
-    this.deps = options.deps || {
-      createHttpServer,
-      createTddHandler,
-      createApiHandler,
-      createApiClient,
-      fs: {
-        mkdirSync,
-        writeFileSync,
-        existsSync,
-        unlinkSync
-      }
-    };
-  }
-  async start(buildId = null, tddMode = false, setBaseline = false) {
-    this.buildId = buildId;
-    this.tddMode = tddMode;
-    this.setBaseline = setBaseline;
-    let result = await startServer({
-      config: this.config,
-      buildId,
-      tddMode,
-      setBaseline,
-      projectRoot: process.cwd(),
-      services: this.services,
-      deps: this.deps
-    });
-    this.httpServer = result.httpServer;
-    this.handler = result.handler;
-  }
-  async stop() {
-    await stopServer({
-      httpServer: this.httpServer,
-      handler: this.handler,
-      projectRoot: process.cwd(),
-      deps: this.deps
-    });
-  }
-
-  // Expose server interface for compatibility
-  get server() {
-    return buildServerInterface({
-      handler: this.handler,
-      httpServer: this.httpServer
-    });
-  }
-
-  /**
-   * Get TDD results (comparisons, screenshot count, etc.)
-   * Only available in TDD mode after tests have run
-   */
-  async getTddResults() {
-    return getTddResults({
-      tddMode: this.tddMode,
-      handler: this.handler
-    });
-  }
-}

package/dist/services/uploader.js

@@ -1,100 +0,0 @@
-/**
- * Vizzly Screenshot Uploader
- * Handles screenshot uploads to the Vizzly platform
- *
- * This module is a thin wrapper around the functional operations in
- * src/uploader/. It maintains backwards compatibility while
- * delegating to pure functions for testability.
- */
-
-import { readFile, stat } from 'node:fs/promises';
-import { glob } from 'glob';
-import { checkShas, createApiClient, createBuild } from '../api/index.js';
-import { TimeoutError, UploadError, ValidationError } from '../errors/vizzly-error.js';
-import { resolveBatchSize, resolveTimeout } from '../uploader/index.js';
-import { upload as uploadOperation, waitForBuild as waitForBuildOperation } from '../uploader/operations.js';
-import { getDefaultBranch } from '../utils/git.js';
-import * as output from '../utils/output.js';
-
-/**
- * Create a new uploader instance
- */
-export function createUploader({
-  apiKey,
-  apiUrl,
-  userAgent,
-  command,
-  upload: uploadConfig = {}
-} = {}, options = {}) {
-  let signal = options.signal || new AbortController().signal;
-  let client = createApiClient({
-    baseUrl: apiUrl,
-    token: apiKey,
-    command: command || 'upload',
-    sdkUserAgent: userAgent,
-    allowNoToken: true
-  });
-
-  // Resolve tunable parameters
-  let batchSize = resolveBatchSize(options, uploadConfig);
-  let timeout = resolveTimeout(options, uploadConfig);
-
-  // Dependency injection for testing
-  let deps = options.deps || {
-    client,
-    createBuild,
-    getDefaultBranch,
-    glob,
-    readFile,
-    stat,
-    checkShas,
-    createError: (message, code, context) => {
-      let error = new UploadError(message, context);
-      error.code = code;
-      return error;
-    },
-    createValidationError: (message, context) => new ValidationError(message, context),
-    createUploadError: (message, context) => new UploadError(message, context),
-    createTimeoutError: (message, context) => new TimeoutError(message, context),
-    output
-  };
-
-  /**
-   * Upload screenshots to Vizzly
-   */
-  async function upload(uploadOptions) {
-    return uploadOperation({
-      uploadOptions,
-      config: {
-        apiKey,
-        apiUrl
-      },
-      signal,
-      batchSize,
-      deps: {
-        ...deps,
-        client: deps.client || client
-      }
-    });
-  }
-
-  /**
-   * Wait for a build to complete
-   */
-  async function waitForBuild(buildId, waitTimeout = timeout) {
-    return waitForBuildOperation({
-      buildId,
-      timeout: waitTimeout,
-      signal,
-      client: deps.client || client,
-      deps: {
-        createError: deps.createError,
-        createTimeoutError: deps.createTimeoutError
-      }
-    });
-  }
-  return {
-    upload,
-    waitForBuild
-  };
-}

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

@@ -1,75 +0,0 @@
-/**
- * Region Service
- *
- * Functions for downloading and managing user-defined hotspot regions from the cloud.
- * Regions are 2D bounding boxes that users have confirmed as dynamic content areas.
- */
-
-import { saveRegionMetadata } from '../metadata/region-metadata.js';
-
-/**
- * Download user-defined regions from cloud API
- *
- * @param {Object} options
- * @param {Object} options.api - ApiService instance
- * @param {string} options.workingDir - Working directory
- * @param {string[]} options.screenshotNames - Names of screenshots to get regions for
- * @param {boolean} options.includeCandidates - Include candidate regions (default: false)
- * @returns {Promise<{ success: boolean, count: number, regionCount: number, error?: string }>}
- */
-export async function downloadRegions(options) {
-  let {
-    api,
-    workingDir,
-    screenshotNames,
-    includeCandidates = false
-  } = options;
-  if (!screenshotNames || screenshotNames.length === 0) {
-    return {
-      success: true,
-      count: 0,
-      regionCount: 0
-    };
-  }
-  try {
-    let response = await api.getRegions(screenshotNames, {
-      includeCandidates
-    });
-    if (!response?.regions) {
-      return {
-        success: false,
-        error: 'API returned no region data'
-      };
-    }
-
-    // Save regions to disk
-    saveRegionMetadata(workingDir, response.regions, response.summary);
-
-    // Calculate stats
-    let count = Object.keys(response.regions).length;
-    let regionCount = response.summary?.total_regions || 0;
-    return {
-      success: true,
-      count,
-      regionCount
-    };
-  } catch (error) {
-    return {
-      success: false,
-      error: error.message
-    };
-  }
-}
-
-/**
- * Extract screenshot names from a list of screenshots
- *
- * @param {Array} screenshots - Screenshots with name property
- * @returns {string[]}
- */
-export function extractScreenshotNames(screenshots) {
-  if (!screenshots || !Array.isArray(screenshots)) {
-    return [];
-  }
-  return screenshots.map(s => s.name).filter(Boolean);
-}

package/dist/utils/build-history.js

@@ -1,103 +0,0 @@
-import { existsSync, mkdirSync, readdirSync, rmSync, writeFileSync } from 'node:fs';
-import { join } from 'node:path';
-
-/**
- * Archive a build to history directory
- * @param {string} workingDir - Working directory
- * @param {string} buildId - Build ID to archive
- * @param {Array} builds - Build data
- * @param {Array} comparisons - Comparison data
- * @param {Object} summary - Summary stats
- * @param {number} maxHistory - Maximum number of builds to keep (default: 3)
- */
-export function archiveBuild(workingDir, buildId, builds, comparisons, summary, maxHistory = 3) {
-  const historyDir = join(workingDir, '.vizzly', 'history');
-
-  // Create history directory if it doesn't exist
-  if (!existsSync(historyDir)) {
-    mkdirSync(historyDir, {
-      recursive: true
-    });
-  }
-
-  // Save current build to history
-  const buildDir = join(historyDir, buildId);
-  if (!existsSync(buildDir)) {
-    mkdirSync(buildDir, {
-      recursive: true
-    });
-  }
-  const buildData = {
-    buildId,
-    timestamp: Date.now(),
-    builds,
-    comparisons,
-    summary
-  };
-  writeFileSync(join(buildDir, 'report.json'), JSON.stringify(buildData, null, 2));
-
-  // Clean up old builds (keep last N)
-  cleanupOldBuilds(historyDir, maxHistory);
-}
-
-/**
- * Get list of archived builds
- * @param {string} workingDir - Working directory
- * @returns {Array} Array of build metadata
- */
-export function getArchivedBuilds(workingDir) {
-  const historyDir = join(workingDir, '.vizzly', 'history');
-  if (!existsSync(historyDir)) {
-    return [];
-  }
-  try {
-    const buildDirs = readdirSync(historyDir, {
-      withFileTypes: true
-    }).filter(dirent => dirent.isDirectory()).map(dirent => dirent.name).sort().reverse(); // Newest first
-
-    return buildDirs.map(buildId => {
-      const reportPath = join(historyDir, buildId, 'report.json');
-      if (existsSync(reportPath)) {
-        try {
-          const data = JSON.parse(require('node:fs').readFileSync(reportPath, 'utf8'));
-          return {
-            buildId: data.buildId,
-            timestamp: data.timestamp,
-            summary: data.summary
-          };
-        } catch {
-          return null;
-        }
-      }
-      return null;
-    }).filter(Boolean);
-  } catch {
-    return [];
-  }
-}
-
-/**
- * Remove old builds, keeping only the last N
- * @private
- */
-function cleanupOldBuilds(historyDir, maxHistory) {
-  try {
-    const buildDirs = readdirSync(historyDir, {
-      withFileTypes: true
-    }).filter(dirent => dirent.isDirectory()).map(dirent => dirent.name).sort().reverse(); // Newest first
-
-    // Remove builds beyond maxHistory
-    if (buildDirs.length > maxHistory) {
-      const toRemove = buildDirs.slice(maxHistory);
-      toRemove.forEach(buildId => {
-        const buildDir = join(historyDir, buildId);
-        rmSync(buildDir, {
-          recursive: true,
-          force: true
-        });
-      });
-    }
-  } catch {
-    // Ignore cleanup errors
-  }
-}