如何在反应中测试连接组件内的功能？

Question

我有一个连接到商店的组件。 我必须在react组件中测试一个函数。 我怎样才能达到这个功能？

例如：

var newReactComponent = React.createClass({
    functionToBeTested: function(){
        this.props.actions.fetchAll();
    }
});
var mapStateToProps = function (state) {
        return {
            cars: state.carReducer.cars
        }
    };

    var mapDispatchToProps = function (dispatch) {
        return {
            actions: bindActionCreators(_.assign({}, carActions, apiActions), dispatch)
        }
    };

    module.exports = connect(mapStateToProps, mapDispatchToProps)(newReactComponent);
`

Answer 1

您可以模拟connect函数以返回所需的对象，以便您可以在测试环境中访问它们。

这样，您将能够访问newReactComponent，然后您可以安装反应组件（使用浅的酶）。

安装后，您将能够访问类方法。

像这样的东西：

 const actions = {fetchAll: jest.fn()} const wrapper = shallow(<newReactComponent actions={actions} />); wrapper.instance().functionToBeTested(); expect(actions.fetchAll).toBeCalled(); 

我在这里回答了类似的问题