Angular 5应用程序中量角器测试的代码覆盖率

Question

我有一个带有量角器的角度cli应用程序。 我想为量角器生成代码覆盖率报告。

https://www.npmjs.com/package/grunt-protractor-coverage无法在我的项目中使用此功能。

https://www.npmjs.com/package/protractor-istanbul-plugin发现它不适用于打字稿文件。

有没有办法使用Angular 5应用程序为量角器e2e测试用例生成代码覆盖率？

Answer 1

一段时间以来，我一直在寻求针对相同场景的答案，但是对于通过角度cli生成作业（ng build）生成的乐器束并没有直接的解决方案。

有两种方法可以实现这一目标-

1. 我们可以使用istanbul-instrumenter-loader使用customWebpackConfig的webpack配置-如果您使用的是Angular 8，则适用。
2. 我们可以通过（通过ngject）生成webpack，然后可以借助webpack插件-istanbul-instrumenter-loader来实现这一点。 -如果您使用的是Angular 5，则适用。在Angular CLI 6中，ng eject-命令已删除，并且不会返回。

步骤：-

1. 使用customWebpackConfig或webapck和istanbul-instrumenter-loader的工具用户捆绑包
   1. ref- http://opensourceforgeeks.blogspot.com/2018/12/how-to-customize-build-configuration.html
   2. ref- https://webpack.js.org/loaders/istanbul-instrumenter-loader/#with-babel
2. 在已检测的捆绑包上运行e2e / IT测试服
3. 从浏览器上下文中收集您的istanbul coverage（window.__ coverage__）json并将其另存为coverage.json文件。
4. 使用伊斯坦布尔注释istanbul report（应在全球范围内安装伊斯坦布尔）来提供可见的报告，它将生成带有HTML文件的coverage/lcov-report文件夹，以查看每个文件的代码覆盖率报告。