读取 json 文件的 Karma+Jasmine 函数总是失败答案

【问题标题】：Karma+Jasmine function that reads a json file always fails读取 json 文件的 Karma+Jasmine 函数总是失败
【发布时间】：2019-11-11 12:39:19
【问题描述】：

我很难理解 Karma+Jasmine 的单元测试是如何工作的

我正在尝试为我的 AngularJS 应用程序设置一些单元测试，但我遇到了一个问题，即测试似乎无法正确运行函数。

我有一个通过 $http.get 请求读取 json 文件并填充数组的函数，但是当我在单元测试中设置期望数组的长度 expect(array.length).toBe(10) 时，它总是失败，但是我正常运行App时数组的长度。实际上，如果我在单元测试的console.log 中打印长度，它似乎总是停留在 1。

但是例如，如果我检查一些我手动声明的变量，那么期望函数可以正常工作。

谁能告诉我我到底错过了什么？看来我错过了一些关于如何使用 Karma/Jasmine 进行单元测试的基础知识。

任何帮助将不胜感激。谢谢！

【问题讨论】：

标签： angularjs unit-testing jasmine karma-runner

【解决方案1】：

您的问题是 $http.get 是一个异步方法。除非您特别告诉 angularjs 它需要刷新该响应，否则它不会。该方法将退出，并且 $http.get 的回调不会及时发生，以便您的 it 方法利用其 $scope 转换。

您可以通过使用 $httpBackend API https://docs.angularjs.org/api/ngMockE2E/service/$httpBackend 进行调用来实现此目的

你可以这样做

$httpBackend.expectGET('../json/apps.json').respond(200, {mock: 'api response');
$scope.getAllApps();
$httpBackend.flush();
expect(scope.allApps.length).toBe(10);

在您的单元测试中，您永远不应依赖 http 调用的实际响应。为确保您只测试方法，您应该始终模拟您的 API 应该返回的响应。

【讨论】：

我明白了，谢谢你的解释。我现在要测试 $httpBackend 方法！
好的，所以我一直在尝试像你说的那样通过 httpBackend 方法，但它只是抛出一个“错误：意外请求：GET ../json/apps.json”，我什至尝试过将 json 文件与错误描述的路径匹配，但它仍然给出相同的错误。
谷歌搜索后我最终选择了 $httpBackend.when('GET', '../../json/apps.json').respond(response);方法，这对我有用。非常感谢您为我指明了正确的方向。

【解决方案2】：

错误

$scope.getAllApps = function(){
    $scope.isLoading = true;
    $http.get('../json/apps.json').then(function (data){
        // ...
    });
    $scope.isLoading = false;
};

更好

$scope.getAllApps = function(){
    $scope.isLoading = true;
    $http.get('../json/apps.json').then(function (data){
        // ...
    }).finally(function() {
        $scope.isLoading = false;
    });
};

因为$http服务处于非阻塞和异步状态，它立即返回一个promise。它不等待数据从服务器返回。 isLoading 标志需要等待承诺解决，然后再设置标志false。

【讨论】：

这是一个很好的观点，我没有考虑过。谢谢你的提醒:)