Как протестировать компонент, который демонтируется сразу после монтирования, с помощью библиотеки React Testing? - PullRequest
Новая
       11

Как протестировать компонент, который демонтируется сразу после монтирования, с помощью библиотеки React Testing?

0 голосов
/ 25 октября 2018

Я пытаюсь использовать React Testing Library, то есть не использовать поверхностный рендеринг, но я не уверен, как (или если это возможно) сделать это для этой ситуации.

У меня есть Parent компонент с 2 детьми.initialMount предоставляется Redux: 

const Parent = ({ initialMount )} = () => {
    if (initialMount) {
        return <ChildOne />
    } else {
        return <ChildTwo />
    }
}

Когда приложение загружает initialMount, равно true, поэтому возвращается ChildOne.Это читает URL и на основе значения отправляет некоторые действия Redux.Одно из этих действий устанавливает для initialMount значение false, что приводит к размонтированию 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?

...