@Levin1994

Как тестировать HOC компоненты(enzyme, jest)?

Помогите с тестами для HOC компонента. вот код

import React, { Component } from 'react';
import { object } from 'prop-types';
import { connect } from 'react-redux';

import { getFormSubmitErrors, getFormSyncErrors, getFormMeta } from 'redux-form';

export default formName => WrappedComponent =>
    connect(state => ({
        submitErrors: getFormSubmitErrors(formName)(state),
        syncErrors: getFormSyncErrors(formName)(state),
        meta: getFormMeta(formName)(state),
    }))(
         class WithValidationErrors extends Component {
            static propTypes = {
                meta: object,
                submitErrors: object,
                syncErrors: object,
            };

            static defaultProps = {
                meta: {},
                submitErrors: {},
                syncErrors: {},
            };

            combineErrors({ submitErrors, meta, syncErrors }) {

                const errorsToShow = {};
                const errorKeys = [...Object.keys(submitErrors), ...Object.keys(syncErrors)];

                errorKeys
                    .filter((value, index, arr) => arr.indexOf(value) === index)
                    .forEach(key => {
                        if (!(meta[key] && meta[key].touched && !meta[key].active)) return;

                        if (key in syncErrors) errorsToShow[key] = syncErrors[key];
                        if (key in submitErrors) {
                            if (key in errorsToShow) {
                                errorsToShow[key] += `; ${submitErrors[key]}`;
                            } else {
                                errorsToShow[key] = submitErrors[key];
                            }
                        }
                    });

                return errorsToShow;
            }

            render() {
                const errorsToShow = this.combineErrors(...this.props);

                return <WrappedComponent {...this.props} errorsToShow={errorsToShow} />;
            }
        }
    );
  • Вопрос задан
  • 340 просмотров
Пригласить эксперта
Ответы на вопрос 1
maxfarseer
@maxfarseer
https://maxpfrontend.ru, обучаю реакту и компании
Сначала нужно ответить на вопрос: что именно хочется протестировать.

Мне кажется, можно создать мок-компонент (с помощью jest mock) или взять свой реальный компонент и его обернуть в HOC функцию. Итого - получится "прокачанный компонент" функционал которого, думаю вы и хотите протестировать.
1) снапшот можно сделать
2) протестировать combineErrorsToShow

Более тут я простора для теста не вижу. Connect нет смысла тестировать.

p.s. не думаю, что сильно помог, но может получится поразмышлять в этом направлении и следовательно, что-то написать.
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы