Hi have this directive:
angular.module('xos.uiComponents.table', [])
.directive('xosTable', function(){
return {
restrict: 'E',
scope: {
data: '=',
config: '='
},
template: `
<!-- <pre>{{vm.data | json}}</pre> -->
<table ng-class="vm.classes" ng-show="vm.data.length > 0">
<thead>
<tr>
<th ng-repeat="col in vm.columns">{{col.label}}</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="item in vm.data">
<td ng-repeat="col in vm.columns">{{item[col.prop]}}</td>
</tr>
</tbody>
</table>
`,
bindToController: true,
controllerAs: 'vm',
controller: function(){
if(!this.config){
throw new Error('[xosTable] Please provide a configuration via the "config" attribute');
}
if(!this.config.columns){
throw new Error('[xosTable] Please provide a columns list in the configuration');
}
this.columns = this.config.columns;
this.classes = this.config.classes || 'table table-striped table-bordered';
}
}
})
And I'm trying to test it but I cannot access the isolateScope()
, here is my testing code:
describe('when correctly configured', function() {
let scope, element, is;
beforeEach(inject(function ($compile, $rootScope) {
scope = $rootScope.$new();
scope.config = {
columns: [
{
label: 'Label 1',
prop: 'label-1'
},
{
label: 'Label 2',
prop: 'label-2'
}
]
};
scope.data = [
{
'label-1': 'Sample 1.1',
'label-2': 'Sample 1.2'
},
{
'label-1': 'Sample 2.1',
'label-2': 'Sample 2.2'
}
]
element = angular.element('<xos-table config="config" data="data"></xos-table>');
$compile(element)(scope);
is = element.isolateScope();
scope.$digest();
}));
it('should contain 2 columns', function() {
expect(is.columns).toEqual(2);
});
});
I've this same setup a lot of times, any idea on why I cannot access the isolateScope
of my directive?
Here is a Plunker with code and test: http://plnkr.co/edit/JYYtck?p=preview
You have made three mistakes in your test:
isolateScope
is undefined;scope.columns
instead os scope.vm.columns
;Here is the fixed plunkr.
Extract:
beforeEach(module('xos.uiComponents.table'));
[...]
it('should contain 2 columns', function() {
console.log('aaa', iso);
// one is the filter, the other two are the products, one is the pagination
expect(iso.vm.columns.length).toEqual(2);
});