Jest 是前端领域中最流行的测试框架之一。在 Jest 中,提供了一些全局变量(globals),使我们能够更方便地进行测试,同时也提高了测试的效率和准确性。本文将详细介绍 Jest 中的一些 globals,以及它们的使用方法和作用。
describe 和 it
describe 和 it 是 Jest 中最基本的测试工具。它们都是全局函数,可以直接在测试文件中使用。
describe 接受两个参数:一个字符串描述和一个函数体。它描述了一组相关的测试,就像一个文件夹里包含了一组相关的文件一样。在 describe 函数体内,我们可以定义一组 related it,提供对测试用例的更多描述。
it 接受两个参数:一个字符串描述和一个函数体。它描述了一个测试用例。在 it 函数体内,我们可以编写测试逻辑,以验证功能是否正常。
示例代码:
describe('Array', () => {
describe('#indexOf()', () => {
it('returns -1 when the value is not present', () => {
expect([1, 2, 3].indexOf(4)).toBe(-1);
});
});
});expect
expect 是 Jest 中最重要的工具之一。它提供了各种断言函数,让我们能够对代码行为进行验证。
Jest 提供了很多简洁而清晰的语法来完成断言,例如 toBe、toEqual、toContain 等等。它们都是全局函数,可以直接在测试文件中使用。其中 toBe 是最基本的断言函数,它通过 Object.is 来检查变量的值是否相等。而其它的断言函数,如 toEqual、toContain 以及 toMatch 等都是基于 toBe 实现的。
示例代码:
const sum = require('./sum');
test('adds 1 + 2 to equal 3', () => {
expect(sum(1, 2)).toBe(3);
});beforeEach 和 afterEach
beforeEach 和 afterEach 也是 Jest 中提供的全局函数,它们用于执行一些共享的操作,如初始化测试数据和清理测试环境。它们的作用和用法与 describe 和 it 相似,都是接受两个参数:一个描述字符串和一个函数体。
beforeEach 会在每个 it 执行前,都执行一次。这使我们能够确保每个测试用例都有相同的环境。而 afterEach 则会在每个 it 执行后执行一次,这为清理测试环境提供了一个机会。
示例代码:
// www.javascriptcn.com code example
describe('initialization', () => {
let initializedData;
beforeEach(() => {
initializedData = { a: 1, b: 2, c: 3 };
});
it('should have initialized data', () => {
expect(initializedData).toBeDefined();
expect(initializedData.a).toBe(1);
});
afterEach(() => {
initializedData = null;
});
});beforeAll 和 afterAll
beforeAll 和 afterAll 是 beforeEach 和 afterEach 的兄弟函数。它们的作用和用法与前者相似,不同之处在于它们只会在 describe 函数边界内执行一次。在一个测试套件中,beforeAll 会在所有测试用例执行前执行,而 afterAll 则会在所有测试用例执行后执行。通过这种方式,我们可以在测试开始前和结束后执行一些全局操作。
示例代码:
// www.javascriptcn.com code example
beforeAll(() => {
console.log('beforeAll');
});
afterAll(() => {
console.log('afterAll');
});
describe('beforeAll and afterAll', () => {
beforeEach(() => {
console.log('beforeEach');
});
afterEach(() => {
console.log('afterEach');
});
it('test 1', () => {
console.log('test 1');
});
it('test 2', () => {
console.log('test 2');
});
});上述代码将会输出:
beforeAll beforeEach test 1 afterEach beforeEach test 2 afterEach afterAll
变量和函数
除了 describe、it、expect、beforeEach、afterEach、beforeAll、afterAll,Jest 还提供了一些其他的全局变量和函数。
test
test 和 it 是可以互换使用的,它们的作用和使用方法是相同的。test 可以让代码的可读性更好,因为它很明显地表明了正在进行的操作是一项测试。如果你的代码库使用了 test,那么请确保在所有测试中都使用该函数。
示例代码:
const sum = require('./sum');
test('adds 1 + 2 to equal 3', () => {
expect(sum(1, 2)).toBe(3);
});setupFiles 和 setupFilesAfterEnv
setupFiles 和 setupFilesAfterEnv 是在所有测试用例之前引入的 JavaScript 文件。setupFilesAfterEnv 是在运行测试用例后立即引入的文件。它们都是可配置的,可以在 Jest 的配置文件中设置。
示例代码:
// jest.config.js
module.exports = {
setupFiles: ['./tests/globalSetup.js'],
setupFilesAfterEnv: ['./tests/globalTeardown.js'],
};beforeAll 和 beforeEach
beforeAll 和 beforeEach 是和 describe、it、expect 相似的全局函数。它们在执行测试前提供了一些公共的逻辑。
beforeAll 在所有测试用例执行前都会执行一次,而 beforeEach 则会在每个测试用例执行前执行。
示例代码:
// www.javascriptcn.com code example
let initializedData;
beforeAll(() => {
initializedData = { a: 1, b: 2, c: 3 };
});
beforeEach(() => {
console.log('initializedData', initializedData);
});afterAll 和 afterEach
afterAll 和 afterEach 是在测试用例执行后执行的一些全局操作。afterAll 在所有测试用例执行后执行一次,而 afterEach 则会在每个测试用例执行后执行。
示例代码:
// www.javascriptcn.com code example
let cleanedUpData;
afterAll(() => {
cleanedUpData = null;
});
test('should do something', () => {
// do something
cleanedUpData = { a: 1, b: 2, c: 3 };
});
afterEach(() => {
console.log('cleanedUpData', cleanedUpData);
});小结
在 Jest 中,全局变量和函数提供了丰富的测试工具,使我们能够更方便地完成测试用例的编写,同时提高了测试的效率和准确性。掌握这些工具的使用,能够帮助我们更好的测试前端代码,提高代码质量和可维护性。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/67d6bfdea941bf7134c9ca4c