Angular CLI - ng e2e 命令
本章通过示例解释了 ng e2e 命令的语法、参数和选项。 这里，e2e是指端到端。
语法
ng e2e命令的语法如下 −
ng e2e <project> [options] ng e <project> [options]
ng e2e 构建、提供应用程序，然后使用 Protractor 运行端到端测试用例。 Options 是可选参数。
参数
ng e2e命令的参数如下 −
| 序号 | 参数 & 语法 | 说明 |
|---|---|---|
| 1 | <project> | 要测试的项目名称。 |
选项
Options 是可选参数。
| 序号 | 选项 & 语法 | 说明 |
|---|---|---|
| 1 | --baseUrl=baseUrl | protractor 连接的基本 URL。 |
| 2 | --configuration=configuration |
命名的构建目标，如 angular.json 的"configurations"部分中所指定。 每个命名目标都附有该目标的选项默认配置。 显式设置此选项会覆盖"--prod"标志 别名: -c |
| 3 | --devServerTarget=devServerTarget | 要针对其运行测试的开发服务器目标。 |
| 4 | --grep=grep | 执行名称与模式匹配的规范，该模式在内部编译为正则表达式。 |
| 5 | --help=true|false|json|JSON |
在控制台中显示此命令的帮助消息。 默认: false |
| 6 | --host=host | 要监听的主机。 |
| 7 | --invertGrep=true|false |
反转由 'grep' 选项指定的选择。 默认: false |
| 8 | --port | 用于为应用程序提供服务的端口。 |
| 9 | --prod=true|false | "--configuration=Production"的简写。 当 true 时，将构建配置设置为生产目标。 默认情况下，生产目标是在工作区配置中设置的。 |
| 10 | --protractorConfig=protractorConfig | Protractor 配置文件的名称。 |
| 11 | --specs | 覆盖 Protractor 配置中的规格。 |
| 12 | --suite=suite | 覆盖 Protractor 配置中的套件。 |
| 13 | --webdriverUpdate=true|false |
尝试更新网络驱动程序。 默认: true |
首先移动到使用 ng build 命令更新的 Angular 项目。该项目可在 https://www.cainiaomax.com/angular_cli/angular_cli_ng_build.html 上找到。
现在运行 e2e 命令。
示例
下面给出了 ng e2e 命令的示例 −
\>Node\>TutorialsPoint> ng e2e
...
chunk {main} main.js, main.js.map (main) 14.3 kB [initial] [rendered]
chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 141 kB [initial] [rendered]
chunk {runtime} runtime.js, runtime.js.map (runtime) 6.15 kB [entry] [rendered]
chunk {styles} styles.js, styles.js.map (styles) 12.4 kB [initial] [rendered]
chunk {vendor} vendor.js, vendor.js.map (vendor) 3 MB [initial] [rendered]
Date: 2020-06-06T04:20:15.029Z - Hash: 16f321e3d4599af26622 - Time: 20899ms
** Angular Live Development Server is listening on localhost:4200, open your bro
wser on http://localhost:4200/ **
: Compiled successfully.
...
workspace-project App
x should display welcome message
- Failed: No element found using locator: By(css selector, app-root .content span)
...
From: Task: Run it("should display welcome message") in control flow
...
**************************************************
* Failures *
**************************************************
1) workspace-project App should display welcome message
- Failed: No element found using locator: By(css selector, app-root .content span)
Executed 1 of 1 spec (1 FAILED) in 2 secs.
现在要修复故障，请更新 app.component.html
app.component.html
<div class="content" role="main">
<span>{{ title }} app is running!</span>
</div>
<app-goals></app-goals>
<router-outlet></router-outlet>
现在运行 e2e 命令。
示例
下面给出了 ng e2e 命令的示例 −
\>Node\>TutorialsPoint> ng e2e
...
chunk {main} main.js, main.js.map (main) 14.9 kB [initial] [rendered]
chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 141 kB [initial] [rendered]
chunk {runtime} runtime.js, runtime.js.map (runtime) 6.15 kB [entry] [rendered]
chunk {styles} styles.js, styles.js.map (styles) 12.4 kB [initial] [rendered]
chunk {vendor} vendor.js, vendor.js.map (vendor) 3 MB [initial] [rendered]
Date: 2020-06-06T04:28:33.514Z - Hash: 5d8bf2fc7ff59fa390b0 - Time: 10529ms
** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **
: Compiled successfully.
...
workspace-project App
√ should display welcome message
Executed 1 of 1 spec SUCCESS in 2 secs.
ng e2e 还会打开浏览器并使用它通过 UI 运行验收测试用例。
