pretender

library3.4.7jsnpmunverified

Pretender is a mock server library for XMLHttpRequest and Fetch in the browser, providing an express/sinatra-style DSL for defining routes and handlers. Current stable version is 3.4.7, released with regular updates. It works by temporarily replacing native XMLHttpRequest and Fetch to intercept all requests. Key differentiators: minimal setup, supports dynamic route segments, timing simulation, and multiple map registration. Note: Only works in browsers, not Node.js.

testing

npm install pretender

github ↗package ↗homepage ↗

INSTALL

IMPORT

SIG · PRETENDER

pretender

testingjavascriptv3.4.7

harness data pending

Install & Compatibility

Where this runs

No compatibility data collected yet for this library.

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

Pretender

✓ import Pretender from 'pretender'

✗ const Pretender = require('pretender')

Pretender uses ESM default export since v3. CommonJS require works but is not recommended for consistency with TypeScript types.

Pretender (TypeScript type)

✓ import type Pretender from 'pretender'

For TypeScript projects, use the type import to avoid bundling runtime if only using types.

Pretender (browser script tag)

✓ <script src="node_modules/pretender/dist/pretender.bundle.js"></script>

Loads via global variable `Pretender`. No import needed.

Shows how to define GET, POST, and dynamic route handlers using Pretender's DSL, with fetch interception.

import Pretender from 'pretender'; const server = new Pretender(function() { this.get('/api/users', () => { return [200, { 'Content-Type': 'application/json' }, JSON.stringify([{ id: 1, name: 'Alice' }, { id: 2, name: 'Bob' }])]; }); this.post('/api/users', (request) => { const newUser = JSON.parse(request.requestBody); newUser.id = 3; return [201, { 'Content-Type': 'application/json' }, JSON.stringify(newUser)]; }); this.get('/api/users/:id', (request) => { const user = { id: Number(request.params.id), name: 'Test' }; return [200, { 'Content-Type': 'application/json' }, JSON.stringify(user)]; }); }); // Usage example: fetch('/api/users') .then(response => response.json()) .then(data => console.log(data)); // Clean up when done server.shutdown();

Debug

Known issues

gotchaPretender only works in the browser. It intercepts XMLHttpRequest and fetch, which do not exist in Node.js. Do not use in server-side tests.

fix

Use appropriate mocking libraries like nock or msw for Node.js environments.

affects: >=1.0.0

deprecatedPretender's timing parameter (e.g., `this.get('/path', handler, { timing: 100 })`) is deprecated in favor of using Promise-based delays or async handlers.

fix

Use async handlers with setTimeout or similar to simulate latency.

affects: >=3.0.0

gotchaWhen using dynamic route segments like `/api/users/:id`, the captured parameters are available on `request.params` as strings. Be sure to convert them to numbers if needed.

fix

Parse `request.params.id` with `Number()` or `parseInt()` before using as a numeric value.

affects: >=1.0.0

breakingIn version 2.0.0, the way handlers are defined changed. Previously you could pass an options object to routes; now the third argument is the timing parameter.

fix

Update code to pass timing as argument: `this.get(path, handler, timing)` instead of an options object.

affects: 2.0.0

Errors

Common errors & fixes

TypeError: XMLHttpRequest is not defined

Trying to use Pretender in a Node.js environment where XMLHttpRequest and fetch do not exist.

fix

Run tests in a browser-like environment (e.g., jsdom, Karma, or Playwright) that provides XMLHttpRequest.

Pretender is not defined

Using the package without properly importing it, e.g., relying on the global when bundling or not loading the script.

fix

Either import Pretender via ES module (`import Pretender from 'pretender'`) or include the UMD bundle in the page.

Error: [object Object] is not a valid response

Returning an object that is not an array-like response (e.g., returning an object instead of [status, headers, body]).

fix

Always return an array with exactly three elements: `[statusCode, headerObject, bodyString]`.

Upgrade

Version history

3.4.7latest on npm

Audit

Dependencies

fake-xml-http-requestrequiredProvides a fake XMLHttpRequest implementation that Pretender replaces the native one with

route-recognizerrequiredUsed for path matching and URL parameter extraction

whatwg-fetchoptionalUsed if the environment does not support native fetch, to enable fetch interception

Agent activity

6 hits · last 30 days

node

Resources

githubhttps://github.com/pretenderjs/pretender ↗

packagepretender ↗

homepagehttps://github.com/pretenderjs/pretender#readme ↗