Declarative delays

HTTP interceptors are very efficient and can respond requests within milliseconds. This is great to keep your development and test environments fast, but sometimes you may want to simulate network latency, reproduce server processing time, check loading states in your application, or test how it behaves under slow conditions.

handler.delay() allows you to add declarative delays to your intercepted requests.

Local interceptor

interceptor
  .get('/users')
  .respond({ status: 200, body: [] })
  .delay(200); // Static delay of 200ms

interceptor
  .get('/users')
  .respond({ status: 200, body: [] })
  .delay(100, 500); // Random delay between 100ms and 500ms

interceptor
  .get('/users')
  .respond({ status: 200, body: [] })
  .delay((request) => {
    const isSlow = request.searchParams.get('slow') === 'true';
    return isSlow ? 1000 : 0;
  }); // Dynamic delay based on request

Remote interceptor

await interceptor
  .get('/users')
  .respond({ status: 200, body: [] })
  .delay(200); // Static delay of 200ms

await interceptor
  .get('/users')
  .respond({ status: 200, body: [] })
  .delay(100, 500); // Random delay between 100ms and 500ms

await interceptor
  .get('/users')
  .respond({ status: 200, body: [] })
  .delay((request) => {
    const isSlow = request.searchParams.get('slow') === 'true';
    return isSlow ? 1000 : 0;
  }); // Dynamic delay based on request