knockout.js - 使用 mocha 进行无头淘汰视图模型测试

Question

我正在尝试对我的淘汰视图模型进行无头测试。我故意避免在我的视图模型中处理任何 ui 结构，并将连接留给 html 页面。

这在 Jasmine 中非常有效，因为它在浏览器中运行，但是当我切换到mocha时，我最终会在淘汰赛的最后一行运行：

})(窗口、文档、导航器);

我已经研究过使用zombiejs，这将是一个不错的选择，但我没有看到一个关于如何在不改变淘汰源本身的情况下使用它的好故事。

关于如何解决这个问题的任何想法？

Answer 1

这也是我目前关注的一个话题。我将在这里倾倒我的发现，希望它们能为您指明正确的方向。

我首先尝试的可能路线是PhantomJS。它是一个无头 WebKit 浏览器，因此它应该具有出色的 DOM、JSON、HTML5 和 CSS 选择器支持（例如，它适用于 jQuery 和 qUnit）。

我选择这个是因为它被 knockout.js 本身使用，我在 knockout.js 存储库中发现了它，其中有一个 .travis.yml 文件和以下注释：

我没有任何证据表明这会奏效，但在 knockout.js 核心中使用它感到鼓舞。我还发现了这个用于淘汰赛/幻影的运行脚本，看起来像是一个很好的启动点。

我还通过 node.js找到了 一些使用 Mocha 和 PhantomJS 的 示例，包括扩展 grunt以在 Phantom 中运行 mocha 的库，以及显示如何在 PhantomJS 中运行 mocha 的脚本。所以这部分是肯定的，至少。

在 knockoutjs 档案中提到的另一个解决方案是使用knockout-node和JsDOM创建一个可行的 DOM，但乍一看，这似乎太模糊了，并且可能导致实现您自己的测试环境。

有一个幻灯片建议zombie.js 可以与knockout/node/etc 一起使用。但是我找不到任何提供确凿证据的东西，所以我也不喜欢这条路线。

Answer 2

也许这是因为 Knockout 已经改变（因为接受的答案是旧的），但今天，我不认为这是必要的（不再）。您可以轻松测试 Knockout 视图模型。我需要做的就是ko在我的测试中设置全局变量：

global.ko = require('../../Website/Scripts/knockout-3.4.0.js');

之后，您可以像往常一样运行测试：实例化您的视图模型，对其执行任何操作并断言。

我已经写了更多关于它的内容，但本质上，这对我有用：

global.ko = require('../../Website/Scripts/knockout-3.4.0.js');

var MyViewModel = require('../../Website/Scripts/myViewModel.js').MyViewModel;

describe('MyViewModel', function() {
    var viewModel;

    beforeEach(function(){
        viewModel = new MyViewModel();
    });

    describe('...', function() {
        /* And so on */
    });
});