如何使用 NodeUnit 测试客户端代码

How to test client-side code with NodeUnit

本文关键字:客户端 代码 测试 NodeUnit 何使用      更新时间:2023-09-26

这是我上一个问题的后续。

假设我正在使用calculate函数编写calculate.js源文件,以便在客户端代码中使用它:

函数计算(数字) {    返回数字 * 2;}

现在我想测试一下。

我正在使用本文中所述的nodeunit导出calculate函数(以便测试可以调用它)。

函数计算(数字) {    返回数字 * 2;}export.compute = compute//Node.js的东西。它不会在浏览器中运行!

nodeunit测试运行正常,但我不能再在我的 Web 应用程序中使用 calculate.js,因为它使用 exports .

现在看起来是一个陷阱。我可以解决这个问题吗?

使用非 Node.js 测试框架,如 jasminebdd 或 jstestdriver。

在浏览器中运行测试

如果您希望为测试套件使用 CommonJS 格式(使用导出),由您来定义 CommonJS 工具浏览器。有许多替代方案,它很重要使用您现有的代码,这就是为什么 nodeUnit 目前没有开箱即用。

我认为你应该看看 浏览器 来完成这个。

浏览器化

使用服务器端构建使 Node.js样式的 require() 在浏览器中工作步,仿佛变魔术!

摩卡

Mocha 是一个简单、灵活、有趣的 Node JavaScript 测试框架.js和浏览器。

我想你应该看看我非常喜欢的TJ(Express.js作者)创建的摩卡(比我过去使用的nodeunit更好)。使用摩卡,您可以轻松进行代码覆盖,监视模式,通知,并且作为一大优势,摩卡可以更好地维护。

Karma runner 有一个 nodeunit 适配器,可以在浏览器和 PhantomJS 中运行节点单元测试。下面是一个示例测试入口点和 Gruntfile 使用 Browserify 运行用 CommonJS 模块编写的测试(导出)。

nodeunit-browser-tap + Testling 是另一个选项,如果你是在 nodeunit 上设置的。

  • Testling npm 包获取在本地浏览器中运行的测试的命令行输出。
  • 如果您在 GitHub 上托管,Testling.com 可以为您提供免费的跨浏览器 CI。
  • 浏览器点击包装器为您提供 Testling 理解的节点单元输出。

实际上,您可以在nodeunit本身中测试隔离的jQuery逻辑。例如,以下是我为日期选择器库编写的一些测试:

/* jshint evil:true */
/* global module, require, DatePair */
var fs = require('fs');
// Some of the plugins use a jQuery variable instead of $
var jQuery = require('jquery');
var $ = jQuery;
// Recreate window and document
var window = { jQuery: jQuery };
var document = window;
// The file is included here:
eval(fs.readFileSync('../lib/js/jquery/plugins/jquery.cookie.js') + '');
eval(fs.readFileSync('../lib/js/jquery.timepicker/jquery.timepicker.js') + '');
eval(fs.readFileSync('../lib/js/bootstrap/bootstrap-datepicker.js') + '');
eval(fs.readFileSync('../homepage/js/datepair.js') + '');
// Initialize DatePair Object
var datePair = DatePair(new Date(), {
    dateStart: $('<input type="text" autocomplete="off">'),
    dateEnd: $('<input type="text" autocomplete="off">'),
    timeStart: $('<input type="text" autocomplete="off">'),
    timeEnd: $('<input type="text" autocomplete="off">')
});
module.exports = {
    'Time Delta Var Is 1 hour' : function (test) {
        test.equal(datePair.getTimeDelta(), 3600);
        test.done();
    },
    'Change Date And Check For 1 Hour Difference' : function (test) {
        datePair.startTime.val("10:00pm").change();
        test.equal(datePair.endTime.val(), "11:00pm");
        test.done();
    },
    'Make End Date Move Up One Day' : function (test) {
        var expectedEndDates = [1];
        datePair.startTime.val("11:00pm").change();
        expectedEndDates.push(parseInt(datePair.startDate.val().split("/")[1], 10) + 1);
        test.ok($.inArray(parseInt(datePair.endDate.val().split("/")[1], 10), expectedEndDates) !== -1);
        test.equal(datePair.endTime.val(), "12:00am");
        test.done();
    },
    'Change To 11:30pm Of Previous Day' : function (test) {
        // Move startTime 1 Day Forward
        datePair.startTime.val("11:00pm").change();
        // Move EndDate 1 Day Backwards
        datePair.endTime.val("11:30pm").change();
        test.equal(datePair.endDate.val(), datePair.startDate.val());
        test.done();
    }
}

在此处查看完整的代码 + 库:https://github.com/keithhackbarth/jquery-datetime-picker