如何用angular-cli只执行一个测试规范

我用Angular-CLI构建了Angular2项目(beta 20)。

是否有一种方法仅针对一个选定的规范文件运行测试?

我曾经有一个基于Angular2的项目,我可以手动向jasmine文件添加规格。但我不知道如何在因果测试之外设置这个,也不知道如何用Angular-CLI构建将因果测试限制在特定的文件上。

235819 次浏览

你的每个.spec.ts文件都有它所有的测试分组在describe块中,就像这样:

describe('SomeComponent', () => {...}

你可以通过在describe函数名前加上f来轻松地运行这个单独的块:

fdescribe('SomeComponent', () => {...}

如果你有这样的函数,没有其他describe块将运行。 顺便说一句。你可以用it => fit做类似的事情,还有一个“黑名单”版本- x。所以:< / p >
  • fdescribefit导致以这种方式标记的只有函数运行
  • xdescribexit导致以这种方式标记的除了函数运行

我自己用grunt解决了这个问题。我有下面的grunt脚本。该脚本所做的是获取要运行的特定测试的命令行参数,并创建test的副本。Ts并把这个特定的测试名称放在那里。

要运行此命令,首先使用以下命令安装grunt-cli:

npm install -g grunt-cli

将以下grunt依赖放在package.json中:

"grunt": "^1.0.1",
"grunt-contrib-clean": "^1.0.0",
"grunt-contrib-copy": "^1.0.0",
"grunt-exec": "^2.0.0",
"grunt-string-replace": "^1.3.1"

要运行它,将下面的grunt文件保存为根文件夹中的Gruntfile.js。然后从命令行运行它:

grunt --target=app.component

这将运行app.component.spec.ts。

Grunt文件如下:

/*
This gruntfile is used to run a specific test in watch mode. Example: To run app.component.spec.ts , the Command is:
grunt --target=app.component
Do not specific .spec.ts. If no target is specified it will run all tests.
*/
module.exports = function(grunt) {
var target = grunt.option('target') || '';
// Project configuration.
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
clean: ['temp.conf.js','src/temp-test.ts'],
copy: {
main: {
files: [
{expand: false, cwd: '.', src: ['karma.conf.js'], dest: 'temp.conf.js'},
{expand: false, cwd: '.', src: ['src/test.ts'], dest: 'src/temp-test.ts'}
],
}
},
'string-replace': {
dist: {
files: {
'temp.conf.js': 'temp.conf.js',
'src/temp-test.ts': 'src/temp-test.ts'
},
options: {
replacements: [{
pattern: /test.ts/ig,
replacement: 'temp-test.ts'
},
{
pattern: /const context =.*/ig,
replacement: 'const context = require.context(\'./\', true, /'+target+'\\\.spec\\\.ts$/);'
}]
}
}
},
'exec': {
sleep: {
//The sleep command is needed here, else webpack compile fails since it seems like the files in the previous step were touched too recently
command: 'ping 127.0.0.1 -n 4 > nul',
stdout: true,
stderr: true
},
ng_test: {
command: 'ng test --config=temp.conf.js',
stdout: true,
stderr: true
}
}
});


// Load the plugin that provides the "uglify" task.
grunt.loadNpmTasks('grunt-contrib-clean');
grunt.loadNpmTasks('grunt-contrib-copy');
grunt.loadNpmTasks('grunt-string-replace');
grunt.loadNpmTasks('grunt-exec');
// Default task(s).
grunt.registerTask('default', ['clean','copy','string-replace','exec']);


};

src文件夹中配置test.ts文件:

const context = require.context('./', true, /\.spec\.ts$/);

/\.spec\.ts$/替换为要测试的文件名。例如:/app.component\.spec\.ts$/

这将只对app.component.spec.ts运行测试。

如果你想控制从命令行中选择哪些文件,我在Angular 7中做到了这一点。

总之,你需要安装@angular-devkit/build-angular:browser,然后创建一个自定义webpack插件来传递测试文件regex。例如:

angular.json -从@angular-devkit/build-angular:browser更改测试构建器并设置自定义配置文件:

...


