@vizzly-testing/cli 0.10.3 → 0.11.0

package/dist/services/api-service.js

@@ -8,23 +8,26 @@ import { VizzlyError, AuthError } from '../errors/vizzly-error.js';
 import crypto from 'crypto';
 import { getPackageVersion } from '../utils/package-info.js';
 import { getApiUrl, getApiToken, getUserAgent } from '../utils/environment-config.js';
+import { getAuthTokens, saveAuthTokens } from '../utils/global-config.js';
 
 /**
  * ApiService class for direct API communication
  */
 export class ApiService {
   constructor(options = {}) {
-    this.baseUrl = options.baseUrl || getApiUrl();
-    this.token = options.token || getApiToken();
+    // Accept config as-is, no fallbacks to environment
+    // Config-loader handles all env/file resolution
+    this.baseUrl = options.apiUrl || options.baseUrl || getApiUrl();
+    this.token = options.apiKey || options.token || getApiToken(); // Accept both apiKey and token
     this.uploadAll = options.uploadAll || false;
 
     // Build User-Agent string
-    const command = options.command || 'run'; // Default to 'run' for API service
+    const command = options.command || 'run';
     const baseUserAgent = `vizzly-cli/${getPackageVersion()} (${command})`;
     const sdkUserAgent = options.userAgent || getUserAgent();
     this.userAgent = sdkUserAgent ? `${baseUserAgent} ${sdkUserAgent}` : baseUserAgent;
     if (!this.token && !options.allowNoToken) {
-      throw new VizzlyError('No API token provided. Set VIZZLY_TOKEN environment variable.');
+      throw new VizzlyError('No API token provided. Set VIZZLY_TOKEN environment variable or run "vizzly login".');
     }
   }
 
@@ -32,9 +35,10 @@ export class ApiService {
    * Make an API request
    * @param {string} endpoint - API endpoint
    * @param {Object} options - Fetch options
+   * @param {boolean} isRetry - Internal flag to prevent infinite retry loops
    * @returns {Promise<Object>} Response data
    */
-  async request(endpoint, options = {}) {
+  async request(endpoint, options = {}, isRetry = false) {
     const url = `${this.baseUrl}${endpoint}`;
     const headers = {
       'User-Agent': this.userAgent,
@@ -59,9 +63,48 @@ export class ApiService {
         // ignore
       }
 
-      // Handle authentication errors with user-friendly messages
+      // Handle authentication errors with automatic token refresh
+      if (response.status === 401 && !isRetry) {
+        // Attempt to refresh token if we have refresh token in global config
+        let auth = await getAuthTokens();
+        if (auth && auth.refreshToken) {
+          try {
+            // Attempt token refresh
+            let refreshResponse = await fetch(`${this.baseUrl}/api/auth/cli/refresh`, {
+              method: 'POST',
+              headers: {
+                'Content-Type': 'application/json',
+                'User-Agent': this.userAgent
+              },
+              body: JSON.stringify({
+                refreshToken: auth.refreshToken
+              })
+            });
+            if (refreshResponse.ok) {
+              let refreshData = await refreshResponse.json();
+
+              // Save new tokens to global config
+              await saveAuthTokens({
+                accessToken: refreshData.accessToken,
+                refreshToken: refreshData.refreshToken,
+                expiresAt: refreshData.expiresAt,
+                user: auth.user // Keep existing user data
+              });
+
+              // Update token for this service instance
+              this.token = refreshData.accessToken;
+
+              // Retry the original request with new token
+              return this.request(endpoint, options, true);
+            }
+          } catch {
+            // Token refresh failed, fall through to auth error
+          }
+        }
+        throw new AuthError('Invalid or expired API token. Please run "vizzly login" to authenticate.');
+      }
       if (response.status === 401) {
-        throw new AuthError('Invalid or expired API token. Please check your VIZZLY_TOKEN environment variable and ensure it is valid.');
+        throw new AuthError('Invalid or expired API token. Please run "vizzly login" to authenticate.');
       }
       throw new VizzlyError(`API request failed: ${response.status}${errorText ? ` - ${errorText}` : ''} (URL: ${url})`);
     }

package/dist/services/auth-service.js

@@ -0,0 +1,226 @@
+/**
+ * Authentication Service for Vizzly CLI
+ * Handles authentication flows with the Vizzly API
+ */
+
+import { AuthError, VizzlyError } from '../errors/vizzly-error.js';
+import { getApiUrl } from '../utils/environment-config.js';
+import { getPackageVersion } from '../utils/package-info.js';
+import { saveAuthTokens, clearAuthTokens, getAuthTokens } from '../utils/global-config.js';
+
+/**
+ * AuthService class for CLI authentication
+ */
+export class AuthService {
+  constructor(options = {}) {
+    this.baseUrl = options.baseUrl || getApiUrl();
+    this.userAgent = `vizzly-cli/${getPackageVersion()} (auth)`;
+  }
+
+  /**
+   * Make an unauthenticated API request
+   * @param {string} endpoint - API endpoint
+   * @param {Object} options - Fetch options
+   * @returns {Promise<Object>} Response data
+   */
+  async request(endpoint, options = {}) {
+    let url = `${this.baseUrl}${endpoint}`;
+    let headers = {
+      'User-Agent': this.userAgent,
+      ...options.headers
+    };
+    let response = await fetch(url, {
+      ...options,
+      headers
+    });
+    if (!response.ok) {
+      let errorText = '';
+      let errorData = null;
+      try {
+        let contentType = response.headers.get('content-type');
+        if (contentType && contentType.includes('application/json')) {
+          errorData = await response.json();
+          errorText = errorData.error || errorData.message || '';
+        } else {
+          errorText = await response.text();
+        }
+      } catch {
+        errorText = response.statusText || '';
+      }
+      if (response.status === 401) {
+        throw new AuthError(errorText || 'Invalid credentials. Please check your email/username and password.');
+      }
+      if (response.status === 429) {
+        throw new VizzlyError('Too many login attempts. Please try again later.', 'RATE_LIMIT_ERROR');
+      }
+      throw new VizzlyError(`Authentication request failed: ${response.status}${errorText ? ` - ${errorText}` : ''}`, 'AUTH_REQUEST_ERROR');
+    }
+    return response.json();
+  }
+
+  /**
+   * Make an authenticated API request
+   * @param {string} endpoint - API endpoint
+   * @param {Object} options - Fetch options
+   * @returns {Promise<Object>} Response data
+   */
+  async authenticatedRequest(endpoint, options = {}) {
+    let auth = await getAuthTokens();
+    if (!auth || !auth.accessToken) {
+      throw new AuthError('No authentication token found. Please run "vizzly login" first.');
+    }
+    let url = `${this.baseUrl}${endpoint}`;
+    let headers = {
+      'User-Agent': this.userAgent,
+      Authorization: `Bearer ${auth.accessToken}`,
+      ...options.headers
+    };
+    let response = await fetch(url, {
+      ...options,
+      headers
+    });
+    if (!response.ok) {
+      let errorText = '';
+      try {
+        let contentType = response.headers.get('content-type');
+        if (contentType && contentType.includes('application/json')) {
+          let errorData = await response.json();
+          errorText = errorData.error || errorData.message || '';
+        } else {
+          errorText = await response.text();
+        }
+      } catch {
+        errorText = response.statusText || '';
+      }
+      if (response.status === 401) {
+        throw new AuthError('Authentication token is invalid or expired. Please run "vizzly login" again.');
+      }
+      throw new VizzlyError(`API request failed: ${response.status}${errorText ? ` - ${errorText}` : ''}`, 'API_REQUEST_ERROR');
+    }
+    return response.json();
+  }
+
+  /**
+   * Initiate OAuth device flow
+   * @returns {Promise<Object>} Device code, user code, verification URL
+   */
+  async initiateDeviceFlow() {
+    return this.request('/api/auth/cli/device/initiate', {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json'
+      }
+    });
+  }
+
+  /**
+   * Poll for device authorization
+   * @param {string} deviceCode - Device code from initiate
+   * @returns {Promise<Object>} Token data or pending status
+   */
+  async pollDeviceAuthorization(deviceCode) {
+    return this.request('/api/auth/cli/device/poll', {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json'
+      },
+      body: JSON.stringify({
+        device_code: deviceCode
+      })
+    });
+  }
+
+  /**
+   * Complete device flow and save tokens
+   * @param {Object} tokenData - Token response from poll
+   * @returns {Promise<Object>} Token data with user info
+   */
+  async completeDeviceFlow(tokenData) {
+    // Save tokens to global config
+    await saveAuthTokens({
+      accessToken: tokenData.accessToken,
+      refreshToken: tokenData.refreshToken,
+      expiresAt: tokenData.expiresAt,
+      user: tokenData.user
+    });
+    return tokenData;
+  }
+
+  /**
+   * Refresh access token using refresh token
+   * @returns {Promise<Object>} New tokens
+   */
+  async refresh() {
+    let auth = await getAuthTokens();
+    if (!auth || !auth.refreshToken) {
+      throw new AuthError('No refresh token found. Please run "vizzly login" first.');
+    }
+    let response = await this.request('/api/auth/cli/refresh', {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json'
+      },
+      body: JSON.stringify({
+        refreshToken: auth.refreshToken
+      })
+    });
+
+    // Update tokens in global config
+    await saveAuthTokens({
+      accessToken: response.accessToken,
+      refreshToken: response.refreshToken,
+      expiresAt: response.expiresAt,
+      user: auth.user // Keep existing user data
+    });
+    return response;
+  }
+
+  /**
+   * Logout and revoke tokens
+   * @returns {Promise<void>}
+   */
+  async logout() {
+    let auth = await getAuthTokens();
+    if (auth && auth.refreshToken) {
+      try {
+        // Attempt to revoke tokens on server
+        await this.request('/api/auth/cli/logout', {
+          method: 'POST',
+          headers: {
+            'Content-Type': 'application/json'
+          },
+          body: JSON.stringify({
+            refreshToken: auth.refreshToken
+          })
+        });
+      } catch (error) {
+        // If server request fails, still clear local tokens
+        console.warn('Warning: Failed to revoke tokens on server:', error.message);
+      }
+    }
+
+    // Clear tokens from global config
+    await clearAuthTokens();
+  }
+
+  /**
+   * Get current user information
+   * @returns {Promise<Object>} User and organization data
+   */
+  async whoami() {
+    return this.authenticatedRequest('/api/auth/cli/whoami');
+  }
+
+  /**
+   * Check if user is authenticated
+   * @returns {Promise<boolean>} True if authenticated
+   */
+  async isAuthenticated() {
+    try {
+      await this.whoami();
+      return true;
+    } catch {
+      return false;
+    }
+  }
+}

package/dist/types/client/index.d.ts

@@ -2,7 +2,7 @@
  * Take a screenshot for visual regression testing
  *
  * @param {string} name - Unique name for the screenshot
- * @param {Buffer} imageBuffer - PNG image data as a Buffer
+ * @param {Buffer|string} imageBuffer - PNG image data as a Buffer, or a file path to an image
  * @param {Object} [options] - Optional configuration
  * @param {Record<string, any>} [options.properties] - Additional properties to attach to the screenshot
  * @param {number} [options.threshold=0] - Pixel difference threshold (0-100)
@@ -11,13 +11,17 @@
  * @returns {Promise<void>}
  *
  * @example
- * // Basic usage
+ * // Basic usage with Buffer
  * import { vizzlyScreenshot } from '@vizzly-testing/cli/client';
  *
  * const screenshot = await page.screenshot();
  * await vizzlyScreenshot('homepage', screenshot);
  *
  * @example
+ * // Basic usage with file path
+ * await vizzlyScreenshot('homepage', './screenshots/homepage.png');
+ *
+ * @example
  * // With properties and threshold
  * await vizzlyScreenshot('checkout-form', screenshot, {
  *   properties: {
@@ -28,8 +32,10 @@
  * });
  *
  * @throws {VizzlyError} When screenshot capture fails or client is not initialized
+ * @throws {VizzlyError} When file path is provided but file doesn't exist
+ * @throws {VizzlyError} When file cannot be read due to permissions or I/O errors
  */
-export function vizzlyScreenshot(name: string, imageBuffer: Buffer, options?: {
+export function vizzlyScreenshot(name: string, imageBuffer: Buffer | string, options?: {
     properties?: Record<string, any>;
     threshold?: number;
     fullPage?: boolean;

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

@@ -0,0 +1,11 @@
+/**
+ * Login command implementation using OAuth device flow
+ * @param {Object} options - Command options
+ * @param {Object} globalOptions - Global CLI options
+ */
+export function loginCommand(options?: any, globalOptions?: any): Promise<void>;
+/**
+ * Validate login options
+ * @param {Object} options - Command options
+ */
+export function validateLoginOptions(): any[];

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

@@ -0,0 +1,11 @@
+/**
+ * Logout command implementation
+ * @param {Object} options - Command options
+ * @param {Object} globalOptions - Global CLI options
+ */
+export function logoutCommand(options?: any, globalOptions?: any): Promise<void>;
+/**
+ * Validate logout options
+ * @param {Object} options - Command options
+ */
+export function validateLogoutOptions(): any[];

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

@@ -0,0 +1,28 @@
+/**
+ * Project select command - configure project for current directory
+ * @param {Object} options - Command options
+ * @param {Object} globalOptions - Global CLI options
+ */
+export function projectSelectCommand(options?: any, globalOptions?: any): Promise<void>;
+/**
+ * Project list command - show all configured projects
+ * @param {Object} _options - Command options (unused)
+ * @param {Object} globalOptions - Global CLI options
+ */
+export function projectListCommand(_options?: any, globalOptions?: any): Promise<void>;
+/**
+ * Project token command - show/regenerate token for current directory
+ * @param {Object} _options - Command options (unused)
+ * @param {Object} globalOptions - Global CLI options
+ */
+export function projectTokenCommand(_options?: any, globalOptions?: any): Promise<void>;
+/**
+ * Project remove command - remove project configuration for current directory
+ * @param {Object} _options - Command options (unused)
+ * @param {Object} globalOptions - Global CLI options
+ */
+export function projectRemoveCommand(_options?: any, globalOptions?: any): Promise<void>;
+/**
+ * Validate project command options
+ */
+export function validateProjectOptions(): any[];

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

@@ -0,0 +1,11 @@
+/**
+ * Whoami command implementation
+ * @param {Object} options - Command options
+ * @param {Object} globalOptions - Global CLI options
+ */
+export function whoamiCommand(options?: any, globalOptions?: any): Promise<void>;
+/**
+ * Validate whoami options
+ * @param {Object} options - Command options
+ */
+export function validateWhoamiOptions(): any[];

package/dist/types/sdk/index.d.ts

@@ -81,11 +81,14 @@ export class VizzlySDK {
     /**
      * Capture a screenshot
      * @param {string} name - Screenshot name
-     * @param {Buffer} imageBuffer - Image data
+     * @param {Buffer|string} imageBuffer - Image data as a Buffer, or a file path to an image
      * @param {import('../types').ScreenshotOptions} [options] - Options
      * @returns {Promise<void>}
+     * @throws {VizzlyError} When server is not running
+     * @throws {VizzlyError} When file path is provided but file doesn't exist
+     * @throws {VizzlyError} When file cannot be read due to permissions or I/O errors
      */
-    screenshot(name: string, imageBuffer: Buffer, options?: any): Promise<void>;
+    screenshot(name: string, imageBuffer: Buffer | string, options?: any): Promise<void>;
     /**
      * Upload all captured screenshots
      * @param {import('../types').UploadOptions} [options] - Upload options
@@ -95,10 +98,12 @@ export class VizzlySDK {
     /**
      * Run local comparison in TDD mode
      * @param {string} name - Screenshot name
-     * @param {Buffer} imageBuffer - Current image
+     * @param {Buffer|string} imageBuffer - Current image as a Buffer, or a file path to an image
      * @returns {Promise<import('../types').ComparisonResult>} Comparison result
+     * @throws {VizzlyError} When file path is provided but file doesn't exist
+     * @throws {VizzlyError} When file cannot be read due to permissions or I/O errors
      */
-    compare(name: string, imageBuffer: Buffer): Promise<any>;
+    compare(name: string, imageBuffer: Buffer | string): Promise<any>;
 }
 export { loadConfig } from "../utils/config-loader.js";
 export { createLogger } from "../utils/logger.js";

package/dist/types/services/api-service.d.ts

@@ -11,9 +11,10 @@ export class ApiService {
      * Make an API request
      * @param {string} endpoint - API endpoint
      * @param {Object} options - Fetch options
+     * @param {boolean} isRetry - Internal flag to prevent infinite retry loops
      * @returns {Promise<Object>} Response data
      */
-    request(endpoint: string, options?: any): Promise<any>;
+    request(endpoint: string, options?: any, isRetry?: boolean): Promise<any>;
     /**
      * Get build information
      * @param {string} buildId - Build ID

package/dist/types/services/auth-service.d.ts

@@ -0,0 +1,59 @@
+/**
+ * AuthService class for CLI authentication
+ */
+export class AuthService {
+    constructor(options?: {});
+    baseUrl: any;
+    userAgent: string;
+    /**
+     * Make an unauthenticated API request
+     * @param {string} endpoint - API endpoint
+     * @param {Object} options - Fetch options
+     * @returns {Promise<Object>} Response data
+     */
+    request(endpoint: string, options?: any): Promise<any>;
+    /**
+     * Make an authenticated API request
+     * @param {string} endpoint - API endpoint
+     * @param {Object} options - Fetch options
+     * @returns {Promise<Object>} Response data
+     */
+    authenticatedRequest(endpoint: string, options?: any): Promise<any>;
+    /**
+     * Initiate OAuth device flow
+     * @returns {Promise<Object>} Device code, user code, verification URL
+     */
+    initiateDeviceFlow(): Promise<any>;
+    /**
+     * Poll for device authorization
+     * @param {string} deviceCode - Device code from initiate
+     * @returns {Promise<Object>} Token data or pending status
+     */
+    pollDeviceAuthorization(deviceCode: string): Promise<any>;
+    /**
+     * Complete device flow and save tokens
+     * @param {Object} tokenData - Token response from poll
+     * @returns {Promise<Object>} Token data with user info
+     */
+    completeDeviceFlow(tokenData: any): Promise<any>;
+    /**
+     * Refresh access token using refresh token
+     * @returns {Promise<Object>} New tokens
+     */
+    refresh(): Promise<any>;
+    /**
+     * Logout and revoke tokens
+     * @returns {Promise<void>}
+     */
+    logout(): Promise<void>;
+    /**
+     * Get current user information
+     * @returns {Promise<Object>} User and organization data
+     */
+    whoami(): Promise<any>;
+    /**
+     * Check if user is authenticated
+     * @returns {Promise<boolean>} True if authenticated
+     */
+    isAuthenticated(): Promise<boolean>;
+}

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

@@ -0,0 +1,6 @@
+/**
+ * Open a URL in the default browser
+ * @param {string} url - URL to open
+ * @returns {Promise<boolean>} True if successful
+ */
+export function openBrowser(url: string): Promise<boolean>;

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

@@ -19,7 +19,7 @@ export function loadConfig(configPath?: any, cliOverrides?: {}): Promise<{
         openReport: boolean;
     };
     plugins: any[];
-    apiKey: string;
+    apiKey: any;
     apiUrl: string;
 }>;
 export function getScreenshotPaths(config: any): any[];