ABE — Network Chaos Specification

Concepto

Inspirado en Gremlin y LitmusChaos, pero aplicado a nivel de browser. ABE puede simular condiciones de red adversas durante la exploración para descubrir cómo se comporta el app en redes lentas, intermitentes, o con servicios externos fallando.

Esto es diferente al fuzzing de inputs:

Fuzzing: inputs inválidos en formularios
Network chaos: condiciones de red adversas (latencia, pérdida de paquetes, timeout)

Implementación via Playwright CDP

Playwright expone Chrome DevTools Protocol (CDP) que permite controlar la red:

// En PlaywrightAgent
async function applyNetworkCondition(condition: NetworkCondition): Promise<void> {
  const client = await this.page.context().newCDPSession(this.page);
  await client.send('Network.emulateNetworkConditions', {
    offline: condition.offline,
    downloadThroughput: condition.downloadKbps * 1024 / 8,
    uploadThroughput: condition.uploadKbps * 1024 / 8,
    latency: condition.latencyMs,
  });
}

Perfiles de red predefinidos

const NETWORK_PROFILES = {
  'fast-3g': { downloadKbps: 1500, uploadKbps: 750, latencyMs: 40, offline: false },
  'slow-3g': { downloadKbps: 400, uploadKbps: 150, latencyMs: 400, offline: false },
  '2g': { downloadKbps: 50, uploadKbps: 30, latencyMs: 800, offline: false },
  'offline': { downloadKbps: 0, uploadKbps: 0, latencyMs: 0, offline: true },
  'none': null  // sin limitación (default)
}

API request interception (simular servicios caídos)

// Simular que un endpoint específico falla con 503
await page.route('**/api/payment**', route => {
  route.fulfill({ status: 503, body: 'Service Unavailable' });
});

// Simular latencia en un endpoint específico
await page.route('**/api/search**', async route => {
  await new Promise(r => setTimeout(r, 3000)); // 3s delay
  route.continue();
});

Configuración en ExplorationConfig

networkChaos: {
  enabled: boolean;                    // default: false
  profile: keyof typeof NETWORK_PROFILES; // default: 'none'
  blockedEndpoints: string[];          // glob patterns — responden 503
  slowEndpoints: Array<{
    pattern: string;                   // glob
    delayMs: number;
  }>;
}

Anomalías específicas de network chaos

Añadir tipos al AnomalyDetector:

offline_handling_missing — app muestra pantalla en blanco o error no controlado cuando está offline
slow_network_no_feedback — con slow-3g, la app no muestra loading indicator (detectado si CLS=0 pero LCP>5000ms y no hay elemento con rol 'progressbar' o 'status')
external_service_crash — cuando un endpoint bloqueado causa error 500 en el frontend

Integración con el flujo de exploración

NetworkChaos se aplica de forma secuencial, no simultánea:

Primera pasada: exploración normal (baseline)
Segunda pasada (si networkChaos.enabled): misma seed, con perfil de red aplicado
Comparar resultados: nuevas anomalías que aparecen solo en la segunda pasada son network-related

Frontend — Network Chaos Config

En NewSessionForm, añadir sección collapsible "Network Chaos":

Toggle "Enable network chaos"
Select perfil: Fast 3G / Slow 3G / 2G / Offline
Textarea "Blocked endpoints" (uno por línea, glob patterns)
Lista "Slow endpoints" con campo pattern + delay ms

3.3 KiB Raw Blame History