Day 25 of 100: fetch — Real HTTP Calls for API Checks

Day 25 of 100 — 100 Days of Playwright with TypeScript Challenge. Phase: JavaScript Fundamentals. JavaScript (Days 1-33) → TypeScript (Days 34-63) → Playwright (Days 64-96) → AI Framework Capstone (Days 97-100).

🎭 Want to master this with real projects? Join the Playwright Automation Mastery course at The Testing Academy.

---

Node 18+ ships fetch natively. Real HTTP calls for API checks, test data setup, and health probes.

GET and POST

async function getUsers() {
  const res = await fetch('https://jsonplaceholder.typicode.com/users');
  console.log(res.status);          // 200
  console.log(res.ok);              // true (200-299)
  const users = await res.json();   // parse body — also async!
  return users;
}

async function createPost() {
  const res = await fetch('https://jsonplaceholder.typicode.com/posts', {
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify({ title: 'QA post', userId: 1 }),
  });
  return res.json();
}

A Mini Validation Helper

async function checkEndpoint(url, expectedStatus = 200) {
  const start = Date.now();
  const res = await fetch(url);
  const ms = Date.now() - start;
  const pass = res.status === expectedStatus;
  console.log(`${pass ? 'PASS' : 'FAIL'} ${url} → ${res.status} (${ms}ms)`);
  return pass;
}

fetch vs Playwright request

• fetch: standalone scripts, health checks, anything outside test runs
• Playwright request fixture: inside tests — shares baseURL, auth state, tracing (Day 77)
• Same mental model; request adds test-context integration

Tomorrow (Day 26): The event loop — why JS handles async without threads.