Debugging Tips

// Request interception and logging
class APIDebugger {
  constructor() {
    this.logs = [];
  }
  
  async request(url, options) {
    const startTime = Date.now();
    const requestId = Math.random().toString(36).substr(2, 9);
    
    // Log request
    this.logRequest(requestId, url, options);
    
    try {
      const response = await fetch(url, options);
      const duration = Date.now() - startTime;
      
      // Log response
      this.logResponse(requestId, response, duration);
      
      if (!response.ok) {
        const error = await response.text();
        console.error(`[${requestId}] Error: ${error}`);
      }
      
      return response;
    } catch (error) {
      this.logError(requestId, error);
      throw error;
    }
  }
  
  logRequest(id, url, options) {
    const log = {
      id,
      timestamp: new Date().toISOString(),
      type: 'request',
      url,
      method: options.method,
      headers: options.headers,
      body: options.body
    };
    
    this.logs.push(log);
    console.log(`[${id}] Request to ${url}`);
  }
  
  logResponse(id, response, duration) {
    const log = {
      id,
      timestamp: new Date().toISOString(),
      type: 'response',
      status: response.status,
      duration: `${duration}ms`,
      headers: Object.fromEntries(response.headers)
    };
    
    this.logs.push(log);
    console.log(`[${id}] Response ${response.status} in ${duration}ms`);
  }
  
  exportLogs() {
    return JSON.stringify(this.logs, null, 2);
  }
}