javascript - 类型错误 : undefined is not an object (evaluating 'scope.awesomeThings' )

Question

每次运行 grunt test 命令时都会出现此错误。我使用 yo angular 设置了一个项目，并尝试运行 yeoman 的脚手架中给出的示例代码。我不知道这里出了什么问题，下面是我尝试测试的代码。

controller/main.js

angular.module('brandPortalApp')
  .controller('MainCtrl', function ($scope) {
    $scope.awesomeThings = [
      'HTML5 Boilerplate',
      'AngularJS',
      'Karma'
    ];
  });

测试/controllers/main.js

'use strict';

describe('Controller: MainCtrl', function () {
  // load the controller's module
  beforeEach(module('brandPortalApp'));
  var MainCtrl,
  scope;

  // Initialize the controller and a mock scope
  beforeEach(inject(function ($controller, $rootScope) {
    scope = $rootScope.$new();
    MainCtrl = $controller('MainCtrl', {
      $scope: scope
    });
  }));

  it('should attach a list of awesomeThings to the scope', function () {
    expect(scope.awesomeThings.length).toBe(3);
  });
});

karma.conf.js

// Karma configuration
// http://karma-runner.github.io/0.12/config/configuration-file.html
// Generated on 2016-05-27 using
// generator-karma 0.8.3

module.exports = function(config) {
  'use strict';

  config.set({
    // enable / disable watching file and executing tests whenever any file changes
    autoWatch: true,

    // base path, that will be used to resolve files and exclude
    basePath: '../',

    // testing framework to use (jasmine/mocha/qunit/...)
    frameworks: ['jasmine'],

    // list of files / patterns to load in the browser
    files: [
      'bower_components/angular/angular.js',
      'bower_components/angular-mocks/angular-mocks.js',
      'bower_components/angular-animate/angular-animate.js',
      'bower_components/angular-aria/angular-aria.js',
      'bower_components/angular-cookies/angular-cookies.js',
      'bower_components/angular-messages/angular-messages.js',
      'bower_components/angular-resource/angular-resource.js',
      'bower_components/angular-route/angular-route.js',
      'bower_components/angular-sanitize/angular-sanitize.js',
      'bower_components/angular-touch/angular-touch.js',
      'app/scripts/**/*.js',
      'test/mock/**/*.js',
      'test/spec/**/*.js'
    ],

    // list of files / patterns to exclude
    exclude: [],

    // web server port
    port: 8080,

    // Start these browsers, currently available:
    // - Chrome
    // - ChromeCanary
    // - Firefox
    // - Opera
    // - Safari (only Mac)
    // - PhantomJS
    // - IE (only Windows)
    browsers: [
      'PhantomJS'
    ],

    // Which plugins to enable
    plugins: [
      'karma-phantomjs-launcher',
      'karma-jasmine'
    ],

    // Continuous Integration mode
    // if true, it capture browsers, run tests and exit
    singleRun: false,

    colors: true,

    // level of logging
    // possible values: LOG_DISABLE || LOG_ERROR || LOG_WARN || LOG_INFO || LOG_DEBUG
    logLevel: config.LOG_INFO,

    // Uncomment the following lines if you are using grunt's server to run the tests
    // proxies: {
    //   '/': 'http://localhost:9000/'
    // },
    // URL root prevent conflicts with the site root
    // urlRoot: '_karma_'
  });
};

在终端

Running "connect:test" (connect) task Started connect web server on http://localhost:9001

