@iqual/playwright-vrt 0.1.0 → 0.1.2

package/src/collect.ts

@@ -1,171 +0,0 @@
-#!/usr/bin/env bun
-
-import Sitemapper from 'sitemapper';
-import micromatch from 'micromatch';
-import { chromium } from 'playwright';
-import type { VRTConfig } from './config';
-
-export interface URLCollectionResult {
-  urls: string[];
-  source: 'sitemap' | 'crawl';
-  total: number;
-  filtered: number;
-}
-
-export async function collectURLs(config: VRTConfig): Promise<URLCollectionResult> {
-  let urls: string[] = [];
-  let source: 'sitemap' | 'crawl' = 'sitemap';
-
-  // Try sitemap first
-  try {
-    urls = await collectFromSitemap(config.referenceUrl, config.sitemapPath || '/sitemap.xml');
-  } catch (error) {
-    console.warn('⚠️ Sitemap fetch failed, falling back to crawler');
-    // Fallback to crawling
-    urls = await crawlWebsite(config.referenceUrl, config.crawlOptions);
-    source = 'crawl';
-  }
-
-  const totalUrls = urls.length;
-
-  // Filter URLs
-  urls = filterURLs(urls, config.referenceUrl, config.include || ['*'], config.exclude || []);
-
-  // Remove duplicate URLs but keep order
-  urls = Array.from(new Set(urls));
-
-  // Limit to maxUrls
-  const maxUrls = config.maxUrls || 25;
-  const filteredCount = urls.length;
-  urls = urls.slice(0, maxUrls);
-
-  return {
-    urls,
-    source,
-    total: totalUrls,
-    filtered: filteredCount,
-  };
-}
-
-async function collectFromSitemap(baseUrl: string, sitemapPath: string): Promise<string[]> {
-  const sitemapUrl = new URL(sitemapPath, baseUrl).toString();
-
-  const sitemap = new Sitemapper({
-    url: sitemapUrl,
-    timeout: 15000,
-  });
-
-  const { sites } = await sitemap.fetch();
-
-  if (!sites || sites.length === 0) {
-    throw new Error('No URLs found in sitemap');
-  }
-
-  return sites;
-}
-
-async function crawlWebsite(
-  baseUrl: string,
-  options?: VRTConfig['crawlOptions']
-): Promise<string[]> {
-  const urls = new Set<string>();
-
-  console.log('   Using crawler (homepage links only)...');
-
-  const browser = await chromium.launch({ headless: true });
-  const page = await browser.newPage();
-
-  const baseUrlObj = new URL(baseUrl);
-
-  try {
-    // Visit the homepage
-    await page.goto(baseUrl, {
-      waitUntil: 'networkidle',
-      timeout: 30000
-    });
-
-    // Add the homepage itself, by adding the current page URL
-    urls.add(page.url());
-
-    // Extract all links from the page
-    const links = await page.evaluate(() => {
-      // @ts-ignore - runs in browser context
-      const anchors = Array.from(document.querySelectorAll('a[href]'));
-      // @ts-ignore - runs in browser context
-      return anchors.map(a => (a as HTMLAnchorElement).href);
-    });
-
-    // Filter links to same domain and add to set
-    for (const link of links) {
-      try {
-        const linkUrl = new URL(link);
-
-        // Only include links from the same domain
-        if (linkUrl.hostname === baseUrlObj.hostname) {
-          // Normalize URL (remove hash)
-          linkUrl.hash = '';
-          const normalizedUrl = linkUrl.toString();
-
-          if (options?.removeTrailingSlash) {
-            // Remove trailing slash for consistency (except for root)
-            const cleanUrl = normalizedUrl.endsWith('/') && normalizedUrl !== baseUrl + '/'
-              ? normalizedUrl.slice(0, -1)
-              : normalizedUrl;
-            urls.add(cleanUrl);
-          } else {
-            urls.add(normalizedUrl);
-          }
-        }
-      } catch {
-        // Skip invalid URLs
-      }
-    }
-
-    console.log(`   Found ${urls.size} URLs from homepage`);
-
-  } catch (error) {
-    console.error('   Crawler error:', error instanceof Error ? error.message : error);
-    // At minimum, return the base URL
-    urls.add(baseUrl);
-  } finally {
-    await browser.close();
-  }
-
-  return Array.from(urls);
-}
-
-function filterURLs(urls: string[], baseUrl: string, include: string[], exclude: string[]): string[] {
-  return urls.filter((url) => {
-    // Convert URL to path for pattern matching
-    const urlObj = new URL(url);
-    const path = urlObj.pathname + urlObj.search;
-
-    // Filter URLs that don't match the reference URL domain
-    const baseObj = new URL(baseUrl);
-    if (urlObj.hostname !== baseObj.hostname) {
-      return false;
-    }
-
-    // Also match against full URL for more flexibility
-    const fullUrl = url;
-
-    // Check if excluded
-    if (exclude.length > 0) {
-      if (micromatch.isMatch(path, exclude, {bash: true})) {
-        return false;
-      }
-    }
-
-    // Check if included
-    if (include.length > 0) {
-      return micromatch.isMatch(path, include, {bash: true});
-    }
-
-    return true;
-  });
-}
-
-export function saveURLs(urls: string[], filepath: string): void {
-  const content = JSON.stringify(urls, null, 2);
-  Bun.write(filepath, content);
-}

