Support custom `response` properties

v1.4.0

Custom Response Properties

This update adds the much-desired ability to customize the properties of your mocked responses! Includes everything from HTTP headers to fields in the XMLHttpRequest/fetch Response objects themselves.

Simply add your desired fields in the new responseProperties object, and they will permeate through both XHR/response objects.

For example:

const myUrl = '/my/url';

MockRequests.setDynamicMockUrlResponse(myUrl, {
    response: { error: 'You must input a valid email address' },
    responseProperties: {
        ok: false,
        headers: {
            status: 400,
        },
    },
});

const res = await fetch(myUrl, { ...options });

console.log(res.ok); // false
console.log(res.headers.get('status')); // 400

Support Fetch API's response.clone() Function

This also adds support for (await fetch(...)).clone() to ensure all your source/test code using the .clone() function works as expected.

New Webpack plugin and enhanced IDE autocompletion

New and improved version of mock-requests is now here!

Webpack plugin

Instead of manually changing your webpack.config.js configuration fields with the previous resolveMocks(), now you can simply plug-and-play using the bundled mock-requests/bin/MockRequestsWebpackPlugin. For example:

const MockRequestsWebpackPlugin = require('mock-requests/bin/MockRequestsWebpackPlugin');

module.exports = {
    module: {
        rules: [
            {
                test: /\.jsx?$/,
                exclude: /node_modules/,
                include: /src/,
                loader: 'babel-loader'
            },
            // ...
    },
    entry: {
        client: [ 'core-js', 'isomorphic-fetch', './src/index.js' ],
        vendor: [ 'react', 'react-dom', 'prop-types' ]
    },
    plugins: [
        new MockRequestsWebpackPlugin(
            'mocks',  // directory containing mock files
            'MockConfig.js',  // entry point for mock-requests configuration, resides within the `mocks/` directory
            process.env.MOCK === 'true',  // boolean to (de-)activate mocks, can be whatever you want
            // options, if applicable
        )
    ]
};

More options and usage examples can be seen in the ReadMe.

IDE autocompletion

MockRequests now includes enhanced IDE autocompletion and JSDoc descriptions. While seemingly trivial on the surface, this dramatically enhances the development experience by offering suggestions, descriptions, and types for all fields.

Simplified webpack configuration and async dynamic response functions

This release includes 2 major improvements, including:

• Simplified webpack configuration! Now, MockRequests comes bundled with a node script that makes adding mocks to your entry and/or module.rules[jsEntry].include fields much easier. Just specify the mock folder, the mock entry file, and a boolean determining if mocks are active or not, and the script automatically resolves the respective paths, e.g.

  const resolveMocks = require('mock-requests/bin/resolve-mocks');
  const resolvedMocks = resolveMocks('mocks', 'mocks/MockConfig.js', process.env.MOCK === 'true');
  
  module.exports = {
      entry: [ '@babel/polyfill', './src/index.js', ...resolvedMocks.entry ],
      ...
      module.rules[jsEntry].include: [ /src/, ...resolvedMocks.include ],
  }
  

  Read more in the ReadMe.
• Support for async functions in dynamicResponseModFn! Now, your dynamic response functions can run async code before returning the desired response. This means you can, e.g. call MockRequests.originalFetch() within your dynamicResponseModFn if the response isn't mocked or if you want to generate a mock using a different endpiont. See an example of this in MockRequests/demo/mocks/DynamicResponses.js.

Support for Fetch API members and user-friendly exports

This release includes minor usability improvements including:

• Support for Fetch API members, including fetch(new Request(url, options)).
• Now, both default and named fields are exported, so both import MockRequests from 'mock-requests'; and import { configure } from 'mock-requests'; work equally well.
• Minimized production build to reduce parent project's build size.
• Security fixes for nested devDependencies; the issues wouldn't have impacted MockRequests installation/usage but were still important for the case where users clone the repo directly.

Add query param parsing for URLs with the same pathname

This release includes new features, including:

• Query parameter parsing! The function to dynamically update responses can now read query parameters passed in the async request. The new signature is dynamicResponseModFn(request, response, queryParamMap). This also includes content passed in the URL hash, stored in the queryParamMap.hash field.
• Relatedly, you can now optionally treat all URLs with the same pathname identically, such that the same dynamicResponseModFn() function can generate different responses based on the query parameter values. For example, the dynamic modification function for example.com/search can handle all queries passed to example.com/search?q=[searchQuery]. Simply set the MockResponseConfig.usePathnameForAllQueries to true to activate this feature.
• New utility function, mapStaticConfigToDynamic(staticConfig), to easily convert your static URL-response mock configurations to their dynamic counterparts. See the ReadMe/demo for sample usages.

Add license file to build output

Previously the license was specified but not included in the build output. This release includes said license file.

Fix IDE import auto-completion

This release includes:

• IDE import auto-completion fix: previously, the dist/ folder was added as-is to the npm package, which resulted in IDE import auto-completion resolving mock-requests/dist/MockRequests.js. This is now fixed to resolve mock-requests instead.
• Minor ReadMe and demo improvements

Add IDE auto-completion and JSDoc

This update includes:

• TypeScript typings for functions so that IDEs auto-complete fills out function names and parameters for you
• Add JSDoc page to explain MockRequests API in-depth
• Enhance ReadMe with JSDoc, extra examples, and table of contents for easy viewing

Delayed responses

New feature: you can now pass in a delay field in your dynamic response configuration to delay the resolution of mock responses by that many milliseconds.

Change name, auto-parse JSON requests as objects, accept null response entries in dynamic configure function

• Update name from RequestMock to MockRequests to match npm package name
  • Note: this won't impact your code if you already have import RequestMock from 'mock-requests';. You can leave it or update it as you wish
• Automatically parse requests as JSON instead of returning them as strings to dynamicRequestModFn if possible
• Accept null response entries in configureDynamicResponses()