$ compile不在单元测试中工作

时间:2014-03-31 06:42:50

标签: angularjs angularjs-directive karma-runner

我是棱角分明的新手,我正试图处理测试,但是在一个看似愚蠢的问题上已经被困了一段时间,也许这对于$ compile缺乏了解。我将我的单元测试代码简化为以下内容:

it('should create a table', inject(['$compile', '$rootScope', function ($compile, $rootScope) {
    var element;
    var scope = $rootScope.$new();
    scope.list = [{name: 'tst'},{name:'sae'},{name:'dkos'}]
    element = angular.element('<ul><li ng-repeat="p in list">{{p.name}}</li></ul>');
    element = $compile(element)(scope);
    expect(element.find('li').length).to.equal(3);
}]));

当我经营业力时,我收到以下失败:

$ grunt karma:unit
Running "karma:unit" (karma) task
INFO [karma]: Karma v0.10.10 server started at http://localhost:9876/
INFO [launcher]: Starting browser Chrome
INFO [Chrome 33.0.1750 (Mac OS X 10.9.2)]: Connected on socket 6K3QkOOLMEYRkZco3rY3
Chrome 33.0.1750 (Mac OS X 10.9.2) Directive: ngTabled should create a table FAILED
    AssertionError: expected 0 to equal 3
        at Context.<anonymous> (/Users/andyperlitch/js/ng-tabled/test/spec/directives/ng-tabled.js:22:44)
        at Object.invoke (/Users/andyperlitch/js/ng-tabled/app/bower_components/angular/angular.js:3697:17)
        at Context.workFn (/Users/andyperlitch/js/ng-tabled/app/bower_components/angular-mocks/angular-mocks.js:2102:20)
        at callFn (/Users/andyperlitch/js/ng-tabled/node_modules/mocha/mocha.js:4338:21)
        at Test.Runnable.run (/Users/andyperlitch/js/ng-tabled/node_modules/mocha/mocha.js:4331:7)
        at Runner.runTest (/Users/andyperlitch/js/ng-tabled/node_modules/mocha/mocha.js:4728:10)
        at /Users/andyperlitch/js/ng-tabled/node_modules/mocha/mocha.js:4806:12
        at next (/Users/andyperlitch/js/ng-tabled/node_modules/mocha/mocha.js:4653:14)
        at /Users/andyperlitch/js/ng-tabled/node_modules/mocha/mocha.js:4663:7
        at next (/Users/andyperlitch/js/ng-tabled/node_modules/mocha/mocha.js:4601:23)
    Error: Declaration Location
        at window.inject.angular.mock.inject (/Users/andyperlitch/js/ng-tabled/app/bower_components/angular-mocks/angular-mocks.js:2087:25)
        at Suite.<anonymous> (/Users/andyperlitch/js/ng-tabled/test/spec/directives/ng-tabled.js:16:31)
        at context.describe.context.context (/Users/andyperlitch/js/ng-tabled/node_modules/mocha/mocha.js:955:10)
        at /Users/andyperlitch/js/ng-tabled/test/spec/directives/ng-tabled.js:3:1
Chrome 33.0.1750 (Mac OS X 10.9.2): Executed 1 of 1 (1 FAILED) ERROR (0.21 secs / 0.029 secs)
Warning: Task "karma:unit" failed. Use --force to continue.

Aborted due to warnings.


Execution Time (2014-03-31 06:41:05 UTC)
karma:unit  2.5s  ▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇ 100%
Total 2.5s

我正在撕裂我的头发,所以任何帮助都会很棒!如果有必要,我很乐意提供更多细节。

安迪

1 个答案:

答案 0 :(得分:4)

在调用scope.$digest()之后,看起来需要调用$compile()才能使ng-repeat在列表上运行。所以你的测试可能就像:

it('should create a table', inject(['$compile', '$rootScope', function ($compile, $rootScope) {
  var element;
  var scope = $rootScope.$new();
  scope.list = [{name: 'tst'},{name:'sae'},{name:'dkos'}]
  element = angular.element('<ul><li ng-repeat="p in list">{{p.name}}</li></ul>');
  element = $compile(element)(scope);
  scope.$digest();
  expect(element.find('li').length).toEqual(3);
}]));

这可以在http://plnkr.co/edit/ypDZeSPMggknqsuiETh8?p=preview

中看到