89 lines
3.3 KiB
Markdown
89 lines
3.3 KiB
Markdown
# 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:
|
|
```typescript
|
|
// 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
|
|
```typescript
|
|
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)
|
|
```typescript
|
|
// 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
|
|
```typescript
|
|
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:
|
|
1. Primera pasada: exploración normal (baseline)
|
|
2. Segunda pasada (si networkChaos.enabled): misma seed, con perfil de red aplicado
|
|
3. 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
|