Question

我正在为新应用程序编写自定义Angular指令，并使用Jasmine对它们进行单元测试。但是，我不能为我的生活弄清楚如何在Kendo Grid数据源上获得完整的代码覆盖率（甚至80％）。

我有一个自定义的Angular Kendo网格指令，如下所示：

function customKendoGrid() {
  return {
    scope: {
        hiPageSize: "="
    },
    template: "<div kendo-grid k-options='gridOptions' k-ng-delay='gridOptions'></div>",
    controller: "hiKendoGridCtrl"
  };
}

我这样做了所以我可以在grid指令的范围上放置一个自定义对象。我的控制器看起来像这样：

function hiKendoGridCtrl($scope, $http, hiKendoGridSvc) {
  var initialData = {
    page: 1,
    pageSize: 2,
    type: "initial"
  };
  if(angular.isUndefined($scope.initialLoad)){
    $scope.initialLoad = true;
  }
  var firstPageData = hiKendoGridSvc.getFirstPage(initialData);
  firstPageData.then(function (result) {
    var columnSet = result.ColumnSet;
    var dataModel = result.Model;
    var GridModel = kendo.data.Model.define(dataModel);
    var firstPage = result.Data;
    var totalResults = result.Total;
    $scope.gridOptions = {
        dataSource: {
            schema: {
                data: "Data",
                total: function () { return totalResults; }, // NOT COVERED
                model: GridModel
            },
            transport: {
                read: function (options) {
                    if ($scope.initialLoad) {// NOT COVERED
                        $scope.initialLoad = false;// NOT COVERED
                        options.success({ Data: firstPage });// NOT COVERED
                    } else {
                        var requestData = {// NOT COVERED
                            page: options.data.page,
                            pageSize: options.data.pageSize,
                            type: "page"
                        };
                        $http({ method: 'POST', url: 'Home/DataSourceResult', data: requestData }).success(
                            function (data) {
                                options.success(data);// NOT COVERED
                            }).error(
                            function (data, status, headers, config) {
                                console.log(data);// NOT COVERED
                                console.log(status);// NOT COVERED
                                console.log(headers);// NOT COVERED
                                console.log(config);// NOT COVERED
                            });
                    }
                }
            },
            serverPaging: true,
            pageSize: $scope.hiPageSize
        },
        scrollable: true,
        pageable: {
            input: true,
            numeric: false,
            refresh: true
        },
        editable: true,
        columns: columnSet,
        sortable: true,
        groupable: true
    };

  });
}

上述说明

初始调用服务器以获取所有网格配置（架构，列，数据的第一页和总计）。所有后续调用都会转到具有不同发布参数的同一URL，只需从服务器中检索一页数据。

我的问题是我似乎无法找到在评论中遍历上面显示为“NOT COVERED”的代码路径的方法。

我在单独的单元测试中调用网格和控制器，但似乎无法使Kendo Grid编译并调用上面的不同路径。

我目前对控制器和指令的两个测试是：

控制器

beforeEach(inject(function($http){
    ctrl = $controller("hiKendoGridCtrl", {
         $scope: $scope,
         $http: $http,
         hiKendoGridSvc: hiKendoGridSvcMOCK
    });
    $scope.$digest();
}));

由此我可以为控制器断言所有类型的东西，包括定义正确的'$ scope.gridOptions'。

指令测试 //我将范围设置为新的rootScope，并在此测试的beforeEach中设置compile = $ compile。它（“应该输出正确的HTML”，function（）{ catchPOST.respond（{ data：responseDataMOCK }）; element =''; element = compile（element）（scope）; 范围$摘要（）。期望（元素[0] .innerHTML）.toContain（ ''）; }

但是这并没有抓住上面控制器中的上述描述。

我也尝试了一些我认为古怪的东西，但类似于：

// Execute the above directive test compiling my custom directive to a kendo directive
it("Should have the correct scope", function() {
                var gridElement = '<div kendo-grid k-options="gridOptions"></div>';
                gridElement = compile(gridElement)($scope);
                console.log($scope);
                console.log(gridElement);
            });

所以我想也许我可以在范围内获取GridOptions，然后手动编译kendo指令，但这并不会在gridElement中任何内部HTML完全恢复。

所以......问题是：

如何添加新测试/更改现有测试以获得完整的代码覆盖率？

我怎么能/我应该更改我的代码以使其更稳定？我很犹豫这样做，因为我花了很多精力让网格在动态配置下正常工作。

谢谢！

单元测试Angular-Kendo网格数据源 - 所有代码路径

0 个答案: