Я использую Jest + Enzyme для тестирования приложения React / Redux и хочу сделать интеграционный тест, который проверяет тип действия «обновить элемент» для элемента в корзине. Проблема в том, что как только я монтирую CartItem
компонент с помощью Enzyme, я не могу получить доступ к переданному хранилищу во вспомогательных функциях, которые импортированы в CartItem
компонент. Причина в том, что эти помощники импортируют основной магазин, используемый в реальном приложении, а не этот поддельный, который передается в функцию монтирования.
Я пытался смонтировать целое приложение, которое использует то же хранилище, переданное провайдеру в index.js, но я понял, что это неправильный способ сделать это, поэтому вместо этого я пытаюсь изолировать CartItem
компонент с переданным издевались над магазином в тестовых целях.
В тестовом файле я инициализирую хранилище в функции beforeEach()
, например:
beforeEach(()=>{
...
store = createStore(reducers, state, applyMiddleware(thunk));
})
Затем компонент монтируется так:
it('should update item', async () => {
...
const wrapper = mount(<Provider store={store}><CartItem>
</CartItem></Provider>);
...
});
Проблема заключается в помощниках, импортированных в компоненте CartItem
, например. formatPrice
функция:
...
import Store from 'store'
...
export function formatPrice(amount, productCountry = null){
const exponent = Store.getState().auth.user.user_setting.currency.exponent;
let price = parseFloat(amount);
let roundedPrice = parseFloat(price.toFixed(exponent)).toLocaleString('en', {minimumFractionDigits: exponent, maximumFractionDigits: exponent}).replace(/,/g , "");
return roundedPrice;
}
тест завершается сбоем, очевидно, в Store.getState(
) при попытке доступа к данным в хранилище, которые не инициализированы с тем же состоянием, что и компонент. Я хотел бы смонтировать компонент со всеми включениями (помощники, другие функции, обращающиеся к хранилищу), используя тот же издевательский магазин. Есть ли какое-либо решение для достижения этой цели?