Running "karma:unit" (karma) task WARN [watcher]: Pattern "/Users/kiwitech/Brand-Portal/test/mock/**/*.js" does not match any file. INFO [karma]: Karma v0.13.22 server started at http://localhost:8080/ INFO [launcher]: Starting browser PhantomJS INFO [PhantomJS 2.1.1 (Mac OS X 0.0.0)]: Connected on socket /#NDwIB4AQl7giaVxJAAAA with id 29519679 PhantomJS 2.1.1 (Mac OS X 0.0.0) Controller: MainCtrl should attach a list of awesomeThings to the scope FAILED forEach@/Users/kiwitech/Brand-Portal/bower_components/angular/angular.js:322:24 loadModules@/Users/kiwitech/Brand-Portal/bower_components/angular/angular.js:4548:12 createInjector@/Users/kiwitech/Brand-Portal/bower_components/angular/angular.js:4470:30 workFn@/Users/kiwitech/Brand-Portal/bower_components/angular-mocks/angular-mocks.js:2464:60 /Users/kiwitech/Brand-Portal/bower_components/angular/angular.js:4588:53 TypeError: undefined is not an object (evaluating 'scope.todos') in /Users/kiwitech/Brand-Portal/test/spec/controllers/main.js (line 20) /Users/kiwitech/Brand-Portal/test/spec/controllers/main.js:20:17 PhantomJS 2.1.1 (Mac OS X 0.0.0): Executed 1 of 1 (1 FAILED) ERROR (0.005 secs / 0.015 secs) Warning: Task "karma:unit" failed. Use --force to continue.

Aborted due to warnings.

我检查了与此相关的其他问题，但这些解决方案不适用于此。

感谢帮助!!

Answer 1

我不确定你是否解决了它，但如果你没有解决，问题出在 karma.conf.js 中的路径上。我的 angularApp 也有类似的问题。

由于我不确定你的架构是什么，我自己做了测试(相当脏，即:未优化)，当然路径应该根据你的架构进行更改。

jasmineApp 文件夹:

├── app
│   └── scripts
├── bower_components
│   ├── angular
│   ├── angular-animate
│   ├── angular-aria
│   ├── angular-cookies
│   ├── angular-messages
│   ├── angular-mocks
│   ├── angular-resource
│   ├── angular-route
│   ├── angular-sanitize
│   └── angular-touch
└── test
    └── controllers

测试文件是test/controllers/main.js:

'use strict';

  // run first test to check karma - I always run this simple test
  // before starting with real tests

  describe('Simple test', function(){
    it("a is in fact 'hello world'", function(){
      var a = "Hello world";
      expect(a).toBe('Hello world');
    });
  });

  describe('Controller: MainCtrl', function () {

    // load the controller's module
    beforeEach(module('brandPortalApp'));

    var MainCtrl,
      scope;

    // Initialize the controller and a mock scope
    beforeEach(inject(function ($controller, $rootScope) {
      scope = $rootScope.$new();
      MainCtrl = $controller('MainCtrl', {
        $scope: scope
      });
    }));

    it('should attach a list of awesomeThings to the scope', function () {
      expect(scope.awesomeThings.length).toBe(3);
    });
  });

Controller 文件是app/controller/main.js:

angular.module('brandPortalApp',[])
console.log('loaded')
angular.module('brandPortalApp')
  .controller('MainCtrl', function ($scope) {
    $scope.awesomeThings = [
      'HTML5 Boilerplate',
      'AngularJS',
      'Karma'
    ];
  });

karma.config.js 是这样的:

// Karma configuration
// http://karma-runner.github.io/0.12/config/configuration-file.html
// Generated on 2016-05-27 using
// generator-karma 0.8.3

