javascript - Knockout JS 单元测试和 ViewModel 耦合和依赖

Question

我开始为我的 js 代码编写单元测试，我是这方面的新手。我们使用 knockout.js 并需要测试项目的 View 模型。

这是示例:

Tasks.js 文件

var yc = yc || {};

yc.TasksVM = function (options) {
    _addTask = function () {
        yc.AddTask.openDialog();
    },

    _paging = myc.PagingVM();

    _instance = {
        addTask: _addTask,
        paging: _paging,
    };

    return _instance;
}

和 AddTask.js 文件

var yc = yc || {};

yc.AddTaskVM = function (options) {
    var 
    _openDialog = function (orderId) {
        $.ajax({
            data: data, type: 'get', url: dialogUrl,
            success: function (dialogContent) {
                // ...
            }
        });
    };

    _instance = {
        openDialog: _openDialog
    };

    return _instance;
}

当我尝试使用 Jasmine 测试 TasksVM 时，我遇到了需要实例化 的问题 yc.AddTask.openDialog()调用openDialog() .我还需要将此文件包含在 <script> 中标签才能接听电话。然后，在 yc.AddTask.openDialog我需要模拟 $.ajax调用(并在我的 html 中包含 jQuery)。

我的问题是关于耦合的。

1.可以调用yc.AddTask.<my_function>吗？里面来自 yc.TasksVM ？

在 .NET 世界，我们通过接口(interface) 处理这个问题。我们去除了所有外部依赖，仅使用源代码中的接口(interface)。所以我们可以在我们正在测试的代码中模拟任何东西。

2. 我需要将所有这些依赖文件包含到我的 html 文件运行程序中是否可以？

Answer 1

1) 在较小的应用程序中没问题，但对于具有大量耦合的复杂应用程序，我会使用某种 EventAggregator 在模型之间进行通信。

2) 当我对我的 JS 业务逻辑进行单元测试时，我总是模拟所有服务和 DOM 交互，DOM 交互你可以通过 KO 免费获得，因为你只测试已经与 DOM 分离的 ViewModel(最大的之一如果你问我，MVVM 的优势)。

jQuery 是一个 DOM 交互库，你应该只使用它的服务部分(post、ajax、getJson 等)，所以我为我们的单元测试所做的是覆盖 $ 和 jQuery 符号，所以如果我的任何开发伙伴尝试从 ViewModel 使用 $("dom") 它会在单元测试中崩溃，这是确保所有开发人员都正确使用 KO 的好方法。

在单元测试的设置中，只需覆盖您想要模拟的方法(伪代码不是 Jasmine)

$.getJSON = function(url, params, success) {
   assert(1, params.id, "It should call our backend with the correct Id");
   success(mockedData);
};

编辑:在我的项目中，我们使用 Qunit 并有一个基础测试“类”，它有一个拆解，因此它使所有模拟函数为空，这样它们就不能从不同的测试中调用