Bokk的博客

前言测试除了可以让我们对线上代码更有信心，更重要的是当需要重构代码时，有测试用例的代码才叫重构，没有测试用例的代码叫重写所以，测试对于软件工程来说是非常重要的，本文主要解决context全局组件的测试如果对React测试不熟悉的话可以参考我之前的React的测试 - 基本的HTML测试一、background1.1问题对于全局组件，其实每一个子组件都应该被该组件包裹，如果每次都用context.provider包裹测试组件，将会比较冗余，我们需要一个render方法已发，这个render

前言测试除了可以让我们对线上代码更有信心，更重要的是当需要重构代码时，有测试用例的代码才叫重构，没有测试用例的代码叫重写所以，测试对于软件工程来说是非常重要的，本文将模拟http的请求如果对React测试不熟悉的话可以参考我之前的React的测试 - 基本的HTML测试一、 background1.1 mocking data很多时候前端需要请求后端数据，mocking data做测试使用就很有必要了1.2 API这里使用的是MSW，其中mocking的方法如下const serv

前言测试除了可以让我们对线上代码更有信心，更重要的是当需要重构代码时，有测试用例的代码才叫重构，没有测试用例的代码叫重写所以，测试对于软件工程来说是非常重要的，本文讲讲表单中的测试如果对React测试不熟悉的话可以参考我之前的React的测试 - 基本的HTML测试一、example1.1 测试的组件我们需要测试一个表单，用户输入username以及password就可以点击提交，需要测试点击submit后提交的内容与用户输入的一致1.2 render组件首先需要render测试的

目录前言一、example1.1 测试的组件1.2 create div element1.3 获取需要测试的元素1.4 模拟用户的事件1.5 清理DOM二、使用React Testing Library2.1 新的React组件包裹API2.2 获取元素2.3 模拟用户事件三、避免实现细节3.1 background3.2 借助screen3.3 Chrome插件总结前言测试除了可以让我们对线上代码更有信心，更重要的是当需要重构代码时，有测试用例的代码才叫重构，没有测试用例的代码叫重写所以，测