module.exports = function(config) {
  'use strict';

  config.set({
    // enable / disable watching file and executing tests whenever any file changes
    autoWatch: true,

    // base path, that will be used to resolve files and exclude
    basePath: '../',

    // testing framework to use (jasmine/mocha/qunit/...)
    frameworks: ['jasmine'],

    // list of files / patterns to load in the browser
    files: [
      'jasmineApp/bower_components/angular/angular.js',
      'jasmineApp/bower_components/angular-mocks/angular-mocks.js',
      'jasmineApp/bower_components/angular-animate/angular-animate.js',
      'jasmineApp/bower_components/angular-aria/angular-aria.js',
      'jasmineApp/bower_components/angular-cookies/angular-cookies.js',
      'jasmineApp/bower_components/angular-messages/angular-messages.js',
      'jasmineApp/bower_components/angular-resource/angular-resource.js',
      'jasmineApp/bower_components/angular-route/angular-route.js',
      'jasmineApp/bower_components/angular-sanitize/angular-sanitize.js',
      'jasmineApp/bower_components/angular-touch/angular-touch.js',

      'jasmineApp/app/scripts/**/*.js',
      //'test/mock/**/*.js',
      'jasmineApp/test/controllers/main.js'
    ],

    // list of files / patterns to exclude
    exclude: [],

    // web server port
    port: 8080,

    // Start these browsers, currently available:
    // - Chrome
    // - ChromeCanary
    // - Firefox
    // - Opera
    // - Safari (only Mac)
    // - PhantomJS
    // - IE (only Windows)
    browsers: [
      'PhantomJS'
    ],

    // Which plugins to enable
    plugins: [
      'karma-phantomjs-launcher',
      'karma-jasmine'
    ],

    // Continuous Integration mode
    // if true, it capture browsers, run tests and exit
    singleRun: false,

    colors: true,

    // level of logging
    // possible values: LOG_DISABLE || LOG_ERROR || LOG_WARN || LOG_INFO || LOG_DEBUG
    logLevel: config.LOG_INFO,

    // Uncomment the following lines if you are using grunt's server to run the tests
    // proxies: {
    //   '/': 'http://localhost:9000/'
    // },
    // URL root prevent conflicts with the site root
    // urlRoot: '_karma_'
  });
};

运行测试输出正常:

21 07 2016 10:58:38.705:WARN [karma]: No captured browser, open http://localhost:8080/
21 07 2016 10:58:38.718:INFO [karma]: Karma v1.1.1 server started at http://localhost:8080/
21 07 2016 10:58:38.719:INFO [launcher]: Launching browser PhantomJS with unlimited concurrency
21 07 2016 10:58:38.755:INFO [launcher]: Starting browser PhantomJS
21 07 2016 10:58:39.017:INFO [PhantomJS 2.1.1 (Linux 0.0.0)]: Connected on socket /#BUObAGDOLqCbC0uRAAAA with id 56816897
PhantomJS 2.1.1 (Linux 0.0.0) LOG: 'loaded'

PhantomJS 2.1.1 (Linux 0.0.0): Executed 1 of 1 SUCCESS (0.006 secs / 0.009 secs)

更改 karma.config.js 中 main.js 文件的路径来自工作一个

'jasmineApp/app/scripts/**/*.js',

为此

'app/scripts/**/*.js', // wrong path

你得到的错误，回来了:

21 07 2016 11:01:48.645:WARN [watcher]: Pattern "/var/www/NODEJS/app/scripts/**/*.js" does not match any file.
21 07 2016 11:01:48.664:WARN [karma]: No captured browser, open http://localhost:8080/
21 07 2016 11:01:48.674:INFO [karma]: Karma v1.1.1 server started at http://localhost:8080/
21 07 2016 11:01:48.674:INFO [launcher]: Launching browser PhantomJS with unlimited concurrency
21 07 2016 11:01:48.690:INFO [launcher]: Starting browser PhantomJS
21 07 2016 11:01:48.955:INFO [PhantomJS 2.1.1 (Linux 0.0.0)]: Connected on socket /#YK-fqsro3-ebMO2kAAAA with id 84208961
PhantomJS 2.1.1 (Linux 0.0.0) Controller: MainCtrl should attach a list of awesomeThings to the scope FAILED
    forEach@jasmineApp/bower_components/angular/angular.js:321:24
    loadModules@jasmineApp/bower_components/angular/angular.js:4592:12
    createInjector@jasmineApp/bower_components/angular/angular.js:4514:30
    workFn@jasmineApp/bower_components/angular-mocks/angular-mocks.js:3067:60
    loaded@http://localhost:8080/context.js:151:17
    jasmineApp/bower_components/angular/angular.js:4632:53
    TypeError: undefined is not an object (evaluating 'scope.awesomeThings') in jasmineApp/test/controllers/main.js (line 20)
    jasmineApp/test/controllers/main.js:20:19
    loaded@http://localhost:8080/context.js:151:17
PhantomJS 2.1.1 (Linux 0.0.0): Executed 1 of 1 (1 FAILED) ERROR (0.042 secs / 0.007 secs)

希望对您有所帮助。