Jest 中钩子函数

首先，我们来写一个类，并把它放入一个文件 counter.js 中，代码如下。

class Counter {
    constructor () {
        this.number = 0
    }
    addOne () {
        this.number += 1
    }
    minusOne () {
        this.number -= 1
    }
}

export default Counter

下面，我们来写一个测试文件，测试这个类。如下。

import Counter from './counter.js'

const counter = new Counter()

test('测试 Counter 中 addOne 方法', () => {
    counter.addOne()
    expect(counter.number).toBe(1)
})

test('测试 Counter 中 minusOne 方法', () => {
    counter.minusOne()
    expect(counter.number).toBe(0)
})

上面，两个测试用例之间的数据是有关联的，这样是不太好的。

Jest 提供给我们一下钩子函数，在处理这种问题的时候，就可以使用。

这些钩子函数例如，beforeAll, afterAll, beforeEach ...

参考官网介绍https://jestjs.io/docs/en/api#beforeallfn-timeout

这里我们使用beforeEach 就好。

import Counter from './counter.js'

let counter = null
beforeEach(() => {
    counter = new Counter()
})

test('测试 Counter 中 addOne 方法', () => {
    counter.addOne()
    expect(counter.number).toBe(1)
})

test('测试 Counter 中 minusOne 方法', () => {
    counter.minusOne()
    expect(counter.number).toBe(-1)
})

此外，我们还可以对测试用例进行分组，如下。

import Counter from './counter.js'

let counter = null
beforeEach(() => {
    counter = new Counter()
})

describe('测试增加', () => {
    test('测试 Counter 中 addOne 方法', () => {
        counter.addOne()
        expect(counter.number).toBe(1)
    })
    test('测试 Counter 中 addOne 方法', () => {
        counter.addOne()
        expect(counter.number).toBe(1)
    })
})

describe('测试减少', () => {
    test('测试 Counter 中 minusOne 方法', () => {
        counter.minusOne()
        expect(counter.number).toBe(-1)
    })
    test('测试 Counter 中 minusOne 方法', () => {
        counter.minusOne()
        expect(counter.number).toBe(-1)
    })
})

其实上面的代码，就等价于下面。

import Counter from './counter.js'

describe('测试Counter', () => {
    let counter = null
    beforeEach(() => {
        counter = new Counter()
    })

    describe('测试增加', () => {
        test('测试 Counter 中 addOne 方法', () => {
            counter.addOne()
            expect(counter.number).toBe(1)
        })
        test('测试 Counter 中 addOne 方法', () => {
            counter.addOne()
            expect(counter.number).toBe(1)
        })
    })

    describe('测试减少', () => {
        test('测试 Counter 中 minusOne 方法', () => {
            counter.minusOne()
            expect(counter.number).toBe(-1)
        })
        test('测试 Counter 中 minusOne 方法', () => {
            counter.minusOne()
            expect(counter.number).toBe(-1)
        })
    })
})

那么，就很容易看出 beforeEach 这些钩子，是属于describe 的（作用域），我们可以在子的 describe 中也增加 钩子，且它的生效范围为它下的所有的测试用例。