ax ios -mock-адаптер onGet данные макета не эффективны - PullRequest
Новая
       4

ax ios -mock-адаптер onGet данные макета не эффективны

0 голосов
/ 17 апреля 2020

Я пытаюсь проверить топор ios вызов с помощью топора ios -mock-adapter. Я столкнулся со следующей проблемой: вызовы API из теста всегда реагируют на реальные данные, а не на мой поддельный с mock.onGet. ak всегда получал действия от реального вызова API, но не ожидаемые действия, которые издевались над mock.onGet. Вот код действия (searchAction. js): 

import { SEARCH_PHOTOS, FEATURED_PHOTOS } from './types';
import axiosInstence from '../apis/axiosInstence';

export const searchPhotos = (term) => (dispatch) => {
  dispatch({ type: 'SEACH_REQUEST' });

  return axiosInstence.get('/search/photos', {
    params: {
      query: term,
      page: 1
    }
  }).then(response => {
    dispatch({
      type: 'SEARCH_PHOTOS',
      payload: response.data
    });
  }).catch(error => {
    dispatch({ type: 'SEACH_FAILURE' });
  });
}

И мой тест выглядит так (searchAction.test. js): 

import axios from 'axios';
import MockAdapter from 'axios-mock-adapter';
import thunk from 'redux-thunk';
import configureMockStore from 'redux-mock-store';
import { searchPhotos } from '../searchAction';

const mock = new MockAdapter(axios);

const middlewares = [thunk];
const mockStore = configureMockStore(middlewares);
const term = 'cars';
const store = mockStore({});

describe('actions', () => {
  beforeEach(() => {
    mock.reset();
    store.clearActions();
  });

  it('Should create an action to signIn with a fake user', async () => {
    const expectedActions = [{
      type: 'SEACH_REQUEST'
    }, {
      type: 'SEARCH_PHOTOS',
      payload: []
    }];

    mock.onGet('/search/photos', {
      params: { term: 'cars' }
    }).reply(200, expectedActions);

    await store.dispatch(searchPhotos(term))
      .then(data => {
        const receivedActions = store.getActions();
        expect(receivedActions).toEqual(expectedActions);
      });
  });
});

Кто-нибудь испытал похожая проблема или может дать мне несколько советов. Спасибо в адвенсе.

1 Ответ

0 голосов
/ 17 апреля 2020

В вашем коде есть несколько проблем:

Сначала , в создателе действий вы используете экземпляр ios для выполнения вызова ajax, но в тест, который вы не предоставляете этому экземпляру axios-mock-adapter. Вы должны предоставить свой экземпляр ax ios в своем тесте при создании экземпляра MockAdapter.

Second , свойства params, которое вы предоставляете для ax ios mock в методе onGet не соответствует параметрам, которые отправляются в операции get в вашем создателе действий. Вы должны сопоставить параметры в вызове с их значениями. Таким образом, вы должны предоставить query и page params.

Last , вы возвращаете expectedActions в ложном запросе, но это не кажется правильным. Глядя на ваш код, кажется, что вы хотите вернуть пустой массив.

Учитывая все это, ваш код будет выглядеть так: 

import MockAdapter from 'axios-mock-adapter';
import thunk from 'redux-thunk';
import configureMockStore from 'redux-mock-store';

import axiosInstence from '../../apis/axiosInstence';
import { searchPhotos } from '../searchAction';

const mock = new MockAdapter(axiosInstence);

const middlewares = [thunk];
const mockStore = configureMockStore(middlewares);
const term = 'cars';
const store = mockStore({});

describe('actions', () => {
    beforeEach(() => {
        mock.reset();
        store.clearActions();
    });

    it('Should create an action to signIn with a fake user', async () => {
        const expectedActions = [{
            type: 'SEACH_REQUEST'
        }, {
            type: 'SEARCH_PHOTOS',
            payload: []
        }];

        mock.onGet('/search/photos', {
            params: {
                query: 'cars',
                page: 1
            }
        }).reply(200, []);

        const data = await store.dispatch(searchPhotos(term));
        const receivedActions = store.getActions();
        expect(receivedActions).toEqual(expectedActions);
    });
});
...