Network Delay & Error Simulation
Test frontend loading skeletons, spinner UI transitions, and React error boundaries by simulating network conditions with zero backend changes.
1. Simulating Network Latency (?_delay=ms)
Pass ?_delay=<ms> or header X-Simulate-Delay: <ms> (up to 5000ms max).
1
// 1. Simulate 1.5-second network latency
2
fetch('https://playground-api-xi.vercel.app/api/v1/posts?_delay=1500')
3
4
// 2. Simulate 500 Internal Server Error
5
fetch('https://playground-api-xi.vercel.app/api/v1/posts?_status=500')
6
7
// 3. Combined Delay & 404 Not Found
8
fetch('https://playground-api-xi.vercel.app/api/v1/users/999?_delay=2000&_status=404')
2. Header-Based Simulation (Clean URLs)
Pass simulation flags as HTTP request headers to keep URLs clean in production:
1
// Clean Header-Based Simulation
2
fetch('https://playground-api-xi.vercel.app/api/v1/posts', {
3
headers: {
4
'X-Simulate-Delay': '2000', // 2-second delay
5
'X-Simulate-Status': '503', // 503 Service Unavailable
6
},
7
})