Angular CLI - ng e2e 命令

本章通过示例解释了 ng e2e 命令的语法、参数和选项。这里，e2e是指端到端。

句法

ng e2e 命令的语法如下 -

ng e2e <project> [options]
ng e <project> [options]

ng e2e 构建、提供应用程序，然后使用 Protractor 运行端到端测试用例。选项是可选参数。

论点

ng e2e 命令的参数如下 -

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

选项

选项是可选参数。

先生。	选项和语法	描述
1	--baseUrl=baseUrl	Protractor连接的基本 URL。
2	--configuration=配置	命名的构建目标，如 angular.json 的“配置”部分中所指定。每个命名目标都附有该目标的选项默认配置。显式设置会覆盖“--prod”标志别名：-c
3	--devServerTarget=devServerTarget	要运行测试的开发服务器目标。
4	--grep=grep	执行名称与模式匹配的规范，该模式在内部编译为 RegExp。
5	--help=true\|false\|json\|JSON	在控制台中显示此命令的帮助消息。默认值：假
6	--主机=主机	主持人来听听。
7	--invertGrep=true\|false	反转“grep”选项指定的选择。默认值：假
8	- 港口	用于为应用程序提供服务的端口。
9	--prod=真\|假	“--configuration=生产”的简写。如果为 true，则将构建配置设置为生产目标。默认情况下，生产目标是在工作区配置中设置的，以便所有构建都利用捆绑、有限的树摇动以及有限的死代码消除。
10	--protractorConfig=Protractor配置	Protractor配置文件的名称。
11	- 眼镜	覆盖Protractor配置中的规格。
12	--套房=套房	覆盖Protractor配置中的套件。
13	--webdriverUpdate=true\|false	尝试更新网络驱动程序。默认值：true

首先转到使用ng build命令更新的 Angular 项目。该命令位于https://www.tutorialspoint.com/angular_cli/angular_cli_ng_build.htm。

现在运行 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

应用程序组件.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 运行验收测试用例。