自动化测试工具Jest的使用(持续更新)

入门

官方文档

安装

npm init -y
npm i @babel/core @babel/preset-env  [email protected] -D

配置

//添加.babelrc
    {
"presets":[
    ["@babel/preset-env",{
        "targets":{
            "node":"current"
        }
    }]
]
}

//package.json添加
"scripts":{
	"test":"jest --watchAll"
}

编码

// 根目录添加 index.js
export const add = (a, b) => {
  return a + b;
};

export const reduce = (a, b) => {
  return a - b;
};


// 根目录添加 index.test.js
import { add, reduce } from "./index";

test("测试add函数", () => {
  expect(add(1, 2)).toBe(3);
});

test("测试reduce函数", () => {
  expect(reduce(3, 1)).toBe(2);
});

运行jest的时候jest会自动检测到你后缀名为.test.js的文件

运行

npm run test

结果

Jest里面常用的匹配器

test(描述 ,执行测试片段)

 import { add, reduce } from "./index";

// toBe 数字
test("测试add函数", () => {
  expect(add(1, 2)).toBe(3);
});

test("测试reduce函数", () => {
  expect(reduce(3, 2)).toBe(1);
});

// toEqual：测试对象中的值是否与测试结果一致
test("测试对象中的值是否与测试结果一致", () => {
  expect({ a: 1 }).toEqual({ a: 1 });
});

// toHaveLength:判断字符串或者数组的长度
test("判断字符串或者数组的长度", () => {
  expect([1, 2, 3, 4, 5, 6, 7]).toHaveLength(7);
});

// toMatch:值是一个正则表达式 匹配字符串中是否存在某个字符
test("匹配字符串中是否存在某个字符", () => {
  expect("qwertyui").toMatch("qwe");
});

//测试值是否为null
test("测试toBeNull", () => {
  var n = null;
  expect(n).toBeNull();
});

//测试值是否为undefined
test("测试toBeUndefined", () => {
  var a = undefined;
  expect(a).toBeUndefined();
});

// only 跳过其他测试用例 只测试当前这个用例
test.only("测试toBeDefined",()=>{
    var a = "";
    expect(a).toBeDefined();
})

//测试值是否为true
test("测试toBeTruthy", () => {
  var flag = true;
  expect(flag).toBeTruthy();
});

//测试值是否为false
test("测试toBeFalsy", () => {
  expect(false).toBeFalsy();
});

//测试数组中是否存在某个值
test("toContain", () => {
  var arr = [10, 20, 30, 40];
  expect(arr).toContain(10);
});

//测试浮点数
test("toBeCloseTo", () => {
  var n = 0.1;
  var m = 0.2;
  // toBe(0.3)将报错因为，二进制计算的原因
  expect(n + m).toBeCloseTo(0.3);
});

//测试值要大于等于预期值
test("toBeGreaterThanOrEqual", () => {
  expect(10).toBeGreaterThanOrEqual(10);
});

//测试值要小于等于预期值
test("toBeLessThanOrEqual", () => {
  expect(9).toBeLessThanOrEqual(9);
});

//测试值要大于预期值
test("toBeGreaterThan", () => {
  expect(10).toBeGreaterThan(9);
});

//测试值要小于预期值
test("toBeLessThan", () => {
  expect(8).toBeLessThan(9);
});

//检测当前方法中是否抛出异常
test("toThrow", () => {
  expect(fn).toThrow();
});

/*********测试异步代码*********** */
// axios请求
import { fetchData } from "./index.js";
//基于promise
test("测试异步代码", () => {
  return fetchData().then(data => {
    expect(data.data).toEqual({ success: true });
  });
});

// async await
test("测试异步代码", async () => {
  var data = await fetchData();
  expect(data.data).toEqual({ success: true });
});

// 测试对的
test("异步测试", () => {
  return expect(fetchData()).resolves.toMatchObject({
    data: {
      success: true
    }
  });
});

// 测试错的
test("异步测试失败", () => {
  return expect(fetchData()).rejects.toThrow();
});

// 推荐
test("测试异步代码", async () => {
  var data = await fetchData();
  expect(data.data).toMatchObject({ success: true });
});