单元测试

[cuixiaorui]

单元测试是什么

单元测试是测试单元的一种方法——单元是系统中逻辑上隔离的最小代码段。在大多数编程语言中，它是一个函数、一个子程序、一种方法或属性。

我们可以看到，单元测试可以灵活的触及你要测试的代码逻辑，十分灵活，它可以测试一个函数，比如像下面这样

function add(a,b){
    return a+b;
}

也可以测试一个类

class User{
    getName(){}
    setName(){}
}

好处

单元测试有太多太多的好处了，这里先简单的描述一下，更多的好处还需要读者自己在实践中去发现。

因为对于这本书的定义是告诉那些想要写测试的人如何去写。而不是告诉那些不想写测试的人测试如何的好

可以提高 debug 的效率

这个点可能会颠覆很多人的认知，咦，明明是测试代码写出来要比业务代码多的多。这明明就是增加了工作任务怎么还能提高效率呢？

举个例子，当你需要去测试点击按钮后是否调用了 console.log 这个逻辑

想一想如果你用手动去测试的话，需要几个步骤？

• 打开浏览器
• 找到测试按钮
• 点击测试按钮
• 查看控制台是否显示了 console.log 的值

而如果是用单元测试的话，只需要两个步骤：

• 写具体的测试代码
• 执行测试命令

而写具体的测试代码这个步骤只需要在第一次的时候写，后面的话也就只需要执行测试就 ok 了

而手动测试的话你可是需要每次都执行的，并且"打开浏览器"+"找到测试按钮"+"点击测试按钮"这两个步骤可是效率特别低的

为什么单元测试可以做到这样的效率呢？

因为单元测试是可以做到直达测试代码的。 它是足够的灵活的，

通过看图的话，我们可以了解到单元测试是可以深入到具体的功能上去的。 是可以直接调用需要测试的逻辑代码的。

TODO 演示视频

用什么工具来做单元测试

社区里面基本上是使用 jest 和 mocha 。笔者更喜欢使用 jest

我会在视频里面演示这两个库的基本使用

jest

jest 是 facebook 出品的测试框架，提供了完善的测试功能，比如 mock、断言等等

而对于一些应用项目来讲，社区里面大家更喜欢使用 jest

TODO 演示视频 //安装 //使用 // 匹配器的概念

mocha

轻量级别的测试库， 一般是使用在 npm 库里面，可以自己选择使用的 断言 等等之类的，比较灵活

TODO 演示视频 //安装 //使用

应该如何测试

一般我们都是基于你要开发的功能来写测试

而这里我们需要想明白 2 个点： 你功能的 input 是什么？ output 又是什么？

只要想明白了这 2 个点，你的测试基本就可以确定出来了

input 会作为你测试的数据给入 output 会作为你测试的结果来验证

我们来看看如何给一个 function 来做单元测试 TODO 演示视频 - 演示 3 种 function 形式

  - return value

  - call other function

  - change state

应该如何开始

如果你感觉基于功能还是找不到感觉的话

那你可以回想一下平时是在什么时候会做手动测试的？

• 比如，写了一个 add 函数，然后我会用 console.log 的方法来测试，看看输出的结果对不对，而当你遇到这样的情况的时候，完全可以去写一个单元测试

在前端中如何应用

上面所有的测试都是测试的纯逻辑，但是如果在组件里面的逻辑的话，应该如何测试呢？

其实我们可以有两种方案

1. 想办法把纯逻辑和组件逻辑分离开

   因为组件视图逻辑实在是比较难测试的，所以我们是否可以给拆分开呢？

   Functional Core, Imperative Shell 这个设计模式就可以把组件逻辑和核心逻辑拆分开

   后面我们会详细的介绍这个模式在测试中的使用

2. 组件测试

   既然逻辑在组件内，那么我们可以就可以使用组件测试

[qc-z]

哪一些文件适合用jest测试，比如说utils工具函数吗？

[cuixiaorui]

哪一些文件适合用jest测试，比如说utils工具函数吗？

这里应该是“测试什么”的问题

我会加到正文里面

[Mentionlyze]

自己做项目的时候尝试过写单元测试，但是往往只能覆盖到很少部分情况（以无状态的基本组件为主和公共方法为主），老是不得要领，牛逼工程师都会有自己的一套体系去组织测试吗

[tree-lock]

jest如何处理es module，Cannot use import statement outside a module的问题？

[cuixiaorui]

自己做项目的时候尝试过写单元测试，但是往往只能覆盖到很少部分情况（以无状态的基本组件为主和公共方法为主），老是不得要领，牛逼工程师都会有自己的一套体系去组织测试吗

是有一套测试原则的

[cuixiaorui]

jest如何处理es module，Cannot use import statement outside a module的问题？

这个搭配 babel 就可以了

[Rainer-Yu]

可以加上ts测试相关部分吗?

[cuixiaorui]

可以加上ts测试相关部分吗?

你指的是对 type 做测试还是用 ts 写 jest 的单元测试？

[Rainer-Yu]

可以加上ts测试相关部分吗?

你指的是对 type 做测试还是用 ts 写 jest 的单元测试？

都有 我看 有个ts-jest可以用ts写单元测试