API 関数 (例: $scope.gridOptions.api.showNoRowsOverlay()) にアクセスしようとしたときの「未定義」が原因で、ag-grid 3.0.0 を使用した AngularJS 1.3.15 アプリケーションの Karma/Jasmine テストに行き詰まりました。 )。
グーグルでいろいろ試した後(まったく運がなかった)、2つのオプションが残っています。
a) 何らかの方法でグリッドを初期化してみてください。私は ng-grid (リンク) の人々が採用した解決策を見つけました:
elm = angular.element('<div ng-grid="gridOptions" style="width: 1000px; height: 1000px"></div>');
$compile(elm)($scope);
b) 次のような命令で angularGrid モジュール全体をモックしてみてください。
angular.module("angularGrid", []);
この依存関係を取り除くためのヒントやガイドライン (さらに良い!) を教えてもらえますか?
前もってありがとう、ニコラ
UPDATE 2016/06/19 @RamiShareef
現時点で私がフォローしている単純なSPAの構造は次のとおりです。
//AngularJS module creation
var reportModule = angular.module('reportModule', ['agGrid']);
//AngularJS service creation. This service serves the SPA controller.
reportModule.service('reportModuleService', [function(){
var self = this;
//Function that builds the column definition for agGrid
self.buildColumnDefinitions = function(){
var columnDefinitions = [{headerName:"Name", field:"userName"},
{headerName:"Login", field:"login"}];
return columnDefinitions;
}
//Function that acts as a factory for the agGrid state builder
self.buildDataGridState = function(columnDefinitions){
var dataGridState = {
columnDefs: columnDefinitions,
rowData: null
};
return dataGridState;
}
//Function that updates the data grid rows
self.updateDataGridRows = function(dataGridState, rowData){
dataGridState.api.setRowData(propertyData);
return dataGridState;
}
//Function that returns some data to load into the grid
self.loadSomeData = function(){
//Return a promise with some data to display...
}
}]);
//AngularJS definition for the SPA controller
reportModule.controller('reportModuleController', ['reportModuleService', function(reportModuleService){
var self = this;
//List of column definitions
self.columnDefinitions = self.reportModuleService.buildColumnDefinitions();
//Definition of grid properties and its initialization
$scope.gridOptions = self.reportModuleService.buildDataGridState(self.columnDefinitions);
//Let's now load data into the grid...
self.reportModuleService.loadSomeData().then(function(someGridData){
self.reportModuleService.updateDataGridRows($scope.gridOptions, someGridData);
});
}]);
このアーキテクチャをセットアップすると、agGrid 呼び出しのモックが簡単になることがわかります。Karma/Jasmine テストでは、グリッドの状態を処理するサービス メソッドにスパイを定義するだけでよいからです。
spyOn(testReportModuleService, 'updateDataGridRows').and.callFake(function(){});
また
spyOn(testReportModuleService, 'resetDataGridRows').and.callFake(function(){});
これが私のように Karma/Jasmine テストで立ち往生している人々の助けになることを願っています!