因此,我正在使用Mocha / Chai进行一些测试,而我要测试的项目取决于jQuery。我正在使用jsdom来帮助解决这个问题。从下面的代码中可以看到,我使用WITHIN摩卡测试本身中的jQuery没问题。我似乎无法找到的只是调用使用jQuery的代码。

在浏览器中运行此脚本时,在包含ACE_GA模块之前,脚本标签中包含jQuery,因此jQuery在此处可以完全正常工作。

在检查下面的代码片段时,done()函数内部有两行带有注释。第一行带有注释,仅从ACE_GA模块中调用代码,并且不起作用。第二行带有注释,它是从ACE_GA模块内部(我在第一行中试图调用的)重新创建一些代码,并且工作正常。

需要明确的是,这行工作正常:

var productItems = jQuery("[data-" + ACE_GA.VALID_PRODUCT_FIELDS.prefix + "]");

只是从我尝试调用的模块方法中复制一行,这给我带来了问题:

var productItems = ACE_GA.HELPERS.validateOptions(ACE_GA.VALID_PRODUCT_FIELDS.prefix);

为了能够简单地调用客户端库/模块并使jQuery与之兼容,而不是将模块中的代码片段复制/粘贴到mocha测试中,我需要做什么?

var chai = require("chai");
var jsdom = require("jsdom");
var jQuery = require("jquery");
var fs = require("fs");
var ACE_GA = require("../main");

var bodyContent = fs.readFileSync(__dirname + "/../test/test.html", "utf8", "r");
global.document = jsdom.jsdom(bodyContent);
global.window = document.defaultView;
global.jQuery = jQuery;

describe("ACE_GA.HELPERS.validateOptions", function() {

    it("should select all items with a data-attribute of 'ace-ga-{something}'", function(done) {

        jsdom.env({
            html: bodyContent,
            src: jQuery,
            scripts: "http://www.asite.com/path/to/default/js/jquery-1.11.3.min.js",
            userAgent: "Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/54.0.2840.99 Safari/537.36",
            done: function(err, window) {

                console.log("err", err);
                var jQuery = window.jQuery;

                //var productItems = ACE_GA.HELPERS.validateOptions(ACE_GA.VALID_PRODUCT_FIELDS.prefix);
                /** ^ that won't work and says jQuery requires a window with a document */

                var productItems = jQuery("[data-" + ACE_GA.VALID_PRODUCT_FIELDS.prefix + "]");
                /** ^ that works just fine and is copy/pasted from the non working method I'm trying to call above */

                chai.expect(productItems.length).to.equal(4);
                done();
            }
        });

    });

});


供大家参考,这是我收到的故障错误的确切输出

1) ACE_GA.HELPERS.validateOptions should select all items with a data-attribute of 'ace-ga-{something}':
 Uncaught Error: jQuery requires a window with a document
  at module.exports (C:\Path\To\Project\dev-files\node_modules\jquery\dist\jquery.js:29:12)
  at Object.validateOptions (main.js:144:15)
  at Object.done (test\gaecTest.js:89:39)
  at process.nextTick (C:\Path\To\Project\dev-files\node_modules\jsdom\lib\jsdom.js:320:18)
  at _combinedTickCallback (internal/process/next_tick.js:67:7)
  at process._tickCallback (internal/process/next_tick.js:98:9)


从我所看到的,在包含的模块本身(ACE_GA)中,jQuery出现了问题,因为我希望它可以从该上下文本身(就像在mocha中定义然后调用jQuery()一样好,但在其中定义jQuery()摩卡咖啡,然后从ACE_GA模块内部调用它是不一样的)。

如前所述,在浏览器中运行时,我可以在包含ACE_GA模块之前定义/包含jQuery。

我试图在这里做类似的事情,只是不在浏览器中运行它,而是从带有mocha的节点运行它。

最佳答案

您遇到麻烦的直接原因是您没有正确初始化直接在节点中加载的jQuery实例(与在jsdom实例中加载的实例相反)。

当您执行require('jquery')时,jQuery将检查全局范围内是否存在document。如果是这样,它将自身安装在全局范围内。在浏览器中,结果是将其自身安装为window$并安装在jQuery上。在Node.js中,默认情况下全局范围中没有document。您显示的代码中也是如此。当没有定义document时,从require('jquery')获得的是工厂,您可以从中构建jQuery实例。您必须将Window实例传递给该工厂。

您可以将初始代码更改为:

var chai = require("chai");
var jsdom = require("jsdom");
var makeJQ = require("jquery"); // Load the factory.
var fs = require("fs");

var bodyContent = fs.readFileSync(__dirname + "/../test/test.html", "utf8", "r");
global.document = jsdom.jsdom(bodyContent);
global.window = document.defaultView;
global.$ = global.jQuery = makeJQ(window); // Actually make a jQuery instance.

// Load this after, since it depends on jQuery being in the global space.
var ACE_GA = require("../main");


然后,您应该放弃在测试中使用jsdom创建的第二个窗口,而只使用测试文件开始处设置的第二个窗口。您可以通过在两次测试之间清除DOM树来在测试之间重复使用它。

09-11 19:12
查看更多