package/src/config.ts

@@ -1,119 +0,0 @@
-#!/usr/bin/env bun
-
-export interface VRTConfig {
-  referenceUrl: string;
-  testUrl: string;
-  sitemapPath?: string;
-  maxUrls?: number;
-  exclude?: string[];
-  include?: string[];
-  crawlOptions?: {
-    maxDepth?: number;
-    removeTrailingSlash?: boolean;
-  };
-  viewports?: Array<{
-    name: string;
-    width: number;
-    height: number;
-  }>;
-  threshold?: {
-    maxDiffPixels?: number;
-    maxDiffPixelRatio?: number;
-  };
-}
-
-export interface CLIOptions {
-  reference?: string;
-  test?: string;
-  config: string;
-  output?: string;
-  maxUrls?: number;
-  project?: string;
-  verbose?: boolean;
-  identifier?: string;
-  updateBaseline?: boolean;
-  headed?: boolean;
-}
-
-export const DEFAULT_CONFIG: Partial<VRTConfig> = {
-  sitemapPath: '/sitemap.xml',
-  maxUrls: 25,
-  exclude: [],
-  include: ['*'],
-  crawlOptions: {
-    maxDepth: 1,
-    removeTrailingSlash: true,
-  },
-  viewports: [
-    { name: 'desktop', width: 1920, height: 1080 },
-    { name: 'mobile', width: 375, height: 667 },
-  ],
-  threshold: {
-    maxDiffPixels: 100,
-    maxDiffPixelRatio: 0.01,
-  },
-};
-
-export async function loadConfig(configPath: string): Promise<VRTConfig> {
-  try {
-    const file = Bun.file(configPath);
-    const config = await file.json();
-
-    // Merge with defaults
-    return {
-      ...DEFAULT_CONFIG,
-      ...config,
-      crawlOptions: {
-        ...DEFAULT_CONFIG.crawlOptions,
-        ...config.crawlOptions,
-      },
-      viewports: config.viewports || DEFAULT_CONFIG.viewports,
-      threshold: {
-        ...DEFAULT_CONFIG.threshold,
-        ...config.threshold,
-      },
-    };
-  } catch (error) {
-    if (error instanceof Error && 'code' in error && error.code === 'ENOENT') {
-      throw new Error(`Config file not found: ${configPath}`);
-    }
-    throw error;
-  }
-}
-
-export function validateConfig(config: VRTConfig): void {
-  // Validate required URLs
-  if (!config.testUrl) {
-    throw new Error('testUrl is required');
-  }
-  if (!config.referenceUrl) {
-    throw new Error('referenceUrl is required');
-  }
-
-  // Validate URL format
-  try {
-    new URL(config.referenceUrl);
-    new URL(config.testUrl);
-  } catch {
-    throw new Error('Invalid URL format in referenceUrl or testUrl');
-  }
-
-  // Validate viewports
-  if (!config.viewports || config.viewports.length === 0) {
-    throw new Error('At least one viewport must be defined');
-  }
-
-  for (const vp of config.viewports) {
-    if (!vp.name || vp.width <= 0 || vp.height <= 0) {
-      throw new Error(`Invalid viewport configuration: ${JSON.stringify(vp)}`);
-    }
-  }
-
-  // Validate threshold
-  if (config.threshold) {
-    if (config.threshold.maxDiffPixelRatio &&
-        (config.threshold.maxDiffPixelRatio < 0 || config.threshold.maxDiffPixelRatio > 1)) {
-      throw new Error('maxDiffPixelRatio must be between 0 and 1');
-    }
-  }
-}