"test": {
"builder": "@angular-builders/custom-webpack:browser",
"options": {
"customWebpackConfig": {
"path": "./extra-webpack.config.js"
},
...

extra-webpack.config.js -创建webpack配置,从命令行读取regex:

const webpack = require('webpack');
const FILTER = process.env.KARMA_FILTER;
let KARMA_SPEC_FILTER = '/.spec.ts$/';
if (FILTER) {
KARMA_SPEC_FILTER = `/${FILTER}.spec.ts$/`;
}
module.exports = {
plugins: [new webpack.DefinePlugin({KARMA_SPEC_FILTER})]
}

test.ts编辑规范

...
// Then we find all the tests.
declare const KARMA_CONTEXT_SPEC: any;
const context = require.context('./', true, KARMA_CONTEXT_SPEC);

然后使用如下方法覆盖默认值:

KARMA_FILTER='somefile-.*\.spec\.ts$' npm run test

我记录了基本信息在这里,提前为类型和错误链接道歉。感谢@Aish-Anu上面的回答,为我指明了正确的方向。

这在Angular 7中为我工作。它基于ng命令的——main选项。我不确定这个选项是否没有记录,是否可能会更改,但它适合我。我在包里放了条线。Json文件在脚本部分。在这里,我使用ng test命令的——main选项指定了.spec文件的路径。ts文件,我想执行。例如

"test 1": "ng test --main E:/WebRxAngularClient/src/app/test/shared/my-date-utils.spec.ts",

您可以像运行任何此类脚本一样运行该脚本。我通过点击npm部分的“test 1”在Webstorm中运行它。

你只能用角CLI (ng命令)测试特定的文件,就像这样:

ng test --main ./path/to/test.ts

其他文档位于https://angular.io/cli/test

注意,虽然这适用于独立的库文件,但不适用于angular组件/服务等。这是因为angular文件依赖于其他文件(即angular 7中的src/test.ts)。遗憾的是,--main标志不接受多个参数。

对于像我这样正在寻找一种在Angular中运行单一规范的方法并发现了这个SO的人来说更是如此。

根据最新的Angular文档(撰写本文时为v9.0.6), ng test命令有一个--include选项,你可以在其中指定一个*.spec.(ts|tsx)文件目录,也可以只指定一个.spec.(ts|tsx)文件本身。

< a href = " https://angular。Io /cli/test" rel="nofollow noreferrer">https://angular.io/cli/test

只需要在src文件夹中的test.ts文件中做一些小更改:

const context = require.context('./', true, /test-example\.spec\.ts$/);

在这里,test-example是我们需要运行的确切文件名

同样地,如果你只需要测试服务文件,你可以像"/test-example.service"这样替换文件名。

这在任何情况下都对我有效:

ng test --include='**/dealer.service.spec.ts'

但是,我通常得到“TypeError: Cannot read property 'ngModule' of null”;:

ng test --main src/app/services/dealer.service.spec.ts

@angular/cli 10.0.4版本

在bash终端中,我喜欢使用双破折号。使用VS Code,你可以在资源管理器或打开选项卡上右键单击规范文件。然后选择“复制相对路径”。运行下面的命令,从剪贴板粘贴相对路径。

npm t -- --include relative/path/to/file.spec.ts

双破折号表示npm t命令选项的结束,并将之后的任何内容传递给指向ng t的下一个命令。它不需要任何修改,很快就能得到想要的结果。

使用--include

它的工作与--include

ng test --include src/app/path-to-component/path-component.component.spec.ts

我尝试了--main,但它显示所有失败的结果,而它不是。我认为--main将改变主test.ts文件。

一个简单的方法是用f启动描述和所有

fdescribe('testecomponente', () => {
fit('should create', () => {
//your code
}
  

}
  

在angular-cli中,你可以运行这个命令,测试只会包含你想要的spec文件。

Ng测试——包括规格文件的路径

如果你在一个使用monorepo架构的项目中工作,那么你必须在命令行中把项目的名字写在脚本后面。 例如:< / p >
ng test MyProject1Name -- --include='myComponent.component.spec.ts'

仅适用于JetBrains WebStorm用户

我没有全局安装ng,所以不能从命令行运行ng test ...。我也不能安装它,因为它可能会把我现有代码库的Angular版本搞砸。我使用JetBrains WebStorm IDE,在其中,您可以右键单击规范文件并运行测试。

enter image description here