Angular CLI教程

Angular CLI ng test 命令

本章解释了 ng test 命令的语法、参数和选项以及一个例子。

语法

ng test 命令的语法如下-
ng test <project> [options]
ng t <project> [options]
ng test 在 angular 应用程序代码上运行单元测试用例。

参数

ng test 命令的参数如下-
参数和语法 描述
<project> 要测试的项目名称。

选项

选项是可选参数。
选项和语法 描述
--browsers=browsers 覆盖运行测试的浏览器。
--codeCoverage=true|false
输出代码覆盖率报告。
默认:false
--codeCoverageExclude 要从代码覆盖率中排除的 Glob。
--configuration=configuration
一个命名的构建目标,在 angular.json 的"配置"部分中指定。每个命名的目标都伴随着该目标的选项默认配置。明确设置此项会覆盖"--prod"标志
别名:-c
--help=true|false|json|JSON
在控制台中显示此命令的帮助消息。
默认值:false
--include
要包含的文件全局,相对于工作区或项目根。有两种特殊情况-
当提供目录路径时,将包含所有以".spec.@(ts|tsx)"结尾的规范文件。 当提供了文件路径并且存在匹配的规范文件时,将改为包含该文件。
--karmaConfig=karmaConfig Karma 配置文件的名称。
--main=main 主入口点文件的名称。
--poll 启用并定义以毫秒为单位的文件监视轮询时间段。
--polyfills=polyfills polyfills 文件的名称。
--preserveSymlinks=true|false
解析模块时不要使用真实路径。
默认:false
--prod=true|false "--configuration=production"的简写。当为 true 时,将构建配置设置为生产目标。默认情况下,生产目标是在工作区配置中设置的,以便所有构建都使用捆绑、有限的 tree-shaking 和有限的死代码消除。
--progress=true|false 在构建时将进度记录到控制台。
--progress=true|false 在构建时将进度记录到控制台。
--reporters Karma 记者使用。直接传递给 karma runner。
--sourceMap=true|false
输出源映射。
默认值:true
--tsConfig=tsConfig TypeScript 配置文件的名称。
--watch=true|false 文件更改时运行构建。
--webWorkerTsConfig=webWorkerTsConfig Web Worker 模块的 TypeScript 配置。
首先转到使用 ng build 命令更新的 angular 项目。本章的链接是 https://www.lidihuo.com/angular_cli/angular_cli_ng_build.htm。
现在运行测试命令。

示例

下面给出了 ng test 命令的示例-
\>Node\>Lidihuo> 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();
   });
});
现在运行测试命令。

示例

下面给出了一个例子-
\>Node\>Lidihuo> 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 还会打开浏览器并显示测试状态。
单元测试
昵称: 邮箱:
Copyright © 2022 立地货 All Rights Reserved.
备案号:京ICP备14037608号-4