你如何在浏览器中模拟文件选择器进行单元测试？

Question

我对如何在浏览器中全局模拟文件选择器感兴趣.具体来说,我最感兴趣的是在Firefox中这样做,但更喜欢一般的解决方案.

我只关心防止文件选择器对话框出现.我不需要断言它确实打开了.问题是我有用于打开文件选择器的JavaScript代码的单元测试.对话框打开时,它会暂停测试套件的执行.

一个示例情况是我正在测试a的onRender方法Backbone.View.该方法呈现子视图,在渲染时将打开文件选择器.由于我没有直接测试该子视图,所以当我只对单元测试该onRender方法的其他部分感兴趣时,我宁愿不模拟其部分行为.

例:

//Test file
it("should do something", function() {
  var view = new App.Views.SomeView();
  spyOn(view.modelBinder, "bind");
  view.render();
  expect(view.modelBinder.bind).toHaveBeenCalled();
});

//View file
onRender : function () {
  this.modelBinder.bind(this.el, this.model);
  this.$("#thing").html(this.subview.render().el); //This line has a side effect that opens file picker
}

本质上,我不想明确地模拟导致文件选择器被打开的行为,因为它不是我在这里测试的兴趣.这样做会使测试套件更加脆弱并且难以维护.

Answer 1

使用sinon来模拟/监视/存根调用。您可以测试正在进行的呼叫，而不是实际进行呼叫。

这样您就可以测试该函数是否已被调用，而无需调用显示对话框的实际函数。