Angular CLI ng test 命令
本章通过示例解释 ng test 命令的语法、参数和选项。
语法
ng test 命令的语法如下:
ng test <project> [options] ng t <project> [options]
ng test 在 Angular 应用代码上运行单元测试用例。
论据
ng test 命令的参数如下:
序号. | 参数和语法 | 描述 |
---|---|---|
1 | <项目> | 要测试的项目的名称。 |
Options
选项是可选参数。
序号. | 选项和语法 | 描述 |
---|---|---|
1 | --browsers=浏览器 | 覆盖运行测试的浏览器。 |
2 | --codeCoverage=真|假 |
输出代码覆盖率报告。 默认值:假 |
3 | --codeCoverageExclude | 要从代码覆盖范围中排除的 Glob。 |
4 | --配置=配置 |
命名的构建目标,在 angular.json 的“配置”部分中指定。每个命名的目标都伴随着该目标的选项默认配置。显式设置它会覆盖“--prod”标志 别名:-c |
5 | --help=true|false|json|JSON |
在控制台中显示此命令的帮助消息。 默认值:假 |
6 | - 包括 |
要包含的文件的全局,相对于工作区或项目根目录。有两种特殊情况:
|
7 | --karmaConfig=业力配置 | Karma 配置文件的名称。 |
8 | --main=main | 主入口点文件的名称。 |
9 | --poll | 启用并定义文件监视轮询时间段(以毫秒为单位)。 |
10 | --polyfills=polyfills | polyfills 文件的名称。 |
11 | --preserveSymlinks=true|false |
解析模块时不要使用真实路径。 默认值:假 |
12 | --prod=真|假 | “--configuration=production”的简写。如果为 true,则将构建配置设置为生产目标。默认情况下,生产目标是在工作空间配置中设置的,因此所有构建都使用捆绑、有限的 tree-shaking 以及有限的死代码消除。 |
13 | --进度=真|假 | 在构建时将进度记录到控制台。 |
13 | --进度=真|假 | 在构建时将进度记录到控制台。 |
14 | ——记者 | 噶记者使用。直接传给了业力跑者。 |
15 | --sourceMap=true|false |
输出源图。 默认值:真 |
16 | --tsConfig=tsConfig | TypeScript 配置文件的名称。 |
17 | --watch=真|假 | 文件更改时运行构建。 |
18 | --webWorkerTsConfig=webWorkerTsConfig | Web Worker 模块的 TypeScript 配置。 |
首先移动到使用更新的角度项目 ng build 命令。本章的链接是 https://www.newbiego.com/angular_cli/angular_cli_ng_build.htm。
现在运行test 命令。
例子
下面给出一个 ng test 命令的例子:
\>Node\>NewbieGo> ng test ... WARN: ''app-goals' is not a known element: 1. If 'app-goals' is an Angular component, then verify that it is part of this module. 2. If 'app-goals' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.' Chrome 83.0.4103 (Windows 7.0.0): Executed 0 of 4 SUCCESS (0 secs / 0 secs) ... AppComponent should render title FAILED TypeError: Cannot read property 'textContent' of null at <Jasmine> at UserContext.<anonymous> (http:// localhost:9876/_karma_webpack_/src/app/app.component.spec.ts:33:51) ... Chrome 83.0.4103 (Windows 7.0.0): Executed 1 of 4 (1 FAILED) (0 secs / 0.203 secs) ... Chrome 83.0.4103 (Windows 7.0.0): Executed 2 of 4 (1 FAILED) (0 secs / 0.221 secs) ... Chrome 83.0.4103 (Windows 7.0.0): Executed 4 of 4 (1 FAILED) (0 secs / 0.244 sec Chrome 83.0.4103 (Windows 7.0.0): Executed 4 of 4 (1 FAILED) (0.282 secs / 0.244 secs) TOTAL: 1 FAILED, 3 SUCCESS
现在修复失败更新 app.component.spec.ts
app.component.spec.ts
import { TestBed, async } from '@angular/core/testing'; import { RouterTestingModule } from '@angular/router/testing'; import { AppComponent } from './app.component'; describe('AppComponent', () => { beforeEach(async(() => { TestBed.configureTestingModule({ imports: [ RouterTestingModule ], declarations: [ AppComponent ], }).compileComponents(); })); it('should create the app', () => { const fixture = TestBed.createComponent(AppComponent); const app = fixture.componentInstance; expect(app).toBeTruthy(); }); });
现在运行test 命令。
例子
下面给出一个例子:
\>Node\>NewbieGo> ng test ... WARN: ''app-goals' is not a known element: 1. If 'app-goals' is an Angular component, then verify that it is part of this m odule. 2. If 'app-goals' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@ NgModule.schemas' of this component to suppress this message.' Chrome 83.0.4103 (Windows 7.0.0): Executed 1 of 2 SUCCESS (0 secs / 0.053 secs) ... Chrome 83.0.4103 (Windows 7.0.0): Executed 2 of 2 SUCCESS (0.097 secs / 0.073 se cs) TOTAL: 2 SUCCESS
ng test 还会打开浏览器并显示测试状态。