如何用 Jest Vuejs 模拟 window.location.href？

Question

目前，我正在为我的项目实施单元测试，并且有一个文件包含 window.location.href 。

我想模拟这个来测试，这是我的示例代码：

 it("method A should work correctly", () => {
      const url = "http://dummy.com";
      Object.defineProperty(window.location, "href", {
        value: url,
        writable: true
      });
      const data = {
        id: "123",
        name: null
      };
      window.location.href = url;
      wrapper.vm.methodA(data);
      expect(window.location.href).toEqual(url);
    });

但我得到这个错误：

 TypeError: Cannot redefine property: href
        at Function.defineProperty (<anonymous>)

我尝试了一些解决方案，但没有解决。我需要一些提示来帮助我摆脱这个麻烦。请帮忙。

原文由 Tran Son Hoang 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

你可以试试：

 global.window = Object.create(window);
const url = "http://dummy.com";
Object.defineProperty(window, 'location', {
  value: {
    href: url
  }
});
expect(window.location.href).toEqual(url);

查看该问题的 Jest Issue：

开玩笑的问题

原文由 mava 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

2020 更新

---

基本的

URL 对象 与 Location 对象 有很多相同的功能。换句话说，它包括诸如 pathname 、 search 、 hostname 等属性。所以对于大多数情况，您可以执行以下操作：

 delete window.location
window.location = new URL('https://www.example.com')

先进的

您还可以模拟您可能需要的 Location 方法，这些方法在 URL 接口上不存在：

 const location = new URL('https://www.example.com')
location.assign = jest.fn()
location.replace = jest.fn()
location.reload = jest.fn()

delete window.location
window.location = location

原文由 jabacchetta 发布，翻译遵循 CC BY-SA 4.0 许可协议