Karma / Jasmine问题与Angular2项目
我的项目看起来像：
我试图让Karma / Jasmine作为测试框架。我尝试复制这个项目：https://github.com/juliemr/ng2-test-seed，根据我的需要修改它。我在test文件夹中进行了模拟测试，我试图让它运行。但是，当我尝试npm run test这是我得到的：
我不确定karma-test-shim.js / karma.conf.js中的文件路径是否正确，因为我对使用npm / node项目仍然相对较新。
以下是我的karma-test-shim.js（文件路径位于var moduleName和onlyAppFiles函数中）：
// Tun on full stack traces in errors to help debugging
Error.stackTraceLimit = Infinity;
jasmine.DEFAULT_TIMEOUT_INTERVAL = 1000;
// // Cancel Karma's synchronous start,
// // we will call `__karma__.start()` later, once all the specs are loaded.
__karma__.loaded = function() {};
System.config({
packages: {
'base/src/app': {
defaultExtension: false,
format: 'register',
map: Object.keys(window.__karma__.files).
filter(onlyAppFiles).
reduce(function createPathRecords(pathsMapping, appPath) {
// creates local module name mapping to global path with karma's fingerprint in path, e.g.:
// './hero.service': '/base/src/app/hero.service.js?f4523daf879cfb7310ef6242682ccf10b2041b3e'
var moduleName = appPath.replace(/^\/base\/app\/.*\/.*\//, './').replace(/\.js$/, '');
pathsMapping[moduleName] = appPath + '?' + window.__karma__.files[appPath]
return pathsMapping;
}, {})
}
}
});
System.import('angular2/testing').then(function(testing) {
return System.import('angular2/platform/testing/browser').then(function(providers) {
testing.setBaseTestProviders(providers.TEST_BROWSER_PLATFORM_PROVIDERS,
providers.TEST_BROWSER_APPLICATION_PROVIDERS);
});
}).then(function() {
return Promise.all(
Object.keys(window.__karma__.files) // All files served by Karma.
.filter(onlySpecFiles)
// .map(filePath2moduleName) // Normalize paths to module names.
.map(function(moduleName) {
// loads all spec files via their global module names (e.g. 'base/src/app/hero.service.spec')
return System.import(moduleName);
}));
})
.then(function() {
__karma__.start();
}, function(error) {
__karma__.error(error.stack || error);
});
function filePath2moduleName(filePath) {
return filePath.
replace(/^\//, ''). // remove / prefix
replace(/\.\w+$/, ''); // remove suffix
}
function onlyAppFiles(filePath) {
return /^\/base\/app\/.*\/.*\/.*\.js$/.test(filePath)
}
function onlySpecFiles(path) {
return /_test\.js$/.test(path);
}
我的karma.conf.js：
module.exports = function(config) {
config.set({
basePath: '',
frameworks: ['jasmine'],
files: [
// paths loaded by Karma
{pattern: 'node_modules/systemjs/dist/system-polyfills.js', included: true, watched: true},
{pattern: 'node_modules/systemjs/dist/system.src.js', included: true, watched: true},
{pattern: 'node_modules/es6-shim/es6-shim.js', included: true, watched: true},
{pattern: 'node_modules/angular2/bundles/angular2-polyfills.js', included: true, watched: true},
{pattern: 'node_modules/rxjs/bundles/Rx.js', included: true, watched: true},
{pattern: 'node_modules/angular2/bundles/angular2.js', included: true, watched: true},
{pattern: 'node_modules/angular2/bundles/testing.dev.js', included: true, watched: true},
{pattern: 'karma-test-shim.js', included: true, watched: true},
// paths loaded via module imports
{pattern: 'app/components/**/*.js', included: false, watched: true},
{pattern: 'app/interfaces/**/*.js', included: false, watched: true},
{pattern: 'app/models/**/*.js', included: false, watched: true},
{pattern: 'app/services/**/*.js', included: false, watched: true},
// paths loaded via Angular's component compiler
// (these paths need to be rewritten, see proxies section)
{pattern: 'app/components/**/*.html', included: false, watched: true},
{pattern: 'assets/css/*.css', included: false, watched: true},
// paths to support debugging with source maps in dev tools
{pattern: 'app/*.ts', included: false, watched: false},
{pattern: 'app/components/**/*.ts', included: false, watched: true},
{pattern: 'app/interfaces/**/*.ts', included: false, watched: true},
{pattern: 'app/models/**/*.ts', included: false, watched: true},
{pattern: 'app/services/**/*.ts', included: false, watched: true},
//{pattern: 'app/**/**/*.js.map', included: false, watched: false}
],
// proxied base paths
proxies: {
// required for component assests fetched by Angular's compiler
"/app/": "/base/app/"
},
reporters: ['progress'],
port: 9876,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: true,
browsers: ['Chrome'],
singleRun: false
})
}
package.json：
{
"name": "taohd-app-seed",
"version": "1.0.0",
"scripts": {
"start": "npm run lite",
"app": "./node_modules/.bin/electron main.js",
"lite": "lite-server -c bs-config.json",
"typings": "typings",
"postinstall": "typings install",
"test": "karma start karma.conf.js"
},
"main": "main.js",
"license": "MIT",
"dependencies": {
"angular2": "^2.0.0-beta.12",
"app-module-path": "^1.0.5",
"bootstrap": "^3.3.6",
"electron-prebuilt": "^0.36.11",
"es6-module-loader": "^0.17.11",
"es6-promise": "^3.1.2",
"es6-shim": "^0.35.0",
"graceful-fs": "^4.1.3",
"jspm": "^0.16.31",
"lodash": "^4.6.1",
"moment": "^2.12.0",
"ng2-material": "^0.2.12",
"polo": "^0.8.1",
"reflect-metadata": "0.1.2",
"rxjs": "5.0.0-beta.2",
"systemjs": "^0.19.22",
"tslint": "^3.6.0",
"uuid": "^2.0.1",
"zone.js": "^0.6.6"
},
"devDependencies": {
"concurrently": "^2.0.0",
"del": "^2.2.0",
"electron-debug": "^0.5.2",
"gulp": "^3.9.1",
"gulp-coverage": "^0.3.38",
"gulp-debug": "^2.1.2",
"gulp-htmllint": "0.0.7",
"gulp-inject": "^3.0.0",
"gulp-jasmine": "^2.3.0",
"gulp-shell": "^0.5.2",
"gulp-sourcemaps": "^1.6.0",
"gulp-tslint": "^4.3.3",
"gulp-typescript": "^2.12.1",
"gulp-util": "^3.0.7",
"jasmine": "^2.4.1",
"jasmine-core": "^2.4.1",
"karma": "^0.13.22",
"karma-chrome-launcher": "^0.2.3",
"karma-cli": "^0.1.2",
"karma-jasmine": "^0.3.8",
"lite-server": "^2.1.0",
"typescript": "^1.8.9",
"typings": "^0.7.9"
},
"jspm": {
"directories": {
"baseURL": "app"
},
"dependencies": {
"angular": "github:angular/bower-angular@^1.5.2",
"systemjs-hot-reloader": "github:capaj/systemjs-hot-reloader@^0.5.6"
},
"devDependencies": {
"babel": "npm:babel-core@^5.8.24",
"babel-runtime": "npm:babel-runtime@^5.8.24",
"core-js": "npm:core-js@^1.1.4",
"traceur": "github:jmcriffey/bower-traceur@0.0.93",
"traceur-runtime": "github:jmcriffey/bower-traceur-runtime@0.0.93",
"typescript": "npm:typescript@^1.8.9"
}
}
}
谁能弄明白我哪里错了？
2 个答案:
答案 0 :(得分：2)
我最终得到它的工作，结果我得到了构建模块/运行测试错误的顺序。
以下是当前的设置，我在每个.spec.js等效文件中都有.ts/.js个文件：
我的karma.conf.js
module.exports = function(config) {
config.set({
basePath: '',
frameworks: ['jasmine'],
files: [
// paths loaded by Karma
{pattern: 'node_modules/systemjs/dist/system-polyfills.js', included: true, watched: true},
{pattern: 'node_modules/systemjs/dist/system.src.js', included: true, watched: true},
{pattern: 'node_modules/es6-shim/es6-shim.js', included: true, watched: true},
{pattern: 'node_modules/angular2/bundles/angular2-polyfills.js', included: true, watched: true},
{pattern: 'node_modules/rxjs/bundles/Rx.js', included: true, watched: true},
{pattern: 'node_modules/angular2/bundles/angular2.js', included: true, watched: true},
{pattern: 'node_modules/angular2/bundles/testing.dev.js', included: true, watched: true},
{pattern: 'karma-test-shim.js', included: true, watched: true},
// paths loaded via module imports
{pattern: 'app/components/**/*.js', included: false, watched: true},
{pattern: 'app/interfaces/*.js', included: false, watched: true},
{pattern: 'app/models/**/*.js', included: false, watched: true},
{pattern: 'app/services/**/*.js', included: false, watched: true},
// paths loaded via Angular's component compiler
// (these paths need to be rewritten, see proxies section)
{pattern: 'app/components/**/*.html', included: false, watched: true},
{pattern: 'assets/css/*.css', included: false, watched: true},
// paths to support debugging with source maps in dev tools
{pattern: 'app/*.ts', included: false, watched: false},
{pattern: 'app/components/**/*.ts', included: false, watched: false},
{pattern: 'app/interfaces/*.ts', included: false, watched: false},
{pattern: 'app/models/**/*.ts', included: false, watched: false},
{pattern: 'app/services/**/*.ts', included: false, watched: false},
{pattern: 'app/components/**/*.js.map', included: false, watched: false},
{pattern: 'app/interfaces/*.js.map', included: false, watched: false},
{pattern: 'app/models/**/*.js.map', included: false, watched: false},
{pattern: 'app/services/**/*.js.map', included: false, watched: false}
],
// proxied base paths
proxies: {
// required for component assests fetched by Angular's compiler
"/app/": "/base/app/"
},
reporters: ['progress'],
port: 9876,
colors: true,
logLevel: config.LOG_INFO,
autoWatch: true,
browsers: ['Chrome'],
singleRun: false
})
}
使用karma-test-shim.js
// Tun on full stack traces in errors to help debugging
Error.stackTraceLimit = Infinity;
jasmine.DEFAULT_TIMEOUT_INTERVAL = 1000;
// // Cancel Karma's synchronous start,
// // we will call `__karma__.start()` later, once all the specs are loaded.
__karma__.loaded = function() {};
System.config({
packages: {
'base/app': {
defaultExtension: false,
format: 'register',
map: Object.keys(window.__karma__.files).
filter(onlyAppFiles).
reduce(function createPathRecords(pathsMapping, appPath) {
// creates local module name mapping to global path with karma's fingerprint in path, e.g.:
// './hero.service': '/base/src/app/hero.service.js?f4523daf879cfb7310ef6242682ccf10b2041b3e'
var moduleName = appPath.replace(/^\/base\/app\/.*\/.*\//, './').replace(/\.js$/, '');
pathsMapping[moduleName] = appPath + '?' + window.__karma__.files[appPath]
return pathsMapping;
}, {})
}
}
});
System.import('angular2/testing').then(function(testing) {
return System.import('angular2/platform/testing/browser').then(function(providers) {
testing.setBaseTestProviders(providers.TEST_BROWSER_PLATFORM_PROVIDERS,
providers.TEST_BROWSER_APPLICATION_PROVIDERS);
});
}).then(function() {
return Promise.all(
Object.keys(window.__karma__.files) // All files served by Karma.
.filter(onlySpecFiles)
// .map(filePath2moduleName) // Normalize paths to module names.
.map(function(moduleName) {
// loads all spec files via their global module names (e.g. 'base/src/app/hero.service.spec')
return System.import(moduleName);
}));
})
.then(function() {
__karma__.start();
}, function(error) {
__karma__.error(error.stack || error);
});
function filePath2moduleName(filePath) {
return filePath.
replace(/^\//, ''). // remove / prefix
replace(/\.\w+$/, ''); // remove suffix
}
function onlyAppFiles(filePath) {
return /^\/base\/app\/.*\/.*\/.*\.js$/.test(filePath)
}
function onlySpecFiles(path) {
return /\.spec\.js$/.test(path);
}
使用gulpfile.js编译ts文件（示例）：
gulp.task('compile-components', function ()
{
del(config.components_source + '(?!.*\.spec\.js$)*.js');
return gulp
.src(config.components_source + '*.ts', { base: "." })
.pipe(debug())
.pipe(tsc(tsProjectComponents))
.pipe(gulp.dest("."));
});
步骤：
- 编译
.ts个文件 - 使用测试 创建
- 运行
karma start karma.conf.js
.spec.js个文件
答案 1 :(得分：1)
您的项目结构似乎没有src级别。因此，您将此用于karma-test-shim.js文件：
System.config({
packages: {
'base/app': { // <----- (instead of base/src/app)
defaultExtension: false,
format: 'register',
map: Object.keys(window.__karma__.files).
filter(onlyAppFiles).
reduce(function createPathRecords(pathsMapping, appPath) {
(...)
}, {})
}
}
});
我还会在pretest文件中添加package.json任务，以便在执行Karma之前编译TypeScript文件。这样的事情：
{
(...)
scripts: {
(...)
"pretest": "tsc",
"test": "karma start karma.conf.js"
}
}
相关问题
最新问题
- 我写了这段代码，但我无法理解我的错误
- 我无法从一个代码实例的列表中删除 None 值，但我可以在另一个实例中。为什么它适用于一个细分市场而不适用于另一个细分市场？
- 是否有可能使 loadstring 不可能等于打印？卢阿
- java中的random.expovariate()
- Appscript 通过会议在 Google 日历中发送电子邮件和创建活动
- 为什么我的 Onclick 箭头功能在 React 中不起作用？
- 在此代码中是否有使用“this”的替代方法？
- 在 SQL Server 和 PostgreSQL 上查询，我如何从第一个表获得第二个表的可视化
- 每千个数字得到
- 更新了城市边界 KML 文件的来源？