@vizzly-testing/cli 0.13.4 → 0.15.0

package/dist/commands/init.js

@@ -2,7 +2,7 @@
 import fs from 'fs/promises';
 import path from 'path';
 import { VizzlyError } from '../errors/vizzly-error.js';
-import { createComponentLogger } from '../utils/logger-factory.js';
+import * as output from '../utils/output.js';
 import { loadPlugins } from '../plugin-loader.js';
 import { loadConfig } from '../utils/config-loader.js';
 import { z } from 'zod';
@@ -11,20 +11,18 @@ import { z } from 'zod';
  * Simple configuration setup for Vizzly CLI
  */
 export class InitCommand {
-  constructor(logger, plugins = []) {
-    this.logger = logger || createComponentLogger('INIT', {
-      level: 'info'
-    });
+  constructor(plugins = []) {
     this.plugins = plugins;
   }
   async run(options = {}) {
-    this.logger.info('🎯 Initializing Vizzly configuration...\n');
+    output.info('🎯 Initializing Vizzly configuration...');
+    output.blank();
     try {
       // Check for existing config
-      const configPath = path.join(process.cwd(), 'vizzly.config.js');
-      const hasConfig = await this.fileExists(configPath);
+      let configPath = path.join(process.cwd(), 'vizzly.config.js');
+      let hasConfig = await this.fileExists(configPath);
       if (hasConfig && !options.force) {
-        this.logger.info('❌ A vizzly.config.js file already exists. Use --force to overwrite.');
+        output.info('❌ A vizzly.config.js file already exists. Use --force to overwrite.');
         return;
       }
 
@@ -33,7 +31,8 @@ export class InitCommand {
 
       // Show next steps
       this.showNextSteps();
-      this.logger.info('\n✅ Vizzly CLI setup complete!');
+      output.blank();
+      output.success('Vizzly CLI setup complete!');
     } catch (error) {
       throw new VizzlyError('Failed to initialize Vizzly configuration', 'INIT_FAILED', {
         error: error.message
@@ -78,14 +77,14 @@ export class InitCommand {
     }
     coreConfig += '\n};\n';
     await fs.writeFile(configPath, coreConfig, 'utf8');
-    this.logger.info(`📄 Created vizzly.config.js`);
+    output.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):`);
+      output.info(`   Added config for ${pluginsWithConfig.length} plugin(s):`);
       pluginsWithConfig.forEach(p => {
-        this.logger.info(`   - ${p.name}`);
+        output.info(`   - ${p.name}`);
       });
     }
   }
@@ -127,9 +126,9 @@ export class InitCommand {
     } 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(', ')}`);
+        output.warn(`Invalid config schema for plugin ${plugin.name}: ${messages.join(', ')}`);
       } else {
-        this.logger.warn(`Failed to format config for plugin ${plugin.name}: ${error.message}`);
+        output.warn(`Failed to format config for plugin ${plugin.name}: ${error.message}`);
       }
       return '';
     }
@@ -168,13 +167,14 @@ export class InitCommand {
     return String(value);
   }
   showNextSteps() {
-    this.logger.info('\n📚 Next steps:');
-    this.logger.info('   1. Set your API token:');
-    this.logger.info('      export VIZZLY_TOKEN="your-api-key"');
-    this.logger.info('   2. Run your tests with Vizzly:');
-    this.logger.info('      npx vizzly run "npm test"');
-    this.logger.info('   3. Upload screenshots:');
-    this.logger.info('      npx vizzly upload ./screenshots');
+    output.blank();
+    output.info('📚 Next steps:');
+    output.info('   1. Set your API token:');
+    output.info('      export VIZZLY_TOKEN="your-api-key"');
+    output.info('   2. Run your tests with Vizzly:');
+    output.info('      npx vizzly run "npm test"');
+    output.info('   3. Upload screenshots:');
+    output.info('      npx vizzly upload ./screenshots');
   }
   async fileExists(filePath) {
     try {
@@ -188,28 +188,30 @@ export class InitCommand {
 
 // Export factory function for CLI
 export function createInitCommand(options) {
-  const command = new InitCommand(options.logger, options.plugins);
+  let command = new InitCommand(options.plugins);
   return () => command.run(options);
 }
 
 // Simple export for direct CLI usage
 export async function init(options = {}) {
+  output.configure({
+    json: options.json || false,
+    verbose: options.verbose || false,
+    color: options.color !== false
+  });
   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);
+      plugins = await loadPlugins(options.config, config, null);
     } catch {
       // Silent fail - plugins are optional for init
     }
   } else {
     plugins = options.plugins;
   }
-  const command = new InitCommand(null, plugins);
+  let command = new InitCommand(plugins);
   return await command.run(options);
 }

package/dist/commands/login.js

@@ -3,7 +3,7 @@
  * Authenticates user via OAuth device flow
  */
 
-import { ConsoleUI } from '../utils/console-ui.js';
+import * as output from '../utils/output.js';
 import { AuthService } from '../services/auth-service.js';
 import { getApiUrl } from '../utils/environment-config.js';
 import { openBrowser } from '../utils/browser.js';
@@ -14,15 +14,15 @@ import { openBrowser } from '../utils/browser.js';
  * @param {Object} globalOptions - Global CLI options
  */
 export async function loginCommand(options = {}, globalOptions = {}) {
-  // Create UI handler
-  let ui = new ConsoleUI({
+  output.configure({
     json: globalOptions.json,
     verbose: globalOptions.verbose,
     color: !globalOptions.noColor
   });
+  let colors = output.getColors();
   try {
-    ui.info('Starting Vizzly authentication...');
-    console.log(''); // Empty line for spacing
+    output.info('Starting Vizzly authentication...');
+    output.blank();
 
     // Create auth service
     let authService = new AuthService({
@@ -30,9 +30,9 @@ export async function loginCommand(options = {}, globalOptions = {}) {
     });
 
     // Initiate device flow
-    ui.startSpinner('Connecting to Vizzly...');
+    output.startSpinner('Connecting to Vizzly...');
     let deviceFlow = await authService.initiateDeviceFlow();
-    ui.stopSpinner();
+    output.stopSpinner();
 
     // Handle both snake_case and camelCase field names
     let verificationUri = deviceFlow.verification_uri || deviceFlow.verificationUri;
@@ -46,29 +46,29 @@ export async function loginCommand(options = {}, globalOptions = {}) {
     let urlWithCode = `${verificationUri}?code=${userCode}`;
 
     // Display user code prominently
-    console.log(''); // Empty line for spacing
-    console.log('='.repeat(50));
-    console.log('');
-    console.log('  Please visit the following URL to authorize this device:');
-    console.log('');
-    console.log(`  ${urlWithCode}`);
-    console.log('');
-    console.log('  Your code (pre-filled):');
-    console.log('');
-    console.log(`  ${ui.colors.bold(ui.colors.cyan(userCode))}`);
-    console.log('');
-    console.log('='.repeat(50));
-    console.log(''); // Empty line for spacing
+    output.blank();
+    output.print('='.repeat(50));
+    output.blank();
+    output.print('  Please visit the following URL to authorize this device:');
+    output.blank();
+    output.print(`  ${urlWithCode}`);
+    output.blank();
+    output.print('  Your code (pre-filled):');
+    output.blank();
+    output.print(`  ${colors.bold(colors.cyan(userCode))}`);
+    output.blank();
+    output.print('='.repeat(50));
+    output.blank();
 
     // Try to open browser with pre-filled code
     let browserOpened = await openBrowser(urlWithCode);
     if (browserOpened) {
-      ui.info('Opening browser...');
+      output.info('Opening browser...');
     } else {
-      ui.warning('Could not open browser automatically. Please open the URL manually.');
+      output.warn('Could not open browser automatically. Please open the URL manually.');
     }
-    console.log(''); // Empty line for spacing
-    ui.info('After authorizing in your browser, press Enter to continue...');
+    output.blank();
+    output.info('After authorizing in your browser, press Enter to continue...');
 
     // Wait for user to press Enter
     await new Promise(resolve => {
@@ -82,9 +82,9 @@ export async function loginCommand(options = {}, globalOptions = {}) {
     });
 
     // Check authorization status
-    ui.startSpinner('Checking authorization status...');
+    output.startSpinner('Checking authorization status...');
     let pollResponse = await authService.pollDeviceAuthorization(deviceCode);
-    ui.stopSpinner();
+    output.stopSpinner();
     let tokenData = null;
 
     // Check if authorization was successful by looking for tokens
@@ -116,66 +116,60 @@ export async function loginCommand(options = {}, globalOptions = {}) {
     await authService.completeDeviceFlow(tokens);
 
     // Display success message
-    ui.success('Successfully authenticated!');
-    console.log(''); // Empty line for spacing
+    output.success('Successfully authenticated!');
+    output.blank();
 
     // Show user info
     if (tokens.user) {
-      ui.info(`User: ${tokens.user.name || tokens.user.username}`);
-      ui.info(`Email: ${tokens.user.email}`);
+      output.info(`User: ${tokens.user.name || tokens.user.username}`);
+      output.info(`Email: ${tokens.user.email}`);
     }
 
     // Show organization info
     if (tokens.organizations && tokens.organizations.length > 0) {
-      console.log(''); // Empty line for spacing
-      ui.info('Organizations:');
+      output.blank();
+      output.info('Organizations:');
       for (let org of tokens.organizations) {
-        console.log(`  - ${org.name}${org.slug ? ` (@${org.slug})` : ''}`);
+        output.print(`  - ${org.name}${org.slug ? ` (@${org.slug})` : ''}`);
       }
     }
 
     // Show token expiry info
     if (tokens.expiresAt) {
-      console.log(''); // Empty line for spacing
+      output.blank();
       let expiresAt = new Date(tokens.expiresAt);
       let msUntilExpiry = expiresAt.getTime() - Date.now();
       let daysUntilExpiry = Math.floor(msUntilExpiry / (1000 * 60 * 60 * 24));
       let hoursUntilExpiry = Math.floor(msUntilExpiry / (1000 * 60 * 60));
       let minutesUntilExpiry = Math.floor(msUntilExpiry / (1000 * 60));
       if (daysUntilExpiry > 0) {
-        ui.info(`Token expires in ${daysUntilExpiry} day${daysUntilExpiry !== 1 ? 's' : ''} (${expiresAt.toLocaleDateString()})`);
+        output.info(`Token expires in ${daysUntilExpiry} day${daysUntilExpiry !== 1 ? 's' : ''} (${expiresAt.toLocaleDateString()})`);
       } else if (hoursUntilExpiry > 0) {
-        ui.info(`Token expires in ${hoursUntilExpiry} hour${hoursUntilExpiry !== 1 ? 's' : ''}`);
+        output.info(`Token expires in ${hoursUntilExpiry} hour${hoursUntilExpiry !== 1 ? 's' : ''}`);
       } else if (minutesUntilExpiry > 0) {
-        ui.info(`Token expires in ${minutesUntilExpiry} minute${minutesUntilExpiry !== 1 ? 's' : ''}`);
+        output.info(`Token expires in ${minutesUntilExpiry} minute${minutesUntilExpiry !== 1 ? 's' : ''}`);
       }
     }
-    console.log(''); // Empty line for spacing
-    ui.info('You can now use Vizzly CLI commands without setting VIZZLY_TOKEN');
-    ui.cleanup();
+    output.blank();
+    output.info('You can now use Vizzly CLI commands without setting VIZZLY_TOKEN');
+    output.cleanup();
   } catch (error) {
-    ui.stopSpinner();
+    output.stopSpinner();
 
     // Handle authentication errors with helpful messages
     if (error.name === 'AuthError') {
-      ui.error('Authentication failed', error, 0);
-      console.log(''); // Empty line for spacing
-      console.log('Please try logging in again.');
-      console.log("If you don't have an account, sign up at https://vizzly.dev");
+      output.error('Authentication failed', error);
+      output.blank();
+      output.print('Please try logging in again.');
+      output.print("If you don't have an account, sign up at https://vizzly.dev");
       process.exit(1);
     } else if (error.code === 'RATE_LIMIT_ERROR') {
-      ui.error('Too many login attempts', error, 0);
-      console.log(''); // Empty line for spacing
-      console.log('Please wait a few minutes before trying again.');
+      output.error('Too many login attempts', error);
+      output.blank();
+      output.print('Please wait a few minutes before trying again.');
       process.exit(1);
     } else {
-      ui.error('Login failed', error, 0);
-      console.log(''); // Empty line for spacing
-      console.log('Error details:', error.message);
-      if (globalOptions.verbose && error.stack) {
-        console.error(''); // Empty line for spacing
-        console.error(error.stack);
-      }
+      output.error('Login failed', error);
       process.exit(1);
     }
   }

package/dist/commands/logout.js

@@ -3,7 +3,7 @@
  * Clears stored authentication tokens
  */
 
-import { ConsoleUI } from '../utils/console-ui.js';
+import * as output from '../utils/output.js';
 import { AuthService } from '../services/auth-service.js';
 import { getApiUrl } from '../utils/environment-config.js';
 import { getAuthTokens } from '../utils/global-config.js';
@@ -14,8 +14,7 @@ import { getAuthTokens } from '../utils/global-config.js';
  * @param {Object} globalOptions - Global CLI options
  */
 export async function logoutCommand(options = {}, globalOptions = {}) {
-  // Create UI handler
-  let ui = new ConsoleUI({
+  output.configure({
     json: globalOptions.json,
     verbose: globalOptions.verbose,
     color: !globalOptions.noColor
@@ -24,36 +23,32 @@ export async function logoutCommand(options = {}, globalOptions = {}) {
     // Check if user is logged in
     let auth = await getAuthTokens();
     if (!auth || !auth.accessToken) {
-      ui.info('You are not logged in');
-      ui.cleanup();
+      output.info('You are not logged in');
+      output.cleanup();
       return;
     }
 
     // Logout
-    ui.startSpinner('Logging out...');
+    output.startSpinner('Logging out...');
     let authService = new AuthService({
       baseUrl: options.apiUrl || getApiUrl()
     });
     await authService.logout();
-    ui.stopSpinner();
-    ui.success('Successfully logged out');
+    output.stopSpinner();
+    output.success('Successfully logged out');
     if (globalOptions.json) {
-      ui.data({
+      output.data({
         loggedOut: true
       });
     } else {
-      console.log(''); // Empty line for spacing
-      ui.info('Your authentication tokens have been cleared');
-      ui.info('Run "vizzly login" to authenticate again');
+      output.blank();
+      output.info('Your authentication tokens have been cleared');
+      output.info('Run "vizzly login" to authenticate again');
     }
-    ui.cleanup();
+    output.cleanup();
   } catch (error) {
-    ui.stopSpinner();
-    ui.error('Logout failed', error, 0);
-    if (globalOptions.verbose && error.stack) {
-      console.error(''); // Empty line for spacing
-      console.error(error.stack);
-    }
+    output.stopSpinner();
+    output.error('Logout failed', error);
     process.exit(1);
   }
 }