How do I test axios in Jest?

When it comes to testing JavaScript code, Jest is a popular choice among developers. It provides a simple and powerful framework for writing tests and comes with a wide range of features. If you are using axios, a popular HTTP client library, in your JavaScript project and want to test it using Jest, you’re in the right place. In this blog post, we will explore different approaches to testing axios in Jest.

Approach 1: Mocking axios with Jest

One common approach to testing axios in Jest is by mocking the axios library. This involves creating a mock implementation of axios and using it in your tests. Here’s an example:


// axios.js (axios wrapper)

import axios from 'axios';

export const fetchData = async () => {
  const response = await axios.get('https://api.example.com/data');
  return response.data;
};


// axios.test.js

import { fetchData } from './axios';
import axios from 'axios';

jest.mock('axios');

test('fetchData returns the correct data', async () => {
  const mockData = { name: 'John Doe' };
  axios.get.mockResolvedValueOnce({ data: mockData });

  const data = await fetchData();

  expect(data).toEqual(mockData);
});

In this example, we create a mock implementation of axios using Jest’s jest.mock() function. We then use mockResolvedValueOnce() to mock the response of the axios.get() method. Finally, we test the fetchData() function and assert that it returns the correct data.

Approach 2: Using axios-mock-adapter

Another approach to testing axios in Jest is by using the axios-mock-adapter library. This library provides an easy way to mock axios requests and responses. Here’s how you can use it:


// axios.js (axios wrapper)

import axios from 'axios';

export const fetchData = async () => {
  const response = await axios.get('https://api.example.com/data');
  return response.data;
};


// axios.test.js

import { fetchData } from './axios';
import axios from 'axios';
import MockAdapter from 'axios-mock-adapter';

const mock = new MockAdapter(axios);

test('fetchData returns the correct data', async () => {
  const mockData = { name: 'John Doe' };
  mock.onGet('https://api.example.com/data').reply(200, mockData);

  const data = await fetchData();

  expect(data).toEqual(mockData);
});

In this example, we create a new instance of the MockAdapter class and pass axios as the argument. We then use the onGet() method to mock the response of the GET request. Finally, we test the fetchData() function and assert that it returns the correct data.

Conclusion

Testing axios in Jest can be done using various approaches. In this blog post, we explored two popular methods: mocking axios with Jest and using the axios-mock-adapter library. Both approaches allow you to test axios requests and responses in a controlled environment. Choose the approach that best suits your project requirements and start testing your axios code with confidence!

Happy testing!

How do I test axios in Jest?