Watch Mode

/**
 * File watcher for continuous test execution during development
 */
class Watcher {
  /**
   * Initialize watcher with configuration
   * @param configFile - Path to WebdriverIO configuration file
   * @param args - Command arguments excluding configPath
   */
  constructor(
    configFile: string,
    args: Omit<RunCommandArguments, 'configPath'>
  );

  /**
   * Start watching files for changes and execute tests automatically
   * Watches spec files and configuration files, automatically re-running tests on changes
   * @returns Promise that resolves when all test workers finish
   */
  watch(): Promise<void>;
}

# Enable watch mode
wdio run wdio.conf.js --watch

# Watch mode with specific specs
wdio run wdio.conf.js --watch --spec ./test/specs/unit/**/*.js

# Watch mode with suite filtering
wdio run wdio.conf.js --watch --suite unit

# Watch mode with custom log level
wdio run wdio.conf.js --watch --logLevel debug

import { Watcher } from "@wdio/cli";

// Start basic watch mode
const watcher = new Watcher("./wdio.conf.js", {
  logLevel: "info"
});

await watcher.watch();

import { Watcher } from "@wdio/cli";

// Watch mode with custom options
const watcher = new Watcher("./wdio.conf.js", {
  spec: ["./test/specs/**/*.js"],
  logLevel: "debug",
  bail: 1,
  baseUrl: "http://localhost:3000"
});

// File watching is configured in wdio.conf.js via filesToWatch option
await watcher.watch();

import { Watcher } from "@wdio/cli";

class DevServer {
  private watcher: Watcher;

  async startDevelopment() {
    // Start development server
    await this.startServer();

    // Initialize test watcher
    this.watcher = new Watcher("./wdio.conf.js", {
      baseUrl: "http://localhost:3000",
      logLevel: "info",
      spec: ["./test/specs/integration/**/*.js"]
    });

    console.log("Starting watch mode...");
    await this.watcher.watch();
  }

  async stopDevelopment() {
    // Note: Watcher doesn't provide stop method, use process signals instead
    await this.stopServer();
  }

  private async startServer() {
    // Start your development server
  }

  private async stopServer() {
    // Stop your development server
  }
}

// Configuration changes trigger full test suite reload
// wdio.conf.js, wdio.*.conf.js

// Test file changes trigger affected spec execution
// ./test/specs/**/*.js, ./test/**/*.spec.js

// Source file changes trigger related test execution
// ./src/**/*.js (runs tests that import changed files)

// Package.json changes trigger dependency reload
// package.json, package-lock.json, yarn.lock

// wdio.conf.js
export const config = {
  // ... other config options
  
  // Files to watch for changes (in addition to spec files)
  filesToWatch: [
    // JavaScript/TypeScript files
    "./src/**/*.{js,ts,jsx,tsx}",
    
    // Configuration files
    "./*.conf.{js,ts,json}",
    
    // Static assets that affect tests
    "./public/**/*.{html,css,json}",
    
    // Environment files
    "./.env*"
  ]
};

# Watch mode runs automatically on file changes
# Use Ctrl+C to quit watch mode
# Manual test triggering is handled through configuration changes

import { Watcher } from "@wdio/cli";

const watcher = new Watcher("./wdio.conf.js", {
  logLevel: "info"
});

// Handle process termination
process.on('SIGINT', () => {
  console.log('Stopping watch mode...');
  process.exit(0);
});

process.on('SIGTERM', () => {
  console.log('Stopping watch mode...');
  process.exit(0);
});

await watcher.watch();

import { Watcher } from "@wdio/cli";

// Watch mode with performance optimizations
const watcher = new Watcher("./wdio.conf.js", {
  // Only run specific suites to reduce execution time
  suite: ["unit", "integration"],
  
  // Use bail to stop on first failure
  bail: 1,
  
  // Reduce parallel instances for faster startup
  maxInstances: 2,
  
  // Minimize logging for better performance
  logLevel: "warn"
});

// Watch mode automatically implements debouncing
// Multiple rapid file changes are batched into single test run
// Default debounce delay: 300ms

// Watcher automatically implements debouncing internally
// Multiple rapid file changes are batched into single test run
// Default debounce delay: approximately 300ms

// VSCode task configuration (.vscode/tasks.json)
{
  "version": "2.0.0",
  "tasks": [
    {
      "label": "WebdriverIO Watch",
      "type": "shell",
      "command": "npx wdio run wdio.conf.js --watch",
      "group": "test",
      "presentation": {
        "echo": true,
        "reveal": "always",
        "focus": false,
        "panel": "shared"
      },
      "problemMatcher": [],
      "runOptions": {
        "runOn": "folderOpen"
      }
    }
  ]
}

// Docker development setup with watch mode
import { Watcher } from "@wdio/cli";

class DockerDevEnvironment {
  private watcher: Watcher;

  async startContainer() {
    // Start Docker container with volume mounts
    // docker run -v $(pwd):/app -p 4444:4444 selenium/standalone-chrome
    
    this.watcher = new Watcher("./wdio.docker.conf.js", {
      hostname: "localhost",
      port: 4444,
      baseUrl: "http://host.docker.internal:3000"
    });

    await this.watcher.watch();
  }
}

// Conditional watch mode for different environments
const isCI = process.env.CI === 'true';
const isDevelopment = process.env.NODE_ENV === 'development';

if (isDevelopment && !isCI) {
  // Enable watch mode in development
  const watcher = new Watcher("./wdio.conf.js", {
    logLevel: "debug"
  });
  
  await watcher.watch();
} else {
  // Regular test execution in CI
  const launcher = new Launcher("./wdio.conf.js", {
    logLevel: "warn",
    bail: 1
  });
  
  const exitCode = await launcher.run();
  process.exit(exitCode);
}

// Issue: Watch mode not detecting file changes
// Solution: Configure filesToWatch in wdio.conf.js

// wdio.conf.js
export const config = {
  // Ensure spec files are correctly configured
  specs: ['./test/**/*.js'],
  
  // Add additional files to watch
  filesToWatch: [
    "./src/**/*.js",     // Watch source files
    "./wdio.*.conf.js"   // Watch configuration files
  ]
};

// Issue: Too many files being watched (performance impact)
// Solution: Use more specific patterns

export const config = {
  filesToWatch: [
    // More specific (recommended)
    "./src/**/*.js",
    "./test/**/*.js",
    "./config/**/*.js"
  ]
};

// Issue: Watch mode consuming too much memory
// Solution: Use specific patterns and avoid broad globs

export const config = {
  filesToWatch: [
    "./src/**/*.js",
    "./test/**/*.js",
    // Chokidar automatically excludes node_modules by default
    // Use specific patterns to avoid watching too many files
  ]
};