Javascript 使用Sinon对window.location.href进行存根

我正在尝试测试一些客户端代码，为此我需要使用Mocha/Sinon存根

window.location.href

属性的值

到目前为止我所做的尝试（）：

运行程序显示以下错误：

TypeError:自定义存根应该是函数或属性描述符

将测试代码更改为：

describe('Logger', () => {
    it('should compose a Log', () => {
        var stub = sinon.stub(window.location, 'href', {
            value: 'foo'
        });
    });
});

这会产生以下错误：

TypeError:尝试将字符串属性href包装为函数

将函数作为第三个参数传递给

sinon.stub

也不起作用

---

有没有办法提供假的

window.location.href

字符串，同时避免重定向（因为我正在浏览器中测试）？

存根不能替换属性，只能替换函数

抛出的错误强化了这一点：

TypeError:自定义存根应该是函数或属性描述符

从文件中：

何时使用存根

如果要执行以下操作，请使用存根：

通过测试控制方法的行为，以强制代码沿着特定路径运行。示例包括强制方法抛出错误以测试错误处理

当您想要阻止直接调用特定方法时（可能是因为它触发了不希望的行为，例如XMLHttpRequest或类似的行为）

---

可能的解决办法 虽然许多内置对象可以被替换（用于测试），但有些不能。对于这些属性，您可以创建外观对象，然后必须在代码中使用这些对象，并能够在测试中替换它们

例如：

var loc = {

    setLocationHref: function(newHref) {
        window.location.href = newHref;
    },

    getLocationHref: function() {
        return window.location.href;
    }

};

用法：

loc.setLocationHref('http://acme.com');

然后，您可以在测试中编写

var stub = sinon.stub(loc, 'setLocationHref').returns('http://www.foo.com');

请注意链接的

returns（）

调用。代码中还有一个错误：第三个参数必须是函数，而不是其他类型的值。这是一个回调，而不是属性应该返回的内容

---

使用

window.location.assign（url）

而不是覆盖

window.location

的值。然后您可以在

窗口的
位置
对象上存根
赋值
方法



更新：我在一个无头浏览器中测试了这个，但是如果你在Chrome中运行测试，它可能不起作用。请参阅。
您需要使用
global
在每次
或
之前在
中模拟
窗口
对象进行测试

e、 g

谢谢@try catch finally您的答案确实是正确的，我也这样做了标记，但不幸的是，我需要测试一些行为直接依赖于
window.location.href
value的代码。由于我正在使用Mocha html runner在浏览器中进行测试，是否有任何方法可以为
window.location.href
创建一个值，使测试代码可以访问该值，没有浏览器跟随URL？不幸的是没有。但我想到的另一个黑客是：配置下面的web服务器以返回任何路径的测试套件运行程序，并使测试框架不断地将结果保存到本地存储中，并在页面加载时重新加载（重定向）。当然，您不应该重定向到“foo.com”，而是“/foo/dir”。请在Stackoverflow中搜索有关此主题的类似问题，如果找不到答案，请提出另一个问题（写得和这一个一样清楚：）。我们经常给Sinon问题跟踪器上的人员提供的另一个选择是在客户代码中为全局设置一个现成的外观层，例如
包装
，然后去掉它的方法。实现了同样的目标。这一点解释得很糟糕。有人能编辑一下这篇文章，并给出一个真正的解释，说明这意味着什么以及如何做到这一点吗。要详细说明他的响应，请将客户端代码更改为将
window.location=url
替换为
window.location.assign（url）
。然后，您可以像这样存根
location
对象的
assign
方法：
var stub=sinon.stub（window.location，'assign'）
这个答案是错误的。您无法重新分配（存根）
location.assign
，至少在Chrome中a
window.location.assign=function（）{console.log（“meh”）；}
无效。调用
location.assign（）
I get
Uncaught TypeError:未能在“location”上执行“assign”：需要1个参数，但只存在0个。
（这表示本机方法抱怨缺少参数）。感谢您的更正。我只在一个无头浏览器中尝试过这个，它对我很有效。但是如果你在Chrome这样的浏览器中运行mocha测试，那么这个方法就不起作用了。我喜欢这个解决方案，因为它非常简单，通常可以完成任务。其他选项适用于更复杂的需求。我也是，我非常高兴您发现它很有用。如果我错了，请更正我，但覆盖全局对象将贯穿到您的其余测试文件，对吗？这意味着它将被任何其他测试用例覆盖。可能不是问题，但仅供参考。@perry为了解决这个问题，在测试开始时，我保存了全局对象
const originalWindow=global.window
，然后在测试结束时，我将其还原为
global.window=originalWindow
。我不确定这对你们有什么作用，因为我收到一个错误，说不能分配给读取只有财产。
var stub = sinon.stub(loc, 'setLocationHref').returns('http://www.foo.com');

it('should compose a Log', () => {
   global.window = {
       location: {
           href: {
               value: 'foo'
           }
       }
   }
  //.... call the funciton 
});