尝试使用 Chai 和 Mocha 测试遗留 jQuery 插件时未定义 jQuery答案

【问题标题】：jQuery is not defined when trying to test legacy jQuery plugin using Chai & Mocha尝试使用 Chai 和 Mocha 测试遗留 jQuery 插件时未定义 jQuery
【发布时间】：2017-09-19 09:09:35
【问题描述】：

我正在尝试为旧的 jQuery 插件编写单元测试。我是现代 Javascript 环境中的新手。我已经尝试为使用 browserify 的 React 创建单元测试以在生产中进行部署。

旧版 jQuery 插件文件如下所示

(function($) {
    $.fn.myLegacyPlugin = function() {
        alert('Hello World!');
    };
})(jQuery);

此文件将上传到 S3 并通过 CDN 访问。 jQuery 将包含在普通浏览器的 head 标记中。

测试文件如下。

let expect = require('chai').expect;
let path = require('path');
let $ = require('jquery');

require('../src/plugin.js');

describe('plugin', () => {
    it('should return okay', () => {
        expect(true).to.be.true; //TODO
    });
});

问题是当我尝试执行测试时，运行器显示jQuery is not defined。在不修改旧版 jQuery 插件的情况下，如何测试插件？

代码在这里https://github.com/petrabarus/js-test-jquery-legacy

【问题讨论】：

标签： javascript jquery unit-testing mocha.js chai

【解决方案1】：

在尝试了几种可能性之后，我可以使用读取文件并评估脚本内容，而不是使用模块导入。

只改变

require('../src/plugin.js');

到这里

eval(fs.readFileSync(path.join(__dirname, '../src') + '/plugin.js', 'utf8'));

这样我就不用修改旧文件了。

【讨论】：

【解决方案2】：

您可能需要将 jquery 作为“$”并将其作为“jQuery”传递给插件。尽管 jquery 应该使用两个名称来定义，但无论如何。您可以尝试像这样要求 jquery：

let jQuery= require('jquery');

答案 2：实际上，如果您的代码（插件）依赖于 jquery，那么您的 plugin.js 应该在加载之前需要 jquery..

所以把 plugin.js 改成

let $ = require('jquery');
// rest of plugin code...

【讨论】：