我有这个指令。它获取一个数组并创建一个堆叠条。虽然该指令工作正常,但单元测试却惨遭失败。我试过了:
describe('Stacked bar directive', function(){
var scope, elem;
beforeEach(inject(function(_$compile_, _$rootScope_){
// The injector unwraps the underscores (_) from around the parameter names when matching
$compile = _$compile_;
$rootScope = _$rootScope_;
}))
beforeEach(function(){
scope = $rootScope.$new();
scope.distribution = [[0.4,'diamonds'],
[0.05,'gold'],
[0.15,'silver'],
[0.4, 'bronze']];
elem = angular.element('<bars-chart chart-data="distribution" chart-width="200"></bars-chart>');
$compile(elem)(scope);
scope.$digest();
});
it('Should display the correct number of bars', function(){
dump(elem)
expect(elem.find(".bars").length).to.equal(4)
//and no other find works either..
});
我得到:
expected 0 to equal 4
由于编译的指令到处都有一个.bars
类,这没有意义。
我注意到转储elem
并没有向我显示渲染的指令,但是:
{0: <bars-chart chart-data="distribution" chart-width="200" class="ng-scope"></bars-chart>, length: 1}
所以也许编译指令的东西对我不起作用。
我正在使用jquery-chai使测试 dom/css 更容易一些,但它不会对这个问题产生任何影响(至少据我所知,我禁用了它并获得了相同的效果)。
有任何想法吗?我很乐意为您提供帮助