tutorial-vue-jest

Tutorial for Vue 3.3 + Jest 29.x

Vue3.3 + Jest 单元测试入门与实践

本教程将基于以下两种单元测试框架来介绍单元测试的编写及实践

• Jest（当前教程） https://jestjs.io/docs/getting-started
• Vitest https://vitest.dev/guide

前提条件

安装以下依赖：

• Node.js LTS 版本（>= 16.x）
• Pnpm 包管理工具（>= 8.x）

测试环境搭建

• 引言与框架选择

  • 单元测试在前端开发中的重要性
  • Jest 和 Vitest 的简介和特点

• 测试环境搭建（用例目录结构配置）

  • 安装和 Jest

Vue3 测试用例编写

• 编写第一个 Vue3 组件测试用例（先写一个add(1,2).toBe(3) 的用例，再写一个基础的 Vue3 组件）
• 测试 Vue3 组件的渲染、行为、状态和属性
• Vue3 异步组件的测试
• 集成单测到现有 Vue3 项目

Vitest

• Vitest 简介与安装
• 使用 Vitest 替代 Jest 运行测试用例
• Vitest VS Jest 差异对比
• 总结 & 资料推荐