Jest 使用指南 - - ts 文件篇

Posted Felix皇子

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Jest 使用指南 - - ts 文件篇相关的知识,希望对你有一定的参考价值。

Jest 使用指南 - - ts 文件篇

#jest

ts 文件的单测

ts 文件主要是一些工具方法的使用,然后对于其中的工具方法进行单测,比对返回的数据结构,包括基础数据类型、对象、数组、函数

异步方法

这部分直接参考 测试异步代码 · Jest
用到的 api 介绍

  1. expect.assertions(1)
    expect.assertions(number)验证在测试过程中是否调用了一定数量的断言。这在测试异步代码时通常很有用,以确保回调中的断言确实被调用。

  2. Done
    test 的第二个参数是一个方法,该方法可以接收一个参数,这个参数是一个函数 done,Jest会等done回调函数执行结束后,结束测试。

Note: If a promise is returned from test, Jest will wait for the promise to resolve before letting the test complete. Jest will also wait if you provide an argument to the test function, usually called done. This could be handy when you want to test callbacks. Globals · Jest
如果测试返回了 Promise ,Jest将等待 Promise 解决,然后再完成测试。如果您向测试函数提供参数(通常称为 done ),Jest也将等待。当您要测试回调时,这可能很方便。

test('the data is peanut butter', done => 
  function callback(data) 
    expect(data).toBe('peanut butter');
    done();
  
  fetchData(callback);
);
  1. Promise / resolve / reject / catch
    一定要返回Promise - 如果你省略 return 语句,您的测试将在 fetchData 完成之前完成。
test('the data is peanut butter', () => 
  expect.assertions(1);
  return fetchData().then(data => 
    expect(data).toBe('peanut butter');
  );
	// catch
	return fetchData().catch(e =>
    expect(e).toMatch('error')
  );
	// resolve 
	return expect(fetchData()).resolves.toBe('peanut butter');
	// reject 
	return expect(fetchData()).rejects.toMatch('error');
);
  1. Async / await
test('the fetch fails with an error', async () => 
  expect.assertions(1);
  try 
    await fetchData();
   catch (e) 
    expect(e).toMatch('error');
  
);

// 结合使用 resolve / reject
test('the data is peanut butter', async () => 
  expect.assertions(1);
  await expect(fetchData()).resolves.toBe('peanut butter');
	 await expect(fetchData()).rejects.toMatch('error');
);

引入别的模块

深入浅出前端单元测试框架的实现原理
在开发中我们总要引用一些开源的库,但是我们不可能去测试这些库,因为测试它们是毫无意义的,也是不现实的。
这里以上述链接中的 uuid 为例,来做实验

// user.ts
import  v4 as uuidv4  from "uuid";

export function createUser( name, age ) 
    return 
        id: uuidv4(),
        name,
        age,
    ;


// user.test.ts
import  createUser  from "./useModule";
// 可以理解为这里通过 mock 覆盖了 uuid 自身的 v4 方法
jest.mock("uuid", () => (
    v4: () => "FAKE_ID",
));

describe("test module", () => 
    test("create an user with id", () => 
        const userData = 
            name: "Christina",
            age: 25,
        ;
        const expectUser = 
            ...userData,
            id: "FAKE_ID",
        ;

        expect(createUser(userData)).toEqual(expectUser);
    );
);


以上是关于Jest 使用指南 - - ts 文件篇的主要内容,如果未能解决你的问题,请参考以下文章

Jest 使用指南 - - ts 文件篇

Jest 使用指南 - - ts 文件篇

使用 .ts 文件 (TypeScript) 配置 Jest 全局测试设置

React Jest 测试无法使用 ts-jest 运行 - 导入文件上出现意外令牌

打字稿源文件中带有 ts-jest 断点的 vscode-jest

无法使用 ts-jest 转换 node_modules 中的文件夹