1

我有这个指令。它获取一个数组并创建一个堆叠条。虽然该指令工作正常,但单元测试却惨遭失败。我试过了:

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 更容易一些,但它不会对这个问题产生任何影响(至少据我所知,我禁用了它并获得了相同的效果)。

有任何想法吗?我很乐意为您提供帮助

4

2 回答 2

0

这是你的全部测试吗?我没有看到任何加载包含您的指令的模块的调用。这意味着您的指令根本没有被注册,并且当您编译时它不会被调用。

通常,您应该执行以下操作:

beforeEach(module('myApp'))

这将确保“myApp”模块已加载,并且在您 $compile 时该模块中的指令可用。

于 2013-12-03T05:55:42.040 回答
0

我在angularjs doc中找到了这个小注释:

find() - 仅限于按标签名称查找

也许你的问题的原因...

于 2013-12-02T12:07:50.663 回答