江苏龙网

  1. 主页 > 生活百科 > >

前端测试框架Jest——语法篇( 二 )

测试框架


而我们可以改成以下： 使用单个参数调用done，而不是将测试放在一个空参数的函数中，Jest会等done回调函数执行结束后，结束测试 。
function fetchData(call) {setTimeout(() => {call('peanut butter1')},1000);}test('the data is peanut butter', (done) => {function callback(data) {expect(data).toBe('peanut butter');done()}fetchData(callback);});

前端测试框架Jest——语法篇

文章插图
 
如果done()永远不会被调用，则说明这个测试将失败，这也正是我们所希望看到的 。
Promise
如果我们的代码中使用到了Promises，只需要从你的测试中返回一个Promise，Jest就会等待这个Promise来解决 。如果承诺被拒绝，则测试将会自动失败 。
举个例子，如果fetchData，使用Promise代替回调的话，返回值是应该解析为一个字符串'peanut butter'的Promise 。那么我们可以使用以下方式进行测试代码：
test('the data is peanut butter', () => {expect.assertions(1);return fetchData().then(data =https://www.isolves.com/it/cxkf/kj/2020-06-23/> {expect(data).toBe('peanut butter');});});注意：一定要返回Promise，如果省略了return语句，测试将会在fetchData完成之前完成 。
另外一种情况，就是想要Promise被拒绝，我们可以使用.catch方法 。另外，要确保添加了expect.assertions来验证一定数量的断言被调用 。否则一个fulfilled态的Promise不会让测试失败 。
test('the fetch fails with an error', () => {expect.assertions(1);return fetchData().catch(e => expect(e).toMatch('error'));});.resolves/.rejects
可以使用./resolves匹配器匹配你的期望的声明（跟Promise类似），如果想要被拒绝，可以使用.rejects
test('the data is peanut butter', () => {expect.assertions(1);return expect(fetchData()).resolves.toBe('peanut butter');});test('the fetch fails with an error', () => {expect.assertions(1);return expect(fetchData()).rejects.toMatch('error');});Async/Await
若要编写async测试，只要在函数前面使用async关键字传递到test 。比如，可以用来测试相同的fetchData()方案
test('the data is peanut butter', async () => {expect.assertions(1);const data = https://www.isolves.com/it/cxkf/kj/2020-06-23/await fetchData();expect(data).toBe('peanut butter');});test('the fetch fails with an error', async () => {expect.assertions(1);try {await fetchData();} catch (e) {expect(e).toMatch('error');}});setup and teardown写测试的时候，我们经常需要进行测试之前做一些准备工作，和在进行测试后需要进行一些整理工作 。Jest提供辅助函数来处理这个问题 。
为多次测试重复设置
如果你有一些要为多次测试重复设置的工作，可以使用beforeEach和afterEach 。
有这样一个需求，需要我们在每个测试之前调用方法initializeCityDatabase()，在每个测试后，调用方法clearCityDatabase()
beforeEach(() => {initializeCityDatabase();});afterEach(() => {clearCityDatabase();});test('city database has Vienna', () => {expect(isCity('Vienna')).toBeTruthy();});test('city database has San Juan', () => {expect(isCity('San Juan')).toBeTruthy();});一次性设置
在某些情况下，你只需要在文件的开头做一次设置 。这种设置是异步行为的时候，你不太可能一行处理它 。Jest提供了beforeAll和afterAll处理这种情况 。
beforeAll(() => {return initializeCityDatabase();});afterAll(() => {return clearCityDatabase();});test('city database has Vienna', () => {expect(isCity('Vienna')).toBeTruthy();});test('city database has San Juan', () => {expect(isCity('San Juan')).toBeTruthy();});作用域
默认情况下，before和after的块可以应用到文件中的每一个测试 。此外可以通过describe块来将将测试中的某一块进行分组 。当before和after的块在describe块内部的时候，则只适用于该describe块内的测试 。
比如说，我们不仅有一个城市的数据库，还有一个食品数据库 。我们可以为不同的测试做不同的设置︰
// Applies to all tests in this filebeforeEach(() => {return initializeCityDatabase();});test('city database has Vienna', () => {expect(isCity('Vienna')).toBeTruthy();});test('city database has San Juan', () => {expect(isCity('San Juan')).toBeTruthy();});describe('matching cities to foods', () => {// Applies only to tests in this describe blockbeforeEach(() => {return initializeFoodDatabase();});test('Vienna <3 sausage', () => {expect(isValidCityFoodPair('Vienna', 'Wiener Schnitzel')).toBe(true);});test('San Juan <3 plantains', () => {expect(isValidCityFoodPair('San Juan', 'Mofongo')).toBe(true);});});


推荐阅读


上一篇：javascript自学记录：递归

下一篇：5年Python功力，总结了10个开发技巧