单元测试：用酶反应上下文api返回一个空对象

Question

我第一次尝试使用React上下文API将信息从主要组件传递给他的孙子组件。

所以首先我创建了一个上下文

这里是定义上下文的主要组件

父组件不关心上下文，而只是在这里创建大子组件

这是读取上下文的子组件

到目前为止没有问题。一切正常。 ChildComponent已检索到上下文值。

当我尝试用开玩笑/酶测试它时，问题就来了。我无法设置上下文

最后一个期望失败，并且上下文值是一个空对象。所以foo是不确定的

我在这里重新创建了问题： https://codesandbox.io/embed/x25yop4x5w?fontsize=14

谢谢您的帮助

Answer 1

酶context影响旧版React上下文，而不影响现代上下文API。应该用：

mount(<MyContext.Provider value={{foo: 987}}><ChildComponent/></MyContext.Provider>)

并通过以下方式断言：

expect(wrapper.find('h2').text()).toBe('Context value: 987');

Answer 2

我用来测试需要安装在上下文提供者树中的组件的方法是使用wrappingComponent和wrappingComponentProps options for mount。

这可确保mount（根组件）的返回值仍然是您要测试的组件（并且仍支持仅对根组件有效的API /选项，例如setProps）。 / p>

mount(<MyComponent />, {
  wrappingComponent: MyContext.Provider,
  wrappingComponentProps: {
    value: { foo: 987 },
  },
})