package/src/runner.ts

@@ -1,232 +0,0 @@
-#!/usr/bin/env bun
-
-import { spawn } from 'child_process';
-import * as path from 'path';
-import * as fs from 'fs';
-import type { VRTConfig } from './config';
-
-export interface TestResults {
-  passed: number;
-  failed: number;
-  total: number;
-  exitCode: number;
-}
-
-export interface RunnerOptions {
-  config: VRTConfig;
-  outputDir: string;
-  verbose?: boolean;
-  project?: string;
-  updateBaseline?: boolean;
-  hasExplicitReference?: boolean;
-  headed?: boolean;
-}
-
-/**
- * Check if baseline snapshots already exist and are valid
- */
-export function hasExistingSnapshots(snapshotDir: string): boolean {
-  if (!fs.existsSync(snapshotDir)) {
-    return false;
-  }
-
-  // Recursively check for any .png files
-  function hasSnapshotFiles(dir: string): boolean {
-    const entries = fs.readdirSync(dir, { withFileTypes: true });
-
-    for (const entry of entries) {
-      const fullPath = path.join(dir, entry.name);
-
-      if (entry.isDirectory()) {
-        if (hasSnapshotFiles(fullPath)) {
-          return true;
-        }
-      } else if (entry.name.endsWith('.png')) {
-        return true;
-      }
-    }
-
-    return false;
-  }
-
-  return hasSnapshotFiles(snapshotDir);
-}
-
-/**
- * Run Playwright tests using the shipped config and test files
- * Much simpler than the old approach - just exec playwright
- */
-export async function runVisualTests(options: RunnerOptions): Promise<TestResults> {
-  const { config, outputDir, verbose, project, updateBaseline, hasExplicitReference, headed } = options;
-
-  // Find the playwright-vrt package directory
-  const packageDir = path.join(__dirname, '..');
-  const playwrightConfigPath = path.join(packageDir, 'playwright.config.ts');
-  const snapshotDir = path.join(process.cwd(), 'playwright-snapshots');
-
-  // Check if baseline snapshots already exist (look for any .png files in snapshots)
-  const hasBaseline = !updateBaseline && hasExistingSnapshots(snapshotDir);
-
-  if (hasBaseline) {
-    console.log('\n📸 Using existing baseline snapshots');
-    if (verbose) {
-      console.log('   (Use --update-baseline to regenerate from reference URL)');
-    }
-  } else {
-    if (updateBaseline) {
-      console.log('\n🔄 Updating baseline snapshots...');
-    } else {
-      console.log('\n📸 Creating baseline snapshots (first run)...');
-    }
-    console.log(`   Source: ${config.referenceUrl}`);
-
-    // Step 1: Create baseline screenshots
-    await runPlaywright({
-      configPath: playwrightConfigPath,
-      baseURL: config.referenceUrl,
-      vrtConfig: config,
-      outputDir,
-      updateSnapshots: true,
-      verbose: true,
-      project,
-      headed,
-    });
-
-    console.log('✓ Baseline created');
-  }
-
-  console.log(`\n🧪 Testing ${config.testUrl}`);
-
-  // Step 2: Run tests against test URL
-  const exitCode = await runPlaywright({
-    configPath: playwrightConfigPath,
-    baseURL: config.testUrl,
-    vrtConfig: config,
-    outputDir,
-    updateSnapshots: false,
-    verbose: true,
-    project,
-    headed,
-  });
-
-  // Parse results
-  const results = await parseResults(outputDir);
-  results.exitCode = exitCode;
-
-  return results;
-}
-
-interface PlaywrightRunOptions {
-  configPath: string;
-  baseURL: string;
-  vrtConfig: VRTConfig;
-  outputDir: string;
-  updateSnapshots: boolean;
-  verbose?: boolean;
-  project?: string;
-  headed?: boolean;
-}
-
-async function runPlaywright(options: PlaywrightRunOptions): Promise<number> {
-  return new Promise((resolve, reject) => {
-    const args = ['playwright', 'test', '--config', options.configPath];
-
-    if (options.updateSnapshots) {
-      args.push('--update-snapshots');
-    }
-
-    if (options.project) {
-      args.push('--project', options.project);
-    }
-
-    if (options.headed) {
-      args.push('--headed');
-    }
-
-    const env = {
-      ...process.env,
-      BASE_URL: options.baseURL,
-      VRT_CONFIG: JSON.stringify(options.vrtConfig),
-      OUTPUT_DIR: options.outputDir,
-    };
-
-    const proc = spawn('bunx', args, {
-      env,
-      stdio: options.verbose ? 'inherit' : 'pipe',
-      shell: true,
-      cwd: process.cwd(),
-    });    let stdout = '';
-    let stderr = '';
-
-    if (!options.verbose) {
-      proc.stdout?.on('data', (data) => {
-        stdout += data.toString();
-      });
-      proc.stderr?.on('data', (data) => {
-        stderr += data.toString();
-      });
-    }
-
-    proc.on('close', (code) => {
-      const exitCode = code || 0;
-
-      // For baseline creation (update-snapshots), always succeed
-      if (options.updateSnapshots) {
-        resolve(0);
-      } else {
-        // For actual tests, return the exit code
-        resolve(exitCode);
-      }
-    });
-
-    proc.on('error', (error) => {
-      reject(new Error(`Failed to run Playwright: ${error.message}`));
-    });
-  });
-}
-
-async function parseResults(outputDir: string): Promise<TestResults> {
-  const resultsPath = path.join(outputDir, 'results.json');
-
-  try {
-    const file = Bun.file(resultsPath);
-    const results = await file.json();
-
-    let passed = 0;
-    let failed = 0;
-    let total = 0;
-
-    // Parse Playwright JSON results
-    if (results.suites) {
-      for (const suite of results.suites) {
-        if (suite.specs) {
-          for (const spec of suite.specs) {
-            total++;
-            if (spec.ok) {
-              passed++;
-            } else {
-              failed++;
-            }
-          }
-        }
-      }
-    }
-
-    return { passed, failed, total, exitCode: 0 };
-  } catch {
-    return { passed: 0, failed: 0, total: 0, exitCode: 1 };
-  }
-}
-
-export function printResults(results: TestResults, config: VRTConfig): void {
-  console.log('\n📊 Test Results:');
-  console.log(`   Total: ${results.total}`);
-  console.log(`   Passed: ${results.passed}`);
-  console.log(`   Failed: ${results.failed}`);
-
-  if (results.failed > 0) {
-    console.log(`\n❌ ${results.failed} visual difference(s) detected`);
-  } else if (results.total > 0) {
-    console.log('\n✅ All visual tests passed');
-  }
-}

