对比React Native代码覆盖率和测试工具

lsekfe

摘要：React Native是一个JavaScript框架，用于为iOS和Android编写本地渲染的移动应用程序。使用React Native可以极大地减少构建移动应用程序所需的资源。
　　在本教程中，我们将回顾测试React Native应用程序的各种方法，并向你介绍React Native框架的一些有用的测试和代码覆盖工具。
　　我们将介绍一些自动化的方法来帮助你更快地发现和解决错误和问题，从静态分析到端到端测试和测试覆盖率报告。
　　什么是代码覆盖率？
　　代码覆盖率是一种衡量你的代码有多少被测试的机制。代码覆盖率报告是一个重要的矩阵，用来衡量你的代码有多有效和写得多好。
　　覆盖率报告提供了关于你的测试实现的反馈，这使你能够验证你的代码库的质量和正确性。
　　React Native应用程序中的测试类型
　　在我们比较React Native的测试和代码覆盖工具之前，必须了解各种类型的测试范式之间的区别：静态分析、单元测试、集成测试、组件测试和端到端（E2E）测试。
　　静态分析
　　提高代码质量的第一个方法是使用静态分析工具。
　　静态分析工具只是根据定义的规则解析和验证代码，并提供反馈，以便你可以相应地调整代码。你可以为静态分析定义你自己的规则，或者我们使用推荐的规则集。
　　流行的静态分析工具用于验证React Native应用程序的代码，包括。
　　·ESLint，一个强制执行特定代码风格的代码连接器。它分析代码并快速找到问题。你可以定义你自己的规则集或扩展一些预定义的规则集。
　　· Prettier，一个代码格式化的工具。Pettier确保整个项目的代码风格一致，并减少团队成员将冲突的代码风格（如缩进、行长、单引号或双引号等）提交到代码库的可能性。
　　· 类型检查工具，如Flow和TypeScript
　　单元测试
　　单元测试涵盖了代码的最小部分，如单个函数和类。单元测试的目的是确保你的应用程序的各个单元在隔离状态下按照预期工作。
　　单元测试在隔离状态下运行，易于编写和运行。当单元测试运行时，它提供关于测试成功或失败的快速反馈，包括代码覆盖率。
　　集成测试
　　一旦你确定你的组件是按预期工作的，你应该验证它们是否能与其他组件很好地运作。在集成测试中，你把单元测试结合起来，一起测试，以确保它们按预期工作。
　　换句话说，一个集成测试同时评估了你的应用程序的几个模块。
　　集成测试是UI测试中最关键的部分，可以给你很大的信心，使你的应用程序的功能运行良好。
　　组件测试
　　组件测试是对单个React Native组件的测试，无论它们在应用程序中用于何处。
　　组件测试使你能够创建一个组件的实例，传递给它道具，与它互动，并查看它的行为。这可以让你更快、更容易地安排边缘案例，而用端到端测试会很慢、很难设置。
　　端到端（E2E）测试
　　端到端测试是在真实设备或模拟器上运行我们的应用程序，并像真实用户一样与之互动的做法。简单地说，这意味着一个系统正在通过你的应用程序进行检查。E2E测试框架使你能够在你的应用程序的屏幕上找到并控制元素。
　　React Native的测试和代码覆盖工具
　　现在我们了解了测试代码的各种方式，让我们放大一些在React Native中测试和生成代码覆盖率报告的最流行和有用的工具。
　　Jest
　　Jest是一个基于JavaScript的测试运行器，用于创建、运行和构建测试。你可以把Jest作为一个npm包安装在你的React Native项目中。
　　Jest由Facebook开发并内置于React中，这使得它成为测试React和React Native应用程序的默认选择。它还与create-react-app ，作为一个默认的测试设置。除了React，Jest与Angular、Vue.js和TypeScript的合作也特别好。
　　Jest对代码覆盖率有内置支持。这使它与其他顶级测试框架不同，许多框架需要你添加插件来生成代码覆盖率报告。
　　你可以通过运行npx jest --coverage 或yarn --coverage 来运行Jest覆盖率。要生成HTML或JSON格式的代码覆盖率报告，你需要在package.json ，启用coverageReporters 。

