jest

Vue 应用单元测试的策略与实践 06 - 如何落地的几点建议

本文的目标 1. 在 Vue 项目中如何推动整个团队循序渐进地采取单元测试策略?逐步提高代码质量和测试覆盖率? // Given 一个需要在团队中推行测试策略的 Tech Lead👨‍💻‍ // When 当他 🚶 阅读本文的 Vue 应用测试策略落地部分 // Then 他能够在团队中循序渐进地推行测试策略, 他能够找到单元测试的反馈机制,追求技术卓越 Vue 应用测试策略的落地 1. 利用好“单元测试是一种政治正确” 谈到如何推进单元测试的落地,首先得要有一个开始。很多公司都在推行 OKRs 或者 KPI 机制,而技术部门如何衡量技术性的绩效呢?说实话,我们都知道技术类绩效其实不好用某些指标来衡量,但很多时候老板们都会道听途说觉得软件质量特别重要,然后大家开始用测试覆盖率来作为考核标准,先随便定个数吧,就 80% 不错。但我们都知道,哪怕 100% 测试覆盖率也无法保证软件质量,盲目追求高覆盖率反而会物极必反出现问题,最终导致大家以后对单元测试痛恨至极。 但正因为有了这样一个开始的契机,大家才开始有意识提高软件质量。而且大家最开始都会觉得“单元测试是个好东
吕立青

Vue 应用单元测试的策略与实践 05 - 测试奖杯策略

本文的目标 1. Vue 项目中测试收益如何最大化,如何配置高性价比的测试策略,即什么地方最该花力气测试,什么地方又可以暂且放一放? // Given 一个具备 UT 基础但找不到着力点的求索之徒 🐒 // When 当他 🚶 阅读本文的 Vue 应用测试策略部分 // Then 他能够找到测试的重点,重新燃起对 UT 的热情 🔥 他能够在项目背景下合理配置单元测试的测试策略 单元测试的特点及其位置 前言从敏捷:团队和企业的高响应力谈到单元测试,可能有同学会问,高响应力这个事情我认可,也认可快速开发的同时,质量也很重要。但是,为了达到“保障质量”的目的,不一定得通过测试呀,就算需要测试,也不一定得通过单元测试。 这是一个好的问题。为了达到保障质量这个目标,测试当然只是其中一个方式,稳定的自动化部署、集成流水线、良好的代码架构、甚至于团队架构的必要调整等,都是必须跟上的基础设施。自动化测试不是解决质量问题的银弹,多方共同提升才可能起到效果。 即便我们谈自动化测试,也未必全部都是单元测试。我们对自动化测试套件寄予的厚望是,它能帮我们安全重构已有代码、
吕立青

Vue 应用单元测试的策略与实践 04 - Vuex 单元测试

本文的目标 2.2 在 Vue 应用的单元测试中,对 Vuex store 该如何测试?如何测试与 Vue 组件之间的交互? // Given 一个有基本的 UT 知识和 Vue 组件单元测试经验的开发者 🚶 // When 当他 🚶 阅读和练习本文的 Vuex 单元测试的部分 // Then 他能够对 Vuex 概念的理解更加深入,且知道 `Redux-like` 架构的好处 他能够合理测试 vuex store 的 mutation、getter 中的业务逻辑和异步 action 他能够测试组件如何正确读取 store 中的 state 以及 dispatch action 如何理解 Vuex 模式? Vuex
吕立青

Vue 应用单元测试的策略与实践 03 - Vue 组件单元测试

本文的目标 2.1 在 Vue 应用的单元测试中,对不同 UI 组件的单元测试有何不同?颗粒度该细到什么样的程度? // Given 一个有基本的 UT 知识但没写过 Vue 测试的新人 🚶 // When 当他 🚶 阅读和练习本文的 Vue 单元测试的部分 // Then 当然,他能够学会 Vue 组件在测试当中的几种渲染方式 他能够学会 UI 组件的分类,特别是交互行为的测试方式 组件化与 UI 测试 在组件化出现之前,我们都压根不谈 UI 的单元测试,哪怕是对于 UI 页面层级的测试来说都是一件非常困难的事情。其实组件化并不全是为了复用,很多情况下也恰恰是为了分治,从而我们可以分组件对 UI 页面进行开发,然后分别对其进行单元测试。 前端组件化已经让 UI 测试变得容易很多,每个组件都可以被简化为这样一个表达式,
吕立青

Vue 应用单元测试的策略与实践 02 - 单元测试基础

本文的目标 1. 在 TDD 做完 Tasking 列完实例化数据之后,完全没有 UT 基础不知道该怎么写单元测试? // Given 一个完全没有 UT 基础的新人 🚶 // When 当他 🚶 阅读和练习本文的 Jest 的部分 // Then 他能够把 Given/When/Then 的套路学会 他能够学会 Jest 的基本用法,包括测试 suite 和断言等语法 他能够学会 Jest 中测试异步的几种方式 单元测试基础 在上一篇文章当中我们介绍了单元测试的意义,以及为何选择 Facebook 的 Jest 作为我们的测试框架。现在就让我们一起来学习如何编写最基础的单元测试。 如果你已经有了使用 Jest 编写单元测试的经验,可以选择直接跳到第二段。 第一个 Jest 实例 首先创建
吕立青

Vue 应用单元测试的策略与实践 01 - 前言和目标

前言 本文主要尝试解决三个问题: 1. 在 TDD 做完 Tasking 列完实例化数据之后,完全没有 UT 基础不知道该怎么写单元测试? 2. 在 Vue 应用的单元测试中,对 UI 组件和 vuex store 等测试的区别有何不同?颗粒度该细到什么程度? 3. Vue 项目中测试收益如何最大化,如何配置高性价比的测试策略,即什么地方最该花力气测试,什么地方又可以暂且放一放? 4. 在 Vue 项目中如何推动整个团队循序渐进地采取单元测试策略?逐步提高代码质量和测试覆盖率? 不谈论的包括: * ATT 验收测试 或 E2E 端到端测试,这个是我想进一步探索的话题,特别是在 TDD 的语境下。#322 * 为什么要 TDD?但是我会讲为什么要 UT 单元测试。测试和
吕立青