Question

在我构建的应用程序的早期，我按以下方式拆分组件中的Redux表单：

import React, { PropTypes } from 'react';
import { Field, reduxForm } from 'redux-form';
import {renderInput, required, email} from './FormInput';
import SubmitButton from './SubmitButton';

let LoginForm = ({errorMessage, handleSubmit, pristine, submitting}) => {

  return (
    <div>
      <form onSubmit={handleSubmit}>
      ...
      </form>
    </div>
  );
};

LoginForm = reduxForm({
  form: 'loginForm'
})(LoginForm);

export default LoginForm;

问题在于为此进行测试时，我从Enzyme和浅渲染回来的是一个连接组件，其代码如下：

const wrapper = shallow(<LoginForm {...props}/>);

在包装容器上，它只是一个组件调用：

<LoginForm onSubmit={this.handleLogin} />

最终可能会更多地讨论如何使用ES6执行此操作，但不确定。我们对redux-components所做的是双重导出：

export class MyFakeContainer extends React.Component {
    ....
}

export default connect(mapStateToProps, mapDispatchToProps)(MyFakeContainer);

寻找有效如何做到这一点的建议。使用Jest和Enzyme

编写Redux Form组件的单元测试，而不是“连接”＃34;

0 个答案: