在具有ngMaterial依赖关系的angularjs应用程序上运行jasmine测试时出错

时间:2014-12-04 15:30:31

标签: angularjs unit-testing jasmine karma-runner angular-material

我的应用程序依赖于角度材质ngMaterial

var sequencesApp = angular.module('sequencesApp', ['ngMaterial']);

sequencesApp.controller('SequenceListCtrl', function ($scope) {
  $scope.sequences = [
    {'name': 'Sequence 1',
     'sequence': 'actgactgcatgctgctagctgcatgcta'},
    {'name': 'Sequence 2',
     'sequence': 'atgcatcatcatcatctctgcatgcatcatctacacataatagcatcgatctcatctcacacatgcatgctgcatcta'},
    {'name': 'Sequence 3',
     'sequence': 'atgcatacatcatcatctctgcatgcatcatctacacataatagcatcgatctcatctcacacatgcatgctgcatctaatgcatcatcatcatctctgcatgcatcatctacacataatagcatcgatctcatctcacacatgcatgctgcatctaatgcatcatcatcatctctgcatgcatcatctacacataatagcatcgatctcatctcacacatgcatgctgcatctaatgcatcatcatcatctctgcatgcatcatctacacataatagcatcgatctcatctcacacatgcatgctgcatctaatgcatcatcatcatctctgcatgcatcatctacacataatagcatcgatctcatctcacacatgcatgctgcatcta'}
  ];
});

我正在使用jasmine和karma运行测试以及以下测试代码

describe('SequenceListCtrl', function(){

  beforeEach(module('sequencesApp'));

  var $controller;

  beforeEach(inject(function(_$controller_){
    // The injector unwraps the underscores (_) from around the parameter names when matching
    $controller = _$controller_;
  }));

  describe('$scope.sequences', function() {

      beforeEach(function () {
          $scope = {};
          $controller = $controller('SequenceListCtrl', { $scope: $scope });
      });

      it('should create "sequences" model with 3 sequences', function () {
          expect($scope.sequences.length).toBe(3);
      });

  });

});

当我运行karma start时,会发生以下错误:

Error: ngMaterial requires HammerJS to be preloaded.
    at MdCoreInitialize (/Users/rhysalgar/Dropbox/Projects/LabGeniusApp/bower_components/angular-material/angular-material.js:21:11)
    at Object.invoke (/Users/rhysalgar/Dropbox/Projects/LabGeniusApp/bower_components/angular/angular.js:4138:17)
    at /Users/rhysalgar/Dropbox/Projects/LabGeniusApp/bower_components/angular/angular.js:3960:71
    at forEach (/Users/rhysalgar/Dropbox/Projects/LabGeniusApp/bower_components/angular/angular.js:322:20)
    at Object.createInjector [as injector] (/Users/rhysalgar/Dropbox/Projects/LabGeniusApp/bower_components/angular/angular.js:3960:3)
    at Object.workFn (/Users/rhysalgar/Dropbox/Projects/LabGeniusApp/bower_components/angular-mocks/angular-mocks.js:2337:52)
TypeError: undefined is not a function
    at Object.<anonymous> (/Users/rhysalgar/Dropbox/Projects/LabGeniusApp/media/development/test/controllers.test.js:20:25)
TypeError: Cannot read property 'length' of undefined
    at Object.<anonymous> (/Users/rhysalgar/Dropbox/Projects/LabGeniusApp/media/development/test/controllers.test.js:24:34)

``` 当我删除app模块中的ngMaterial依赖项时,一切运行正常。

我的karma.conf.js文件包含以下files数组:

files: [
  'test-main.js',
  'bower_components/angular/angular.js',
  'bower_components/angular-aria/angular-aria.js',
  'bower_components/angular-animate/angular-animate.js',
  'bower_components/hammerjs/hammer.js',
  'bower_components/angular-material/angular-material.js',
  'bower_components/angular-mocks/angular-mocks.js',
  'media/development/js/*.js',
  'media/development/test/*.js'
],

1 个答案:

答案 0 :(得分:1)

您应该使用正确的顺序包含依赖项:

<!-- Angular Material Dependencies -->
<script src="//cdn.jsdelivr.net/hammerjs/2.0.4/hammer.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.6/angular.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.6/angular-animate.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.6/angular-aria.min.js"></script>

<!-- Angular Material Javascript now available via Google CDN; version 0.6 used here -->
<script src="//ajax.googleapis.com/ajax/libs/angular_material/0.6.1/angular-material.min.js"></script>

如果您需要更多信息,请查看Installing Build部分。