测试二次封装的 UI 组件 有了 Testing Library 这个神器之后。编写单元测试变得容易多了。当然，对于基于原生 UI 组件测试来说，这并不是问题。然而在实际开发中，我们会用到第三方的 UI 组件库。比如在国内，开发 Vue 应用一般会选用 Element UI 作为组件库，开发 React 应用一般会选用 antd。这些第三方的 UI 组件库组件很多具有复杂的交互功能，基于它们进行二次封装 UI 组件就比较难测试。原因有如下几个方面。

编写易于测试的 Vue 3 组件 最近 Vue Test Utils 2.0 正式版终于发布了！Vue Test Utils（VTU）帮助你为 Vue 组件编写测试。然而，VTU 的功能也有限，比如我们无法使用包裹器方法 setData 来修改 script setup 中的响应式数据。以下是一些建议，帮助你编写易于测试的代码，并编写有意义且易于维护的测试。

使用 Vitest 模拟 Vue Router Vue Router 4 是 Vue 3 的官方路由库。自从引入了组合式 API，我们可以在新版的 Vue Router 中使用新的组合式函数。那么我们该如何来模拟这些函数呢？目前 Vue Test Utils 官网文档并没有这方面的介绍。因此，本教程将讲解如何使用 Vitest 模拟 Vue Router，以便测试依赖于应用程序导航的业务逻辑。

Testing Library 用户交互 本文将介绍Testing Library 用户交互，包括发送事件、使用 Jest 函数模拟、异步方法、出现消失、fireEvent 的注意事项和使用 Fake Timers

Testing Library 查询 在 Testing Library中，Queries（查询）是用于在页面上查找元素的方法。查询包括几种不同类型，如 getBy...、queryBy... 和 findBy...。根据查询的类型和行为，它们会返回匹配的元素或 Promise，并根据需要重试查询。