如何使用 Jest 和 Enzyme 测试嵌套道具答案

【问题标题】：How to test nested props using Jest and Enzyme如何使用 Jest 和 Enzyme 测试嵌套道具
【发布时间】：2019-05-01 07:40:57
【问题描述】：

我有一个组件，它的 props 值如下所示：

emailProps = {email: {isOpen: false}};

所以，现在我正在尝试将 isOpen 的值更新为 true 并测试 prop 的值是否已更新。

it('tests after updating isOpen props to true', () => {
    wrapper.setProps({ email:{ isOpen: true} });
});

所以，我看到我们可以将道具测试为：

const wrapper = mount(<MyComponent foo={10} />);
expect(wrapper.props().foo).to.equal(10);

因为，在我的例子中，道具 isOpen 在 email 里面。那么，我该如何测试呢？我试过了：

expect(wrapper.props().email.isOpen).toBe(true);

但它失败了。如何测试嵌套的道具？

【问题讨论】：

看起来不错。您也可以使用expect(wrapper.props().email).toEqual({ isOpen: true} )。由于您的解决方案不起作用，因此肯定有其他问题。也许从调试开始并记录wrapper.props() 以查看其中的实际情况
@AndreasKöberle 我尝试使用 expect(wrapper.props().email).toEqual({isOpen: true}); ，但它给出了错误提示 Expected value to equal: {"isOpen": true} Received: undefined 。

【解决方案1】：

嵌套状态也有类似的问题。我是这样成功的：

it('receives this.state.user.name as a "name" prop', () => {
  expect(header().prop('name')).toEqual(appWrapper.state("user").name);
});

在你的情况下，它看起来像这样：

expect(wrapper.prop('email').isOpen).toBe(true);

【讨论】：