TL;DR——什么是好的单元测试?
其实我是个标题党，单元测试基本没有“艺术”可言。
好的测试来自于好的代码，假设说有艺术，那也是代码的艺术。
注：以下“测试”一词，如非特指均为单元测试。
单元测试的好坏在于“单元”而不在“测试”。假设一个系统毫无单元可言，那就没法停止单元测试，简直只能用 Selenium 做少量的E2E测试，其成本和波动性可想而知。迷信的单元划分可以让你摆脱mock，增加依赖，提高并行度，不依赖完成/易重构，提高测试对业务的掩盖率，以及易学易用，大幅增加测试代码。
最好的单元是前往复杂数据结构的函数：函数是最基本的笼统，可大可小，不需求mock，只依托传参。复杂数据结构可以判等。 最好的测试工具是Assert.Equal这种的：只是判等。判等容易，判别发作了什么很难。你可以看到前面关于DOM和异步操作这些和反作用相关的例子都靠判等测试。把作用幂等于数据，拿到数据就一定发作作用，然后再测数据，是一个基本思绪。
以上是你以前学习测试第一天就会的内容，所以不存在门槛。
为什么不谈TDD?
首先， TDD 一定是有价值的(价值大小不论)。支持TDD的缘由普通比较清楚，关于TDD能否带来正收益不确定(动机不足)。 某些项目质量要求很高，预算宽绰，TDD势在必行。某些项目比较紧急，或许并非关键或无长期维护方案，TDD理由就不充沛。
为什么谈测试?
由于测试难。
第一难学，第二难写。写测试是个挺困难的活，要在测试里正确重演业务要费好大劲，只能靠重复练习。虽然这些测试在某些项目中是值得的，但是能够并不适宜其他某些项目的基本状况。
测试难，就代表训练成本高，消费成本也高，收益就下降。要提高采用TDD的动机，与其压服别人，不如从简化测试末尾。
为什么谈前端测试?
普通项目都是后端测试掩盖率高，同时后端套路也比较固定。测RESTful API粒度足够大，可以很好地避开完成并且掩盖业务。同时RESTful API普通也正好对应Web框架的Action handler，在这里同时它粒度也足够小，刚好可以直接调用而不启动真的Web server，使得测试最大水平并行化。所以这样测试收益总是最高的，争议很小。
前端不说套路不固定，测不测都有待商榷。由于前端流派不一致，资源不规则，边界也不明晰，有渲染又有点业务，有导航有央求，很多团队不测试/测Model/测Component/测E2E，五花八门。 但得益于JavaScript本身，前端测试其实是可以十分高效的。
下面你可以看到各种极简极快的测试工具和测试方式，并且它们完全可以 贯串开发一直，而非仅给Hello World体量项目预备的 ，你可以在很大的全家桶项目中完全机械地套用这些办法。(机械也是极限的一部分，你不应该在运用工具进程中面临太多选择，而应当专注于将业务翻译成测试)。
为什么谈React全家桶?
前端从每周刷新一个框架，波动到了 Angular , React , Vue 3个主流框架并存的阶段。网络中争论这三个框架盖的楼曾经可以绕太阳系了。依据盖的各种大楼看来，如今哪个更优秀还没个定论。不过详细到单元测试方面，得益于Virtual DOM本身和模块化设计(不然全家桶白叫了)，React全家桶清楚更优秀些。
测试工具
我们本篇中的测试有三个目的： 学得快，写得快，跑得快 。
平台上 Selenium , Phantom , Chrome , 包括 Karma 都比较重，最好的测试框架就是直接跑在 node 上的。本着极限编程的准绳，我们将测试本身和测试环境尽能够简化，以到达加快测试速度，最终反应到开发速度的目的。
我们运用 AVA 停止测试，它十分繁复，速度十分快，和 mocha 不同，它默许会启动多线程并发测试。因此我们的测试必须增加共享形状来提高并发才能，不然就会出现意想不到的错误。安装和运转：
yarn add ava
ava --watch
这样可以运转并watch测试。改动代码测试结果会立刻改动，你也可以看到友善的错误信息，以及expected和actual之间的diff。写下第一段测试：
import test from 'ava'
test(t => {
t.is(1 + 1, 2)
})
除了is办法以外，我们还会用到deepEqual和true办法。好，你如今曾经完全会用AVA了。其他的功用我们完全不关心。
Redux测试 (Model测试)
Redux 就是用一堆Reducer函数来reduce一切事情用来做全局Store的形状机( FSM )。用源码本身引见它甚至比用上一小段文字引见还快：
const createStore = reducer => {
let state, listeners = []
const dispatch = action => {
state = reducer(state, action)
listeners.forEach(listeners => listeners())
}
return {
getState() { return state },
subscribe(listener) {
listeners.push(listener)
(责任编辑：admin)