测试Karma中的角度控制器

时间:2015-11-15 14:00:15

标签: angularjs karma-runner karma-jasmine

我和我的团队在使用Jasmine上的Karma测试运行器设置控制器测试时遇到了问题。

  

应用/ app.js

buyItApp = angular.module('buyItApp', ['ionic']);
  

应用/控制器/ userSearchCtrl.js

buyItApp.controller("userSearchCtrl", function($http, $scope) {
  var self = this;
  self.searchQuery = function(searchData) {
    $( "ion-spinner").toggle(true);
    $http({
      method: 'GET',
      url: 'http://productfeedtest.wandoso.com/?keyword=' + searchData
    }).then(function successCallback(response) {
      $( "ion-spinner").toggle(false);
      $scope.showResultsCount = true
      $scope.items = response.data.items;
      $scope.isOffer = response.data.is_special_offer;
      $scope.resultsCount = response.data.items.length;
      $scope.searchQuery = searchData;
    }, function errorCallback(response) {
      $scope.searchResults = "server error!"
    });
  }
});
  

测试/ karma.conf.js

module.exports = function(config) {
  config.set({
    basePath: '',
    frameworks: ['jasmine'],
    files: [
      'https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0-beta.1/angular.min.js',
      'https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0-beta.1/angular-mocks.js',
      'https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0-beta.1/angular-scenario.js',
      '../public/javascripts/app/*.js',
      '../public/javascripts/app/controllers/*.js',
      'unit/userSearchCtrl.spec.js',
      'unit/*.spec.js'
    ],

    exclude: [
    ],

    preprocessors: {
    },

    reporters: ['progress'],
    port: 9876,
    colors: true,
    logLevel: config.LOG_INFO,
    autoWatch: true,
    browsers: ['PhantomJS'],
    singleRun: false,
    concurrency: Infinity
  })
}
  

测试/单元/ userSearchCtrl.spec.js

describe('userSearchCtrl', function() {

    var $rootScope, $scope, $controller, userSearchCtrl;

    beforeEach(module('buyItApp'));

    beforeEach(inject(function(_$rootScope_, _$controller_){
        $rootScope = _$rootScope_;
        $scope = $rootScope.$new();
        $controller = _$controller_;

        userSearchCtrl = $controller('userSearchCtrl', {'$rootScope' : $rootScope, '$scope': $scope});
    }));

    it('should exist', function() {
        expect(userSearchCtrl).toBeDefined();
    });
});
  

测试结果失败

http://textuploader.com/5jo6b

最值得注意的是:

Expected undefined to be defined.
        at /Users/Harry/Dropbox/Dev/buyIt/test/unit/userSearchCtrl.spec.js:16
PhantomJS 1.9.8 (Mac OS X 0.0.0): Executed 1 of 1 (1 FAILED) ERROR (0.004 secs / 0.007 secs)

看起来Karma无法找到控制器,但是在检查代码并查看其他项目之后,问题就不那么清楚了。

2 个答案:

答案 0 :(得分:1)

作为错误

> http://errors.angularjs.org/1.5.0-beta.1/$injector/modulerr?p0=buyItApp&p1=Error:
> [$injector:modulerr]
> http://errors.angularjs.org/1.5.0-beta.1/$injector/modulerr?p0=ionic&p1=Error:
> [$injector:nomod]
> http://errors.angularjs.org/1.5.0-beta.1/$injector/nomod?p0=ionic

明确表示,它无法找到ionic中加载的buyItApp模块。因为它没有包含在Karma files中。

答案 1 :(得分:0)

我认为问题在于你不使用模拟器。

beforeEach(module('buyItApp'));实际上是一个真实的模块。由于您不包含依赖项,这显然会失败。

此外,如果您想模拟控制器的功能,则应使用angular.mock.inject而不是inject

我不确定这一点,但我一直这样做。

您的规格如下:

describe('userSearchCtrl', function() {
    var $rootScope, $scope, $controller, userSearchCtrl;

    beforeEach(angular.mock.module('buyItApp'));

    beforeEach(angular.mock.inject(function(_$rootScope_, _$controller_) {
        $rootScope = _$rootScope_;
        $scope = $rootScope.$new();
        $controller = _$controller_;

        userSearchCtrl = $controller(
            'userSearchCtrl', 
            {
                '$rootScope' : $rootScope, 
                '$scope': $scope
            }
        );
   }));

   it('should exist', function() {
       expect(userSearchCtrl).toBeDefined();
    });
});