Ложные аксиумы с axios-mock-адаптером получают неопределенное значение

Question

Я создал экземпляр Axios...

// api/index.js

const api = axios.create({
  baseURL: '/api/',
  timeout: 2500,
  headers: { Accept: 'application/json' },
});
export default api;

И несколько модулей используют это..

// api/versions.js

import api from './api';

export function getVersions() {
  return api.get('/versions');
}

Я пытаюсь проверить, как..

// Test
import { getVersions } from './api/versions';

const versions= [{ id: 1, desc: 'v1' }, { id: 2, desc: 'v2' }];
mockAdapter.onGet('/versions').reply(200, versions);

getVersions.then((resp) => { // resp is UNDEFINED?
  expect(resp.data).toEqual(versions);
  done();
});

Почему респ не определен?

Answer 1

Вам не нужно axios-mock-adapter, Вот как я издеваюсь axios:

// src/__mocks__/axios.ts

const mockAxios = jest.genMockFromModule('axios')

// this is the key to fix the axios.create() undefined error!
mockAxios.create = jest.fn(() => mockAxios)

export default mockAxios

Для получения дополнительной информации: /questions/37752699/lozhnyij-vnutrennij-axioscreate/37752717#37752717

Answer 2

Здесь можно попробовать две вещи:

1. Возможно, у вас уже есть это в другом месте в вашем коде, но не забудьте настроить mockAdaptor:

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

const mockAdapter = new MockAdapter(axios);

2. Я не нашел способа заставить работать фиктивный адаптер, когда тестируемая функция использует 'axios.create' для настройки нового экземпляра axios. Попробуйте что-то вроде этого:

// api/index.js

const api = {
  get(path) {
    return axios.get('/api' + path)
    .then((response) => {
        return response.data;
    });
  }
}
export default api;

Answer 3

Для тех, кто все еще борется с этим.

Вы должны убедиться, что вы инициализировали свой MockAdapter вне тестового тела.

т.е. ❌ Неправильно ❌

      it('should do a thing', () => {
    const mockAdapter = new MockAdapter(axios);
})

✅ Правильно ✅

      const mockAdapter = new MockAdapter(axios);

it('should pass' () => {})

Answer 4

Это потому, что вы не создали новый экземпляр нового MockAdapter.

      import { getVersions } from "./api/versions";
import api from "./api/index";

describe("getVersions", () => {
  const versions = [
    { id: 1, desc: "v1" },
    { id: 2, desc: "v2" },
  ];

  const mockClient = new MockAdapter(api);

  it("should return status 200 and data === versions", async () => {
    mockClient.onGet("/versions").reply(200, versions);
    
    const result = await getVersions();

    expect(result.status).toBe(200);
    expect(result.data).toEqual(versions);
  });
});

Внимание!!! В вашем случае важно создать новый MockAdapter(api), используя API . Если вы создадите MockAdapter(axios), это не сработает, это очень распространенная ошибка. Потому что вы не используете axios напрямую, а создаете новый экземпляр axios.

      // api/index.js

const api = axios.create({
  baseURL: '/api/',
  timeout: 2500,
  headers: { Accept: 'application/json' },
});
export default api;

Answer 5

Согласно совету Джеймса М., я обновил свой api/index.js, не используя axios.create...

API / index.js

import http from 'axios'

export default {

  fetchShoppingLists: () => {
    console.log('API FETCH SHOPPINGLISTS')
    return http
      .get('http://localhost:3000/shoppinglists')
      .then(response => {
        return response
      })
      .catch(error => {
        console.log('FETCH ERROR: ', error)
      })
  }
}