Question

有许多很棒的博客（如Kumar's use of Sinon）解释了Sinon如何存根jquery。

然而，在Kumar和其他人的特定博客中，有一个简单的jquery（npm）要求：

var $ = require('jquery');

但是jquery存在于浏览器中，需要一个窗口句柄。安装jsdom（加上用于处理依赖关系的python）并正确设置jquery（否则 $ 变量上没有ajax方法等）：

var jsdom = require('jsdom')
var $ = require('jquery')(jsdom.jsdom().defaultView);

这是存根jquery的唯一方法吗？ jsdom很棒，但安装python的额外（尽管很简单）捕获会破坏我的自动“测试”并在构建服务器上涉及一堆额外的配置。没有什么不可能或者很难想知道为什么人们在使用Sinon运行测试（通过Mocha）的jquery中需要访问窗口才能工作？

有人以另一种方式攻击问题以存根jquery吗？

Answer 1

我目前正在开发一个涉及jsdom，mocha和sinon的测试套件，用于客户端javascript（实际上是coffeescript，但你的问题是在JS中）。我通过让jsdom加载它来解决需要jQuery的问题。请注意，我没有测试下面的内容，但它基于我自己的设置。代替下面的'path/to/jquery'，我实际上加载了一个连接的JS文件，其中包含所有外部依赖项和我的整个应用程序代码。以下示例来自我的spec_helper文件，该文件是mocha运行的第一个文件。

var jsdom = require('jsdom');
var sinon = require('sinon');
var _ = require('underscore');
var chai = require('chai');
var expect = chai.expect;
chai.use(require('sinon-chai'));
chai.should();

before(function(next){
  var config = {
    html: '<body></body>',
    scripts: ['path/to/jquery'],
    features: {
      FetchExternalResources: ['script'],
      ProcessExternalResources: ['script']
    },
    // Equivalent to document.ready event, so you know the DOM 
    // has loaded and `jQuery` is available on `window`.
    done: function(error, window) {
      // Exposes everything on `window` to `global` so its available
      // in your test suites
      _(global).defaults(window);

      next();
    }
  };

  // Creates the JSDom instance
  jsdom.env(config);
});

beforeEach(function(){
  this.sandbox = sinon.sandbox.create();
  this.clock = this.sandbox.useFakeTimers();
  this.server = sinon.fakeServer.create();
});

afterEach(function(){
  this.sandbox.restore();
  this.server.restore();
});

我们的想法是让jsdom控制与window有关的任何事情，并在测试中将window公开给global。您现在应该能够像Kumar在您链接到的博客文章中那样存根jQuery。我现在实际上正在努力尝试，所以如果我发现这个或任何变通方法有任何问题，我会在这里发布。目前看来，显然sinon.fakeServer无法与jsdom和mocha一起使用 - 请参阅here - 因此，最好的方法是将ajax方法存根。显然，fakeServer和node是Sinon v2的目标。

希望这有帮助！

诗乃jquery顽固

1 个答案: