首页 > 解决方案 > 用道具反应测试浅快照问题

问题描述

我在测试周围有一些 HOC 的反应组件时遇到问题。这是这个组件的结尾:

export default withSocket(withServerConfiguration(Component));

我想首先创建它的快照来测试它,所以我这样做了:

const wrapper = (props) =>
    shallow(
        <Provider store={store}>
            <Component{...props} />
        </Provider>
    )
        .dive()
        .dive()
        .dive()
        .dive();

我不得不这样做dive()很多次,因为我必须遍历它周围的所有 HOC 组件才能获得所有 DOM 元素的正确快照。

我是这样做的:

 it("renders correctly without error", () => {
        expect(toJson(wrapper())).toMatchSnapshot();
    });

它工作正常。问题是当我想将道具传递给该组件时。它看起来在某种程度上被 HOC 组件之一覆盖。我正在传递这样的道具:

 const wrapper = shallow(
            <Provider store={store}>
                <Component propName={{ type: 1000 }} />
            </Provider>
        )
            .dive()
            .dive()
            .dive()
            .dive();

但最后我从一个propName值为空的 HOC 组件中得到错误。这里有什么问题?我怎样才能测试这样的组件?也许我应该使用renderer方法或mount

标签: reactjstestingjestjsenzyme

解决方案


推荐阅读