Как протестировать компонент, который демонтируется сразу после монтирования, с помощью библиотеки React Testing?
Я пытаюсь использовать React Testing Library, т.е. не использовать поверхностный рендеринг, но я не уверен, как (или если это возможно) сделать это для этой ситуации.
у меня есть Parent
компонент с 2 детьми. initialMount
поставляется Redux:
const Parent = ({ initialMount )} = () => {
if (initialMount) {
return <ChildOne />
} else {
return <ChildTwo />
}
}
Когда приложение загружается initialMount
является true
так ChildOne
возвращается Это читает URL и на основе значения отправляет некоторые действия Redux. Один из этих наборов действий initialMount
ложно, что вызывает ChildOne
демонтировать и ChildTwo
возвращается Parent
вместо.
Мне нужно проверить, что правильный ребенок возвращается на основе значения initialMount
Если я использую неглубокий рендер Enyzme для Parent
без Redux и издеваться appInitMount
значение, то это довольно легко проверить:
test("Shalow render appInitMount=true", () => {
const wrapper = shallow(<ChooseIndex appInitMount={true} />);
console.log(wrapper.debug());
// Will show ChildOne is returned
});
test("Shalow render appInitMount=false", () => {
const wrapper = shallow(<ChooseIndex appInitMount={false} />);
console.log(wrapper.debug());
// Will show ChildTwo is returned
});
Однако я использую React Testing Library, так как хочу избежать поверхностного рендеринга. Поэтому мне нужно пройти тестирование в моем магазине Redux:
test("Full render", () => {
const wrapper = render(
<Provider store={store}>
<Parent />
</Provider>
);
wrapper.debug();
});
Отладка показывает, что ChildTwo
возвращается Я думаю, что это на самом деле правильное поведение, так как ChildOne
сначала возвращается, он отправляет действия, затем отключается и ChildTwo
возвращается вместо. Но как я могу это проверить?
Можете ли вы перехватить действие Redux, чтобы остановить appInitMount
быть измененным?