Фермент мелкий - это компонент рендеринга без соответствующего маршрута (React Router V5) - PullRequest
Новая
       13

Фермент мелкий - это компонент рендеринга без соответствующего маршрута (React Router V5)

0 голосов
/ 13 февраля 2020

Я пытаюсь справиться с несколькими строками кода без успеха. Это ситуация:

У меня есть GVRouteModal, который представляет собой компонент, который отображает модальное значение в приложении на основе маршрута, указанного в качестве опоры для компонента.

Я пытаюсь реализовать тест для убедитесь, что модальное изображение не отображается, если текущий маршрут не соответствует опоре пути в компоненте.

Вот код GVRouteModal: 

export const GVRouteModal: FC<Readonly<GVRouteModalProps>> = (props) => {
const { path, children, ...restProps } = props;

if (!path.startsWith("/")) {
    throw new Error("El que se proporciona debe comenzar con '/'");
}

return (
    <Route exact path={path} render={(routeProps): ReactNode => <GVModal isOpen {...routeProps} {...restProps}>{children}</GVModal> }/>
);

export default GVRouteModal;

Тестовый код с помощью Jest + Enzyme: 

const path = "/modal";
const nonValidPath = "/otra-ruta";
const title = "Titulo Modal";
const modalBody = <p>Content Body</p>;
const disposeModal = jest.fn();

it("Debe no renderizarse la modal al no coincidir la ruta actual con la proporcionada", () => {
    wrapper = shallow<GVModalProps>(
        <MemoryRouter initialEntries={[nonValidPath]}>
            <GVRouteModal path={path} disposeModal={disposeModal} title={title}>
                {modalBody}
            </GVRouteModal>
        </MemoryRouter>
    );
    expect(wrapper.find(GVRouteModal)).toMatchSnapshot();
});

Когда я запускаю тест, это снимок, который я получаю 

<Component
  disposeModal={[MockFunction]}
  path="/modal"
  title="Titulo Modal"
>
  <p>
    Content Body
  </p>
</Component>
`;

Как видите, <p>Content Body</p> отображается и не должен.

Справка пожалуйста

...