[JS] – Unit Test với Jest – Code coverage

Ở bài trước: [JS] – Unit test với Jest & ES6

chúng ta đã cài đặt & chạy thử unit test và thành công. Nhưng vấn đề đặt ra ở đây là liệu rằng test chúng ta viết đã cover đủ hết các dòng code chúng ta viết ra chưa?

Bật chức năng hiển thị Code Coverage

Ở bài này chúng ta tiếp tục làm thế nào để hiện thị code coverage ra để xem Unit test của chúng ta cover bao nhiêu % code đã viết nhé.

Để làm được như vậy bạn phải enable cờ show code coverage của Jest lên

Tạo file jest.config.mjs

export default {
  // Indicates whether the coverage information should be collected while executing the test
  collectCoverage: true,
};

Update lại file math.js một tí, thêm 1 function vào nữa

const add = (a, b) => {
  return a + b;
};

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

export { add, sub };

Chạy Test và kiểm tra kết quả

Chạy test lại lần nữa, và quan sát ở cửa sổ terminal xem thử test chúng ta viết đã cover hết các dòng code chưa

Chúng ta thấy rằng code của chúng ta chỉ mới cover được 75% số dòng code. Còn thiếu dòng sô 6 chưa cover. Chúng ta phải fix nó ngay

Viết tiếp phần UT để cover dòng code chưa test

Update file math.test.js

import { add, sub } from "../math";

describe("Success Cases", () => {
  test("Return correct when add", () => {
    const result = add(1, 2);
    expect(result).toEqual(3);
  });

  test("Return correct when subtract", () => {
    const result = sub(3, 2);
    expect(result).toEqual(1);
  });
});

Kết quả cuối cùng

Xong rồi chạy lại câu lệnh npm run test xem sao

Một màu xanh lá ta nói nó sướng gì đâu luôn á.

Như vậy là bạn đã viết unit test cover đủ cho toàn bộ code bạn viết ra rồi đấy.

Tham khảo: https://jestjs.io/docs/configuration