package/src/workspace.ts

@@ -1,64 +0,0 @@
-#!/usr/bin/env bun
-
-import * as fs from 'fs';
-import * as path from 'path';
-
-/**
- * Workspace manages the .playwright-vrt/ directory
- * This is persistent between runs for debugging and caching
- */
-export class Workspace {
-  private readonly dir: string;
-
-  constructor(baseDir?: string) {
-    // Use .playwright-vrt in current directory (or specified base)
-    this.dir = path.join(baseDir || process.cwd(), '.playwright-vrt');
-
-    // Create workspace directory
-    fs.mkdirSync(this.dir, { recursive: true });
-  }
-
-  getPath(file: string = ''): string {
-    return file ? path.join(this.dir, file) : this.dir;
-  }
-
-  writeFile(filename: string, content: string): void {
-    const filePath = this.getPath(filename);
-    const dir = path.dirname(filePath);
-
-    if (!fs.existsSync(dir)) {
-      fs.mkdirSync(dir, { recursive: true });
-    }
-
-    fs.writeFileSync(filePath, content, 'utf-8');
-  }
-
-  readFile(filename: string): string {
-    const filePath = this.getPath(filename);
-    return fs.readFileSync(filePath, 'utf-8');
-  }
-
-  exists(filename: string): boolean {
-    return fs.existsSync(this.getPath(filename));
-  }
-
-  writeJSON(filename: string, data: any): void {
-    this.writeFile(filename, JSON.stringify(data, null, 2));
-  }
-
-  readJSON(filename: string): any {
-    return JSON.parse(this.readFile(filename));
-  }
-
-  // Manual cleanup - workspace is persistent by default
-  clean(): void {
-    if (fs.existsSync(this.dir)) {
-      fs.rmSync(this.dir, { recursive: true, force: true });
-      console.log(`🗑️  Cleaned workspace: ${this.dir}`);
-    }
-  }
-
-  info(): void {
-    console.log(`📁 Workspace: ${this.dir}`);
-  }
-}