jQuery 未定义使用 mocha 来测试 wordpress javascript

Question

我已设置 mocha 以在终端中运行测试。它适用于expect(1).to.equal(1) 等基本测试。我遇到的问题是我的脚本像jQuery( function( $ ) { // my code here }); 一样包装在jQuery 中，并且在运行测试时出现错误。

evalmachine.<anonymous>:15
jQuery( function ( $ ) {
^

ReferenceError: jQuery is not defined
at evalmachine.<anonymous>:15:1
at Object.exports.runInThisContext (vm.js:54:17)
at Suite.<anonymous> (/Users/grahamlutz/Documents/BBC/poolproof/test/test.js:21:8)
at context.describe.context.context (/usr/local/lib/node_modules/mocha/lib/interfaces/bdd.js:47:10)
at Object.<anonymous> (/Users/grahamlutz/Documents/BBC/poolproof/test/test.js:8:1)
at Module._compile (module.js:413:34)
at Object.Module._extensions..js (module.js:422:10)
at Module.load (module.js:357:32)
at Function.Module._load (module.js:314:12)
at Module.require (module.js:367:17)
at require (internal/module.js:16:19)
at /usr/local/lib/node_modules/mocha/lib/mocha.js:220:27
at Array.forEach (native)
at Mocha.loadFiles (/usr/local/lib/node_modules/mocha/lib/mocha.js:217:14)
at Mocha.run (/usr/local/lib/node_modules/mocha/lib/mocha.js:469:10)
at Object.<anonymous> (/usr/local/lib/node_modules/mocha/bin/_mocha:404:18)
at Module._compile (module.js:413:34)
at Object.Module._extensions..js (module.js:422:10)
at Module.load (module.js:357:32)
at Function.Module._load (module.js:314:12)
at Function.Module.runMain (module.js:447:10)
at startup (node.js:141:18)
at node.js:933:3

我的 test.js 看起来像这样：

var assert = require('assert');
var chai = require('chai');
var expect = chai.expect;
var fs = require('fs');
var vm = require('vm');
var jsdom = require('mocha-jsdom'); 

describe('mocha tests', function () {

jsdom();

before(function () {
    $ = require('jquery');
});

var path = __dirname + '/../wp-content/themes/bb-theme-child/myscript.js';
var code = fs.readFileSync(path);
vm.runInThisContext(code);

describe('getSession', function() {
    it('should return the empty string because it fails', function () {
        applyCoupon();
    });
});
});

我的问题是为什么 jQuery 未定义或者我做了什么不正确的假设？我是否需要改变在 wordpress 设置中测试 javascript 的想法？

Answer 1

以下两行对我有用。为方便起见，我只是将它们放在我的 mocha 测试文件的顶部。根据 mocha-jsdom github 自述文件中的建议，我使用了“jsdom-global”包而不是“mocha-jsdom”。 https://github.com/rstacruz/jsdom-global

this.jsdom = require('jsdom-global')()
global.$ = global.jQuery = require('jquery');

Answer 2

您必须自己将$ 和jQuery 导出到全局空间：

before(function () {
    global.$ = global.jQuery = require('jquery');
});

如果您阅读 mocha-jsdom 的文档，您会发现它放入了全局空格符号，例如 window 和 document。当您加载jquery 时，它会找到window 并将其自身添加为window.$。在浏览器中，这也使$在全局空间中可见，因为window是全局空间。然而，在 Node 中，全局空间是 global，因此您必须自己将 $ 放入其中。