Как проверить обернутый компонент ферментом?

Question

Мои компоненты React обернуты разными HOC (i18next, graphql и т. Д.), К сожалению, я не могу проверить свои обернутые компоненты ферментом.

Какова ваша лучшая практика для проверки ваших обернутых компонентов?

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

Спасибо, что читаете меня!

Answer 1

Я предпочитаю использовать тот же подход, что и Redux для connect, и сделать фактический компонент доступным в качестве статического для экспортируемого компонента.

const MyComponent = (props) => ( ... );

const ConnectedComponent = usingMyHoc(...)(MyComponent) ;
ConnectedComponent.WrappedComponent = MyComponent;

export default ConnectedComponent;

Answer 2

Я согласен, что экспорт развернутых компонентов кажется неестественным - вы хотите точно протестировать свои компоненты, как они используются в производстве.

Мой предпочтительный метод - создание функции рендеринга для использования в тестировании:

function renderWithProviders(componentTree, options = {}) {
    const {initialState} = options;
    const store = initializeStore(initialState);
    return {
        ...render(
    <Provider store={store}>
        <SnackbarProvider>{componentTree}</SnackbarProvider>
    </Provider>
    )};
}