Unit Test Axios with axios mock adapter - Tuong-Nguyen/JavaScript-Structure GitHub Wiki

Axios-mock-adapter allows to mock requests easily to unit test modules that perform HTTP requests in isolation.

Installation

Using npm: $ npm install axios-mock-adapter --save-dev

Usage

Declaration

import axios from 'axios';
import MockAdapter from 'axios-mock-adapter';

let mock = new MockAdapter(axios);

Mocking a Get request

mock.onGet('http://example.com/users')
    .reply(200,
      [
        {id: 1, name: "A"},
        {id: 2, name: "B"}
      ]
    )

// Call mock request
return axios.get('http://example.com/users')
      .then(res => {
        expect(res.data.length).toBe(2);
      });

Mocking a Post request with specific parameters

mock..onPost('http://example.com/users', {id: "abc", name: "AAA"})
    .reply(201)

//Call mock request
return axios.post('http://example.com/users', {id: "abc", name: "AAA"} )
      .then(res => {
        expect(res.status).toBe(201);
      });

Requests that do not map to a mock handler are rejected with a HTTP 404 response. Example:

mock..onPost('http://example.com/users', {id: "abc", name: "AAA"})
    .reply(201)

//Call mock request
return axios.post('http://example.com/users', {id: "abc", name: "BBB"} )
      .catch(error => {
        expect(error.response.status).toBe(404);
      });

Mocking request error

//Mock a network error
mock.onGet('/users').networkError();

//Mock a network timeout
mock.onGet('/users').timeout();

//Mock a request error by throwing error
mock..onGet('http://example.com/users/100')
    .reply(function(){
      throw new Error('Error: Id is not exist.');
    })

//Call mock request error
return axios.get('http://example.com/users/100')
      .catch(error => {
        expect(error.message).toBe('Error: Id is not exist.');
      });

Chaining mock request

mock.onGet('http://example.com/users')
    .reply(200,
      [
        {id: 1, name: "A"},
        {id: 2, name: "B"}
      ]
    )
    .onGet('http://example.com/users/100')
    .reply(function(){
      throw new Error('Error: Id is not exist.');
    })
    .onAny().reply(200, "Response data");


//Call multiple requests
return axios.all([
      axios.get('/any1'),
      axios.get('/any2'),
      axios.get('/any3')
    ])
      .then(axios.spread(function (Response1, Response2, Response3) {
        expect(Response1.data).toBe('Response data');
        expect(Response2.data).toBe('Response data');
        expect(Response3.data).toBe('Response data');
      }));

Any requests would map to mock handler above by .onAny() method.

Mock handlers would be matched in declaration order.