Skip to main content

前端自动化测试

单元测试​

不同的测试会形成一个测试金字塔：

测试金字塔

一般来讲，软件开发中单元测试是做的最多的。

从测试金字塔的角度来看，越往上测试的成本是逐渐增加的，因为越到后期才抛出的 Bug，程序员要修复这个 Bug 所投入的精力和时间就会越多，另外越往上测试的运行速度越是逐渐增加。

单元测试相比其他两种测试，有如下的优点：

  • 写起来是最容易的。
  • 运行速度是最快的。
  • 反馈效果是最好的。

作为前端开发，写得最多的就是单元测试，因为平时面对得最多的就是组件，组件就可以看作是一个一个最最基础的单元，我们需要保证这些组件功能的完整性，对组件的测试也是属于单元测试。

软件开发模型​

软件开发模型就是软件开发流程的演变，不同的开发流程最终形成不同的开发模型。

  • 瀑布开发模型。
  • 敏捷开发模型。
  • DevOps开发模型。

瀑布开发模型​

这个是最早期就存在的一种模型，整个瀑布模型由以下几个阶段组成：

瀑布开发模型

  1. 需求分析：在进行软件开发之前，首先是做需求分析，明确要开发的软件有哪些需求，最终形成需求文档。
  2. 设计：需求分析完成之后，紧接着就是设计阶段
    • 界面设计：UI设计师会根据需求文档来设计界面。
    • 程序设计：模块如何划分、有哪些接口、基本业务的处理流程等。
  3. 编码与实现：根据设计好的方案，通过编码去实现。
  4. 测试：根据所书写的代码，去做功能上的测试。
  5. 发布与维护：发布上线，并且持续的维护产品。

瀑布模型作为整个软件开发模型中最最早期的一个模型，是一个非常经典的模型，后面的模型都是基于瀑布模型的基础上做了一定的变化产生的。

敏捷开发模型​

敏捷开发模型是一种从90年代开始逐渐引起广泛注意的新型软件开发模型，这种模式主要是用于应对需求频繁变化和需求快速开发的场景。

敏捷开发模型

在敏捷开发模型中，软件开发会被分解为一系列短周期的迭代，每个迭代都包括需求分析、设计、编码实现、测试和部署，开发团队在迭代过程中会不断的和客户进行沟通和交流，随时根据客户的反馈进行方案的调整，保证软件开发方向上面的正确性。

DevOps开发模型​

Dev即Development（开发），Ops即Operations（运维），DevOps基本上就涵盖一个软件开发中的各个阶段。

在 DevOps开发模型，要做的就是通过自动化来实现软件的交付流程，让整体的构建、测试、发布都更加的快速，频繁。

DevOps开发模型

  • 持续开发：软件不断开发的阶段，整个软件交付的结果会被拆分成多个短周期的任务，每个任务完成之后立马进行交付
  • 持续测试：这里就会用到一些自动化测试工具，对上一个步骤中开发所涉及的代码进行测试，自动的跑一遍测试用例
  • 持续集成：测试通过之后，将新的代码集成到现有的软件里面
  • 持续部署：新的代码已经集成进去了，接下来就是将新集成的代码进行一个部署，部署到各个环境里面。
  • 持续监控：部署上线之后，我们需要对部署的代码进行一个持续的监控操作，以避免部署的代码出现任何的问题

自动化测试​

自动化测试属于DevOps开发模式里面的一个阶段，主要就是指对新的代码通过一些自动化工具和测试框架进行一个全自动的测试操作。测试通过之后，进入下一个步骤。

前端测试框架​

不同的测试框架会有不同的测试重点，比如有的偏向于单元测试，有的偏向于E2E测试。

Jest​

一个由 Facebook 开发的 JavaScript 测试框架。它可以用于测试 React 应用程序，也可以用于测试其他类型的 JavaScript 应用程序。它具有简单易用、快速执行、自动化断言等特点。

Mocha​

一个功能强大的JavaScript测试框架，可用于测试任何类型的JavaScript应用程序。它支持多种测试风格（如 BDD 和 TDD），具有丰富的插件和扩展功能。

Jasmine​

一个行为驱动的JavaScript测试框架，提供了一个易于阅读和编写测试的语法。它可以运行在浏览器和 Node.js 环境中，具有自动化断言、Spy 等功能。

Cypress​

一个现代化的自动化测试工具，专注于端到端的功能测试。它具有简单易用、快速执行、可靠性高、可视化测试等特点，支持 Chrome、Firefox、Edge 等多个浏览器。

Puppeteer​

一个由 Google 开发的 Node.js 库，Puppeteer 基于 Chrome DevTools 协议开发，可以完全控制 Chromium 或 Chrome 浏览器，包括页面的加载、截图、交互等操作。Puppeteer提供了一套稳定的 API，可以确保测试结果的可靠性和一致性。另外，Puppeteer 不仅可以用于自动化测试，还可以用于爬虫、性能测试、页面截图等各种场景。

Vitest​

下一代测试框架，原生支持Vite，提供了与之兼容的API，允许在大多数项目中将其作为备选使用。同时还包括了单元测试时最常见的功能（模拟，快照以及覆盖率）。

Last updated on