Reactjs 如何通过酶测试反应性redux成分？

我必须做一些简单的酶反应测试。我想检查组件是否被渲染

import React from 'react';
import { shallow } from 'enzyme';
import ConnSearch from './ConnSearch';

it('renders without errors', () => {
    const component = shallow(<ConnSearch />);
    console.log(component.debug());
});

从“React”导入React；
从“酶”导入{shall}；
从“/ConnSearch”导入ConnSearch；
它（'无错误呈现'，（）=>{
常量分量=浅（）；
log（component.debug（））；
});

我有结果：在“连接（ConnSearch）”上下文中找不到“存储”。将根组件包装在中，或将自定义React上下文提供程序传递给 在连接选项中查找相应的要连接的React上下文使用者（ConnSearch）

我的搜索组件：

import React, { Component } from 'react';
import {fetchRoadDetails, fetchUserPoints} from "../../actions";
import {connect} from "react-redux";
import RoadTable from "../../components/RoadTable/RoadTable";
import RoadForm from "../../components/RoadTable/RoadForm";
import style from './ConnSearch.module.scss'
import {getPoints} from "../../reducers";

class ConnSearch extends Component {
    constructor(props){
        super(props);
        this.state = {

        };
    }
    componentDidMount() {
        this.props.fetchUserPoints(this.props.userLogin);
    }


    render() {

        return (
            <div className={style.wrapper}>
                <RoadForm />
                <div className={style.tableWrapper} >
                <RoadTable/>
                </div>
            </div>
        );
    }
}

const mapDispatchToProps=dispatch=>({
    fetchRoadDetails:()=>dispatch(fetchRoadDetails()),
    fetchUserPoints:(user)=>dispatch(fetchUserPoints(user)),
});

const mapStateToProps = (state) => {
    return {
        roads: state.road,
        points:getPoints(state),
        userLogin: state.userLogin,
    };
};


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

import React，{Component}来自'React'；
从“../../actions”导入{fetchRoadDetails，fetchUserPoints}；
从“react redux”导入{connect}；
从“../../components/RoadTable/RoadTable”导入路床；
从“../../components/RoadTable/RoadForm”导入道路模型；
从“./ConnSearch.module.scss”导入样式
从“../../reducers”导入{getPoints}”；
类搜索扩展组件{
建造师（道具）{
超级（道具）；
此.state={
};
}
componentDidMount（）{
this.props.fetchUserPoints（this.props.userLogin）；
}
render（）{
返回(
);
}
}
const mapDispatchToProps=调度=>({
fetchRoadDetails:（）=>调度（fetchRoadDetails（）），
fetchUserPoints：（用户）=>dispatch（fetchUserPoints（用户）），
});
常量mapStateToProps=（状态）=>{
返回{
道路：国道，
点：获取点（状态），
userLogin:state.userLogin，
};
};
导出默认连接（MapStateTrops、mapDispatchToProps）（ConnSearch）；

---

我怎么做这个测试？我以前从未这样做过。

不幸的是，当我将其包装到提供程序中时：

it('renders without errors', () => {
    const component = shallow( <Provider store={store}><ConnSearch/></Provider>);
    console.log(component.debug());

});

it（'无错误呈现'，（）=>{
常量分量=浅（）；
log（component.debug（））；
});

我明白了：

  console.log src/views/ConnectionSearch/ConnSearch.test.js:11
    <ContextProvider value={{...}}>
      <Connect(ConnSearch) />
    </ContextProvider>

console.log src/views/ConnectionSearch/ConnSearch.test.js:11

---

我需要ConnSearch渲染结构。

如果您正在测试连接的组件，您需要在测试中将其包装到提供程序中，例如…@jonrsharpe是的，非常感谢！