使用 Angular CLI 执行单元测试

2020-08-27 08:00:00 · 飞浪

介绍 AngularCLI可以说是Angular框架中最强大的部分。除了让您能够生成新项目、组件和服务之外，AngularCLI还为您提供了轻松对应用或项目进行单元测试所需的工具。在本指

介绍

Angular CLI 可以说是 Angular 框架中最强大的部分。除了让您能够生成新项目、组件和服务之外，Angular CLI 还为您提供了轻松对应用或项目进行单元测试所需的工具。在本指南中，您将学习如何使用 Angular CLI 测试新的 Angular 项目。您在本指南中学习的基础知识将适用于仍使用默认 Angular 单元测试框架 (Jasmine) 和测试运行器 (Karma) 的现有 Angular 项目。

让我们开始吧！

开始单元测试

可以使用 NPM 运行以下命令将 Angular CLI 下载到你的机器上：

      npm install -g @angular/cli

您现在可以使用ng命令访问 CLI。要查看可用命令的完整列表，请运行ng -h。

您将在本指南中学习的命令是ng test命令。首先，您需要创建一个新的 Angular 应用来进行测试。通过 CLI 引导 Angular 应用非常简单，只需运行以下命令：

      ng new dog-breed-app

此命令将在当前目录中创建一个名为dog-breed-app 的新 Angular 应用。在下一节中，您将学习如何通过 CLI 测试此项目和未来的 Angular 项目。按照屏幕上的提示操作并等待新应用的所有依赖项下载后，您就可以运行单元测试了！您可以通过 CLI 在根项目目录中运行ng test来执行应用的单元测试。

运行ng test时，会发生两件事。首先，Angular 使用 Karma 测试运行器打开一个新的浏览器窗口，其中包含单元测试的报告机制。基本上，这个窗口会显示测试的输出以及可能发生的任何错误。测试运行器准备就绪后，Angular 会通过 Jasmine 测试框架执行单元测试。

可用选项

ng test命令开箱即用，非常棒！但是，如果您想自定义此命令以更好地满足您的应用需求，该怎么办？Angular 可以满足您的需求！ng test命令提供了一个命名参数，它是可选的，并且对应于您要测试的项目。一个 Angular 工作区可以包含多个项目，因此此功能允许您指定。但是，在这种情况下，我们生成的新应用只有一个默认项目。

除了这个命名参数之外，ng test CLI 命令还有许多其他选项可供您使用。下面，您可以找到一些最有用的选项的细分：

browsers：此选项允许您直接指定要在哪些浏览器内运行单元测试
codeCoverage：一个布尔值，指示是否要为此单元测试运行生成完整的代码覆盖率报告
include：这个非常有用的选项允许您指定全局文件模式，以指定要运行的单元测试（而不是运行所有单元测试）
karmaConfig：自定义 Karma 配置的文件路径，您可以通过它进一步自定义单元测试体验
记者：这允许您指定要使用的自定义 Karma 记者
watch：如果将此选项设置为 true，则每次更改项目源代码时都会继续重新运行测试

这还不是所有可用的选项！还有其他选项，例如，包括用于单元测试 Web Worker 的精美功能。如您所见，Angular CLI 通过为您提供大量控制和自定义功能，在测试项目时为您提供了全方位的服务。

结论

在本指南中，您学习了如何轻松生成新的 Angular 应用并通过 Angular CLI 为其执行单元测试。您了解到，在使用 Karma 测试运行器时，可以使用ng test命令通过 Jasmine 测试框架执行所有单元测试。您现在还了解了可以直接与ng test命令一起使用的所有选项，以进一步自定义您的单元测试体验。

借助这些可用选项，您可以自信地测试您的 Angular 项目！有关更多信息，请查看 Angular 测试文档。