如何在React构造函数中使用Jest / Enzyme模拟文档对象？

Question

我正在尝试改善一些看起来像这样的React代码的代码覆盖率：

export default class WuTangClan {
  constructor(props) {
    super(props);
    this.setState(this.getCookie('36chambers'));
  }

  getCookie(name) {
    const value = `;${document.cookie}`;
    const parts = value.split(`; ${name}=`);
    let toReturn;
    if (parts.length === 2) {
      toReturn = parts
        .pop()
        .split(';')
        .shift();
    }
    return toReturn;
  }  
}

这是我苦苦挣扎的codecov作品：

使用酶，如果我要mount(<WuTangClan />)，它将通过getCookie。这是问题-该函数依赖于document，并且因为jest在节点的上下文中运行，所以我似乎无法嘲笑它。意思是，document在Jest测试正在运行时为空，因此无法进入。

我尝试了this post中的所有答案，但无济于事。

开玩笑说“〜22.2.2” 酶“ ^ 2.5.0” 节点“ 8.8.0”

Answer 1

如果您唯一的问题是关于设置cookie，那么您可以按照以下步骤进行操作：

it("should return cookie", () => {
    global.document.cookie = "cookie1=foo"; //set cookies in whatever format you like
    document.cookie = "cookie2=bar";
    let page = shallow(<WuTangClan />);
    
    // run assertions here;
  });