Playwright API Testing with APIRequestContext (TypeScript)

Playwright is famous for browser automation, but it’s also one of the best API testing frameworks for TypeScript: fast parallel runs, rich assertions, fixtures, retries, HTML reports and trace files, all without opening a browser. Everything starts with APIRequestContext. In this lesson you’ll set up a Playwright API project from scratch, learn every request option you’ll actually use, and avoid the one baseURL mistake that silently breaks almost every beginner’s first suite.

Why Playwright for API Testing?

• One framework for UI and API: create data through the API, verify it in the UI, share fixtures and reports.
• TypeScript first: autocompletion, type-safe clients and schemas.
• Fast: tests run in parallel workers by default; API tests take milliseconds.
• Batteries included: retries, tags, projects, HTML/JUnit reports, traces, CI examples.

Already know the Playwright basics? The Playwright with TypeScript tutorial covers installation and the test runner in depth; the shorter Playwright API testing intro is a good warm-up. This module goes deeper and builds a full framework step by step.

Project Setup (5 Minutes)

mkdir sqa-api-tests && cd sqa-api-tests
npm init -y
npm install -D @playwright/test typescript @types/node
# Browsers are NOT needed for pure API tests, so you can skip "npx playwright install"

Create playwright.config.ts:

import { defineConfig } from '@playwright/test';

export default defineConfig({
  testDir: './tests',
  fullyParallel: true,
  reporter: [['list'], ['html', { open: 'never' }]],
  use: {
    // Trailing slash matters: request paths are resolved relative to this URL.
    baseURL: process.env.API_BASE_URL ?? 'https://sqatools.in/wp-json/sqa-api/v1/',
    extraHTTPHeaders: { Accept: 'application/json' },
  },
});

Every request in every test now starts from the practice API’s base URL and sends Accept: application/json. Switching to another environment is one environment variable: API_BASE_URL=https://qa.example.com/api/ npx playwright test.

The baseURL Trap (Read This Twice)

Playwright resolves request paths the same way a browser resolves links. We ran all three combinations against the live API:

Your First API Tests

tests/request-basics.spec.ts:

import { test, expect, request } from '@playwright/test';

test.describe('APIRequestContext basics', () => {
  test('GET with the built-in request fixture', async ({ request }) => {
    const res = await request.get('users/1');            // resolved against baseURL

    expect(res.status()).toBe(200);
    expect(res.ok()).toBeTruthy();
    expect(res.url()).toBe('https://sqatools.in/wp-json/sqa-api/v1/users/1');
    expect(res.headers()['content-type']).toContain('application/json');

    const body = await res.json();
    expect(body.data.name).toBe('Asha Verma');
  });

  test('query parameters with params', async ({ request }) => {
    const res = await request.get('users', { params: { role: 'admin', sort: 'age', order: 'desc' } });
    await expect(res).toBeOK();
    const { data } = await res.json();
    expect(data.map((u: { id: number }) => u.id)).toEqual([7, 1]);
  });

  test('POST JSON, form and raw bodies', async ({ request }) => {
    const json = await request.post('objects', { data: { name: 'json body', ttl: 30 } });
    expect(json.status()).toBe(201);

    const form = await request.post('echo', { form: { name: 'Asha', city: 'Pune' } });
    expect((await form.json()).headers['content-type']).toContain('application/x-www-form-urlencoded');

    const raw = await request.post('validate/user', {
      headers: { 'Content-Type': 'application/json' },
      data: '{"name": "Asha", ',                          // a string is sent as-is
    });
    expect(raw.status()).toBe(400);
  });

  test('a separate context with its own settings', async () => {
    const api = await request.newContext({
      baseURL: 'https://sqatools.in/wp-json/sqa-api/v1/',
      extraHTTPHeaders: { 'X-API-Key': 'sqa-key-12345' },
      timeout: 10_000,
    });
    const res = await api.get('apikey/profile');
    expect(res.status()).toBe(200);
    await api.dispose();                                  // always free the context
  });

  test('redirects, timeouts and failOnStatusCode', async ({ request }) => {
    const noFollow = await request.get('redirect', { maxRedirects: 0 });
    expect(noFollow.status()).toBe(302);
    expect(noFollow.headers()['location']).toBeTruthy();

    await expect(request.get('delay/5', { timeout: 2_000 })).rejects.toThrow(/Timeout/);
    await expect(request.get('users/999', { failOnStatusCode: true })).rejects.toThrow(/404/);
  });
});

npx playwright test tests/request-basics.spec.ts
npx playwright show-report        # open the HTML report

All five tests pass against the live practice API in a few seconds.

Request Methods and Options

The APIResponse Object

request Fixture vs newContext vs page.request

Common Beginner Mistakes

• Leading slash in paths with a prefixed baseURL (404s).
• Forgetting await before request.get() or res.json().
• Reading the body twice from different methods is fine, but don’t forget await on each.
• Not disposing contexts you created (memory leaks in long runs).
• Using failOnStatusCode: true globally, then wondering why negative tests throw.
• Hardcoding URLs in tests instead of baseURL.

Interview Questions: Playwright APIRequestContext