Angular CLI - ng test 命令

本章通过示例解释了 ng test 命令的语法、参数和选项。

句法

ng test 命令的语法如下 -

ng test <project> [options]
ng t <project> [options]

ng test 在 Angular 应用程序代码上运行单元测试用例。

论点

ng test 命令的参数如下 -

先生。 参数和语法 描述
1 <项目> 要测试的项目的名称。

选项

选项是可选参数。

先生。 选项和语法 描述
1 --browsers=浏览器 覆盖运行测试的浏览器。
2 --codeCoverage=true|false

输出代码覆盖率报告。

默认值：假
3 --codeCoverage排除 要从代码覆盖率中排除的 Glob。
4 --configuration=配置

命名的构建目标，如 angular.json 的“配置”部分中所指定。每个命名目标都附有该目标的选项默认配置。显式设置会覆盖“--prod”标志

别名：-c
5 --help=true|false|json|JSON

在控制台中显示此命令的帮助消息。

默认值：假
6 - 包括

相对于工作区或项目根目录要包含的文件团。有两种特殊情况 -

  • 当提供目录路径时，将包含所有以“.spec.@(ts|tsx)”结尾的规范文件。

  • 当提供文件路径并且存在匹配的规范文件时，它将被包含在内。
7 --karmaConfig=karmaConfig Karma 配置文件的名称。
8 --主=主 主入口点文件的名称。
9 - 轮询 启用并定义文件监视轮询时间段（以毫秒为单位）。
10 --polyfills=polyfills Polyfills 文件的名称。
11 --preserveSymlinks=true|false

解析模块时不要使用真实路径。

默认值：假
12 --prod=真|假 “--configuration=生产”的简写。如果为 true，则将构建配置设置为生产目标。默认情况下，生产目标是在工作区配置中设置的，以便所有构建都利用捆绑、有限的树摇动以及有限的死代码消除。
13 --进度=真|假 构建时将进度记录到控制台。
13 --进度=真|假 构建时将进度记录到控制台。
14 ——记者 噶记者使用。直接传递给业力转轮。
15 --sourceMap=true|false

输出源图。

默认值：true
16 --tsConfig=tsConfig TypeScript 配置文件的名称。
17 号 --watch=true|false 当文件更改时运行构建。
18 --webWorkerTsConfig=webWorkerTsConfig Web Worker 模块的 TypeScript 配置。

首先转到使用ng build命令更新的 Angular 项目。本章的链接是https://www.tutorialspoint.com/angular_cli/angular_cli_ng_build.htm。

现在运行测试命令。

例子

下面给出了 ng test 命令的示例 -

\>Node\>TutorialsPoint> 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

应用程序.组件.规格.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();
   });
});

现在运行测试命令。

例子

下面给出一个例子 -

\>Node\>TutorialsPoint> 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 还会打开浏览器并显示测试状态。

单元测试