#javascript #angularjs #jasmine #karma-jasmine #angularjs-components
#javascript #angularjs #jasmine #karma-jasmine #angularjs-компоненты
Вопрос:
Я ищу любую помощь в решении моей проблемы с моим UNITEST для AngularJS (и nvd3).
Действительно, когда я пытаюсь создать свою диаграмму, у меня возникает ошибка. Похоже, что $ctrl.data
и $ctrl.options
были полностью пусты…
Я не понимаю, в чем проблема, и я пытался разблокировать это весь день без успеха..
Если у кого-то есть представление о том, откуда берется проблема, я заранее благодарю.
Код :
myComp.comp.js :
angular.module('myMod')
.component('myComp', {
template: '<div><nvd3 options="$ctrl.options" data="$ctrl.wrapped"></nvd3></div>',
bindings: {
data: '<',
zoom: '<'
},
controller: myCtrl
})
myCtrl.$inject = ['$scope']
function myCtrl($scope) {
//Here I set wrapped with data
//and set the options for nvd3
}
myComp.spec.js :
describe('component: myComp', function() {
beforeEach(module('myComp'));
var $ctrl,
$bindings,
$template,
scope,
elmt;
beforeEach(inject(function($compile, $componentController, $rootScope, $document) {
$scope = $rootScope.$new();
$bindings = {
zoom: true,
data: [ /*DATA SAMPLE HERE*/ ]
}
$ctrl = $componentController('myComp', $scope, $bindings);
elmt = angular.element('my-comp data="$ctrl.data" zoom="$ctrl.zoom"></my-comp>');
elmt = $compile(elmt)($scope);
$scope.$apply();
}));
it("test", function () {
expect(1).toBe(1);
});
});
Karma / Jasmine :
Chrome 53.0.2785 (Mac OS X 10.12.0) component: myComp test FAILED
TypeError: Cannot read property 'ordinal' of undefined
at Object.nv.models.multiBarHorizontal (bower_components/nvd3/build/nv.d3.js:8823:23)
at Object.nv.models.multiBarHorizontalChart (bower_components/nvd3/build/nv.d3.js:9180:30)
at Object.updateWithOptions (bower_components/angular-nvd3/dist/angular-nvd3.js:106:72)
at Object.refresh (bower_components/angular-nvd3/dist/angular-nvd3.js:53:39)
at bower_components/angular-nvd3/dist/angular-nvd3.js:449:68
at bower_components/angular-nvd3/dist/angular-nvd3.js:517:43
at Scope.$digest (bower_components/angular/angular.js:17524:23)
at Scope.$apply (bower_components/angular/angular.js:17790:24)
at Object.<anonymous> (ml.report/variableImportances/variableImportances.spec.js:38:9)
at Object.invoke (bower_components/angular/angular.js:4718:19)
Error: Declaration Location
at window.inject.angular.mock.inject (bower_components/angular-mocks/angular-mocks.js:3047:25)
at Suite.<anonymous> (myComp.comp.js:'XX':'XX')
at myComp.spec.js:'XX':'XX'
at myComp.spec.js:'XX':'XX'
/* I have put 'XX' in place of the real lines / col
Ответ №1:
Вам не хватает открытия <
в вашем примере шаблона.
Однако, если вы используете $componentController
, вам не нужно компилировать какой-либо шаблон, поэтому либо сделайте:
$ctrl = $componentController('myComp', $scope, $bindings);
Или, сделайте:
$scope.zoom = true;
$scope.data = [ /*DATA SAMPLE HERE*/ ];
elmt = angular.element('<my-comp data="data" zoom="zoom"></my-comp>');
elmt = $compile(elmt)($scope);
$scope.$apply();
$ctrl = elmt.controller('myComp');