使用 typescript 和 angular 2 的 Karma 测试抛出 Typeerror for "System.config"

Question

我是测试新手，我使用 angular 2 作为学习的新起点。

错误：

INFO [Chrome 42.0.2311 (Mac OS X 10.9.3)]: Connected on socket xo5ufjmFKLGc5QSuAAAB with id 34336816
WARN [web-server]: 404: /base/jspm_packages/es6-module-loader.js
ERROR [karma]: Uncaught TypeError: System.config is not a function
at http://localhost:9876/base/js/angular.js?4c894ae47e8d04bb01965dbf22fa08aed20f0eb2:25575

ERROR [karma]: Uncaught ReferenceError: require is not defined
at http://localhost:9876/base/app/app.js?8a00e7f6717b2dd7118e800d05625a443a4b2065:13

问题：

如何补救 TypeError 和未捕获的引用错误，使我的 main.spec.js 可以通过？

Karma.conf

// Karma configuration
// Generated on Mon May 18 2015 18:17:07 GMT-0700 (PDT)

module.exports = function(config) {
  config.set({

    // base path that will be used to resolve all patterns (eg. files, exclude)
    basePath: '',


    // frameworks to use
    // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
    frameworks: ['jasmine'],


    // list of files / patterns to load in the browser
    files: [
     'app/app.js',
     'tests/*.js'
    ],

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


    // preprocess matching files before serving them to the browser
    // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
    preprocessors: {
    },


    // test results reporter to use
    // possible values: 'dots', 'progress'
    // available reporters: https://npmjs.org/browse/keyword/karma-reporter
    reporters: ['progress'],


    // web server port
    port: 9876,


    // enable / disable colors in the output (reporters and logs)
    colors: true,


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


    // enable / disable watching file and executing tests whenever any file changes
    autoWatch: true,


    // start these browsers
    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
    browsers: ['Chrome'],


    // Continuous Integration mode
    // if true, Karma captures browsers, runs the tests and exits
    singleRun: false
  });
};

tests/main.spec.js:

import Foo from '../app/app.js';

describe('ES6 Foo', function () {

  let foo;

  beforeEach(()=>{
      foo = new Foo();
  });

    it('should call foo.thing and test default value', function(){
        expect(foo.thing).toEqual(0);
    });
});

index.html

<html>
    <head>
        <script src="./js/traceur.js"></script>
        <script src="./jspm_packages/system.js"></script>
        <script src="./js/angular2.js"></script>
    </head>
    <body>
        <main-app></main-app>
        <script>
            System.import('app/app');
        </script>
    </body>
</html>

app.ts

/// <reference path="../typings/angular2/angular2"/>
import {bootstrap, Component, View} from 'angular2/angular2'

@Component({
    selector:'main-app',
    injectables: [

    ]
})

@View({
  templateUrl: 'app/main.html',
})

class MainApp {
    thing;
    constructor(){
        this.thing = 0
    }

    add(){
        this.thing++;
    }
    subtract(){
        this.thing--;
    }
}

bootstrap(MainApp);

Answer 1

您的问题与此错误直接相关

https://github.com/angular/angular/issues/2049

问题是模块加载器是从错误的 URL 加载的（因此您看到的是 404 错误），这使得系统不可用。

Angular2 团队将 Protractor 与 Webdriver 结合使用。您应该能够 Chrome 在该配置下工作。

使用 typescript 和 angular 2 的 Karma 测试抛出 Typeerror for "System.config"

Karma testing with typescript and angular 2 is throwing Typeerror for "System.config"

javascript

unit-testing

typescript

karma-jasmine

angular

问题：