1. 　"jest": {
   
2. 　　     "collectCoverage": true,
   
3. 　　     "coverageReporters": ["json", "html"],
   
4. 　　 }

复制代码

　Jest使你能够以最小的配置运行单元、集成和快照测试。Jest测试是隔离运行的，所以一个测试不会影响另一个测试的结果；所有测试都是平行运行的。Jest很容易与CLI工具集成。
　　Jest对React Native的单元和集成测试特别有用。它很容易配置、运行和模拟。
　　官方的Jest文档写得很好，并与当前版本保持一致。它也得到了广泛的社区支持。
　　解毒软件
　　Detox是一个灰盒式的端到端测试和自动化库，使你能够在真实设备上模拟应用行为。它从底层开始构建，支持React Native项目和纯原生项目。Detox还支持跨平台的设备测试（真实设备和模拟器）。
　　你可以将Detox作为一个独立的测试运行器使用，或者与另一个JavaScript测试运行器（如Jest、Mocha或Ava）串联使用。专为CI工具设计，很容易在CI平台上执行Detox E2E测试，如Travis, Jenkins。Detox在设备上运行，但还不支持iOS。
　　开发人员选择Detox是因为在真实设备或模拟器上测试他们的应用程序，使他们能够看到真实用户的样子。这是一个获得信心的好方法，在你发货之前，你的应用程序正在按照你的意图运作。
　　Detox是由Wix开发的，专门用于React Native的自动化测试。它是一个专注于JavaScript的测试工具，使其成为React Native开发者的理想选择。因此，Detox自动化测试与Jest单元测试配合得很好。
　　Appium
　　Appium是一个移动应用测试框架，支持基于React Native的应用，开箱即用。
　　如果Detox是一个灰盒测试框架，我们可以认为Appium是黑盒版本。在使用React Native时，Appium可以很容易地为Android和iOS平台编写测试案例。Selenium，底层的网络驱动，作为Appium和移动平台之间的桥梁来部署和执行测试。
　　Appium用于网络和移动应用程序的统一测试。它支持先进的测试自动化，并有完整的工具链集成。所有的测试结果都在一个地方，包括测试报告和分析。
　　Appium比Detox有更高的失误率。因为Detox专注于JavaScript，在大多数情况下，对于希望对React Native应用进行自动化测试的JavaScript开发者来说，它是比Appium更合适的选择。也就是说，对于React Native开发者来说，Appium的一个卖点是你可以把它和其他测试框架串联起来使用。
　　茉莉花
　　Jasmine是一个为测试JavaScript代码而设计的测试框架。它对浏览器或DOM没有任何依赖性。Jasmine提供了一个小的语法，使你能够测试整个应用程序的小单元，而不是把它作为一个整体来测试。
　　Jasmine不依赖任何其他JavaScript框架。Jasmine框架中使用的所有语法都是干净而明显的。Jasmine是一个开源框架，有多种形式，包括独立版本和用于Ruby Gem、Node.js等的版本。
　　对于React Native开发者来说，Jasmine是一个测试和评估代码覆盖率的好工具，因为它速度快，没有外部依赖性。它是专门为测试JavaScript代码而设计的，可以独立使用，也可以与另一个库（如Karma）一起使用。此外，Jasmine专注于单元测试，不排斥行为驱动开发。
　　Karma
　　Karma是另一个基于JavaScript的应用程序的测试工具。它是一个基于Node的工具，通过npm安装。
　　Karma是基于插件，使你能够用其他断言和测试框架来编写测试。这使得它很容易配置和快速执行测试。该测试工具在实际的浏览器环境中运行。
　　Karma使用CodeCov和Istanbul生成覆盖率报告。在运行测试时，它将在一个新的覆盖率文件夹中生成测试覆盖率。你可以通过打开覆盖率文件夹中的index.html 文件来访问覆盖率报告。
　　Karma是一个测试运行器，所以对于测试和断言，我们可以使用Jasmine、Mocha和QUnit。它在浏览器和真实设备上运行测试。由于它是一个测试运行器，Karma需要插件来执行测试。它很容易配置和设置。