У меня есть компонент React, где некоторые данные выбираются по HTTP во время componentWillMount
.Это делается почти так же, как объяснено здесь с использованием промежуточного программного обеспечения Redux Thunk .Запрос выполняется с axios .Поэтому изначально устанавливается состояние loading
и данные устанавливаются, как только возвращается запрос.
class SomeComponent extends Component {
//...
componentWillMount() {
store.dispatch(fetchInitialData())
}
// ...
}
Действие, выполняющее выборку:
export function fetchInitialData() {
return dispatch => {
return axios.get('https://our.api')
.then(res => {
dispatch(handleSuccess(res.data));
})
.catch(error => dispatch(handleError(error)));
}
}
Тест записанс помощью Jest и Enzyme, а axios осмеивается с помощью axios-mock-adapter .
import Enzyme, { mount } from 'enzyme'
import Adapter from 'enzyme-adapter-react-16'
import configureMockStore from 'redux-mock-store'
import Campaigns from './campaigns'
import axios from 'axios'
import MockAdapter from 'axios-mock-adapter'
import thunk from 'redux-thunk'
import response from 'testdata/api/response.json'
Enzyme.configure({
adapter: new Adapter()
});
function createMockStore() {
const mockStore = configureMockStore([thunk]);
return mockStore({});
}
describe('some component', () => {
it('should render ...', () => {
const mock = new MockAdapter(axios);
mock.onGet('/our.api').reply(200, response);
const store = createMockStore();
const enzymeWrapper = mount(<SomeComponent store={store}/>);
console.log('enzymeWrapper', enzymeWrapper.html());
});
});
Проблема состоит в том, что HTML-код enzymeWrapper
всегда содержит только представление начального состояния.Исходный HTML никогда не изменяется в соответствии с новым состоянием из ответа.Когда я добавляю логирование в редукторы и сервисы, я вижу, что макетированные запросы выполняются, и состояние заполняется фиктивным ответом.Но компонент не выполняет повторную визуализацию с новыми данными состояния.
Я хочу отметить, что это только проблема в тесте.В реальном приложении все работает нормально.
Мне кажется, что мне нужно как-то подождать, пока изменения состояния не будут применены.Но я не знаю как.