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

Question

我对如何在浏览器中全局模拟文件选择器感兴趣。具体来说，我最感兴趣的是在 Firefox 中执行此操作，但更喜欢通用解决方案。

我只关心防止文件选择器对话框出现。我不需要能够断言它确实打开了。问题是我对打开文件选择器的 JavaScript 代码进行了单元测试。当对话框打开时，它停止执行测试套件。

一个示例情况是我正在测试 Backbone.View 的 onRender 方法。该方法呈现一个 subview ，它将在呈现时打开文件选择器。由于我没有直接测试该 subview ，所以当我只对 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模拟/ spy / stub 电话。您可以测试正在进行的调用，而不是实际进行调用。

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