使用 typescript 來寫測試

使用 typescript 來寫測試

介紹

編寫測試的重要性我就不說了
使用 ts 的好處我也不說了
那麼接下來就讓我們使用 ts 來更好的編寫測試吧

安裝依賴

yarn add -D typescript ts-jest jest @types/jest

Config File

運行yarn ts-jest config:init, ts-jest 會幫我們生成一個 jest 配置文件jest.config.js

module.exports = {
  preset: 'ts-jest',
  testEnvironment: 'node'
}

tsconfig.jest.json

在根目錄下新增tsconfig.json,如果項目原來就是 ts 寫的話，肯定會有這個文件，沒有的話，需要新增一個。但是，有時候我們測試環境跟開發環境的 ts 配置是有區別的，所以我們可以新增一個tsconfig.jest.json來區分不同環境的 ts 配置

{
  "extends": "./tsconfig",
  "compilerOptions": {
    "jsx": "react"
  }
}

這樣的話，之前的jest.confg.js就需要修改了，因爲默認讀的是tsconfig.json

module.exports = {
  globals: {
    'ts-jest': {
      tsConfigFile: 'tsconfig.jest.json'
    }
  },
  testEnvironment: 'node'
}

其他配置參考ts-jest

新增測試

現在可以開始使用 ts 愉快的編寫測試了,在根目錄下新增test/a.test.ts文件
參考文檔jest

import sum from './sum'

test('adds 1 + 2 to equal 3', () => {
  expect(sum(1, 2)).toBe(3)
})

運行測試

yarn jest

yarn jest --coverage

總結

使用 ts 編寫測試的好處，實際上就是 ts 的好處。比如， 有完善的 api 提示；避免低級錯誤；等等。
這就完了？對，這就完了。現在已經可以簡單的寫一些單元測試了，當然我們的應用不可能這麼簡單就能測得了的，肯定會有很多亂七八糟的依賴，所以，下一篇講 “使用 ts、 enzyme 測試 react-redux 應用”。