How to use this library with Jest

[mswjs]

How to use this library with Jest

[kettanaito]

Hey, @amit08255. Thanks for reaching out.

Although you can use node-request-interceptor directly, I highly recommend you adopt the setupServer API from MSW. MSW (Mock Service Worker) is an API mocking library that uses node-request-interceptor to power its NodeJS requests interception. However, on top of that it adds the same API that would allow you to reuse request handlers in other levels of testing (i.e. E2E) and for development in a browser as well.

Would the setupServer satisfy your requirements? Let me know if there is more context to this question.

[amit08255]

@kettanaito Please can you provide an example of using node-request-interceptor directly. It would be very very helpful.

[kettanaito]

Sure. Here's an example how you can use it with Jest directly.

import { RequestInterceptor } from 'node-request-interceptor'
import fetch from 'node-fetch'

// Start requests interception.
const interceptor = new RequestInterceptor()

beforeAll(() => {
  // Declare how to react to each intercepted request
  // using a request middleware function.
  interceptor.use((req) => {
    if (req.url.href === 'https://api.github.com/numbers') {
      return {
        status: 200,
        headers: {
          'Content-Type': 'application/json'
        },
        body: JSON.stringify([1, 2, 3])
      }
    }
  })
})

afterAll(() => {
  // Restore patched modules and stop requests interception.
  interceptor.restore()
})

test('returns the list of numbers', async () => {
  // Perform a request to any endpoint that is handled 
  // in the request middleware above.
  const res = await fetch('https://api.github.com/numbers')
  const body = await res.json()

  expect(body).toEqual([1, 2, 3])
})

Also check out this repository's README, it lists all the API and examples.

I still don't recommend it, because there is much to add in order for such interception to be comfortable. For example:

• You have to provide request matching logic manually, NRI will not do this for you as this is out if its scope.
• Account on query parameters and hashes in request URL.
• Assigning headers and body is quite verbose, you need to construct a valid response manually (i.e. don't forget about proper Content-Type header).
• NRI, as the name implies, does not work in a browser.

The main argument is that the application scope of NRI is intentionally low-level. While this intercepts requests and allows to mock their responses, there's quite a lot one needs to add to this to be applicable in an actual project. This is what MSW does on top of NRI to ensure consistent user experience.

May I wonder why do you wish to use NRI directly? Do you have any reason not to use MSW?

[amit08255]

@kettanaito I am still a beginner with testing. I am designing a ReactJS app with test-driven development. For that I need to test my app without making real request and need to test if data sent to API is correct. Please help me with that, if possible with example. It will help me a lot.

[kettanaito]

I suggest you follow the Getting started tutorial on MSW website. It will explain you the concepts you need to achieve proper API mocking layer integration, and give you examples of browser/NodeJS usages along the way. Reading the documentation in general is what I would recommend as a good start.

Next, take a look at the official usage examples in MSW. Those contain real-world applications with libraries like React, Angular, as well as different API types (REST, GraphQL). You can draw some inspiration there and use them as a reference in your project.

When in doubt, take a look how MSW is integrated in the Bookshelf app that is used for the video series on application testing.

Lastly, in case of any questions we will be happy to help you in KCD discord in the msw channel. Hope that you achieve an awesome testing setup.