我对测试非常陌生,我使用 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 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
});
};
测试/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);
});
});
索引.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>
应用程序.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);