Jest 從安裝開始

使用 ?yarn? 安裝 Jest︰

yarn add --dev jest

或使用 ?npm? 安裝 Jest：

npm install --save-dev jest

注：Jest的文檔統(tǒng)一使用?yarn?命令，不過使用?npm?也是可行的。 你可以在yarn的說明文檔里看到?yarn與?npm?之間的對(duì)比。

讓我們開始為一個(gè)假設(shè)函數(shù)編寫測(cè)試，該函數(shù)將兩個(gè)數(shù)字相加。 首先，創(chuàng)建一個(gè)?sum.js ?文件：

function sum(a, b) {
  return a + b;
}
module.exports = sum;

然后，創(chuàng)建一個(gè)名為? sum.test.js? 的文件。 這將包含我們的實(shí)際測(cè)試：

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

將下面的配置部分添加到你的? package.json? 里面：

{
  "scripts": {
    "test": "jest"
  }
}

最后，運(yùn)行? yarn test? 或 ?npm run test? ，Jest將打印下面這個(gè)消息：

PASS  ./sum.test.js
? adds 1 + 2 to equal 3 (5ms)

如此一來，你就成功地寫出第一個(gè)Jest測(cè)試 ！

此測(cè)試使用 ?expect ?和 ?toBe ?來測(cè)試兩個(gè)值完全相同。 若要了解Jest關(guān)于測(cè)試方面更多的能力，請(qǐng)參閱使用適配器。

在命令行運(yùn)行

你可以通過命令行直接運(yùn)行?Jest?(前提是?jest?已經(jīng)處于你的環(huán)境變量 ?PATH?中，例如通過 ?yarn global add jest? 或 ?npm install jest --global?安裝的?Jest?) ，并為其指定各種有用的配置項(xiàng)。

這里演示了如何對(duì)能匹配到 ?my-test? 的文件運(yùn)行 ?Jest?、使用?config.json ?作為一個(gè)配置文件，并在運(yùn)行完成后顯示一個(gè)原生的操作系統(tǒng)通知。

jest my-test --notify --config=config.json

如果你想要了解更多關(guān)于通過命令行來運(yùn)行 ?jest ?的內(nèi)容，請(qǐng)繼續(xù)閱讀 Jest CLI 選項(xiàng) 頁面。

更多配置

生成一個(gè)基礎(chǔ)配置文件

基于你的項(xiàng)目，Jest將會(huì)提出幾個(gè)問題，并將創(chuàng)建一個(gè)基本的配置文件，每個(gè)選項(xiàng)都有一個(gè)簡(jiǎn)短的說明：

jest --init

使用 Babel

如果需要使用 Babel，可以通過 ?yarn?來安裝所需的依賴。

yarn add --dev babel-jest @babel/core @babel/preset-env

可以在工程的根目錄下創(chuàng)建一個(gè)?babel.config.js?文件用于配置與你當(dāng)前Node版本兼容的Babel：

// babel.config.js
module.exports = {
  presets: [
    [
      '@babel/preset-env',
      {
        targets: {
          node: 'current',
        },
      },
    ],
  ],
};

Babel的配置取決于具體的項(xiàng)目使用場(chǎng)景 ，可以查閱 Babel官方文檔來獲取更多詳細(xì)的信息。

使 Babel 配置具有 jest-aware

如果沒有設(shè)置為其他內(nèi)容，Jest 將設(shè)置?process.env.NODE_ENV?為?'test'?。你可以在配置中使用它來有條件地僅設(shè)置 Jest 所需的編譯，例如

// babel.config.js
module.exports = api => {
  const isTest = api.env('test');
  // You can use isTest to determine what presets and plugins to use.
  return {
    // ...
  };
};

注意：當(dāng)你安裝 Jest 時(shí)，?babel-jest? 是會(huì)被自動(dòng)安裝的，并且如果你的項(xiàng)目下存在一個(gè) Babel 配置文件時(shí)，它將會(huì)自動(dòng)對(duì)相關(guān)文件進(jìn)行轉(zhuǎn)義。 如果要避免這個(gè)行為，你可以顯式的重置 ?transform? 配置項(xiàng)：

// jest.config.js
module.exports = {
  transform: {},
};

Babel 6 支持

Jest 24 放棄了對(duì) Babel 6 的支持。我們強(qiáng)烈建議大家升級(jí)到 Babel 7，它得到了積極維護(hù)。但是，如果你無法升級(jí)到 Babel 7，請(qǐng)繼續(xù)使用 Jest 23 或升級(jí)到 Jest 24 并?babel-jest?鎖定版本 23，如下例所示：

"dependencies": {
  "babel-core": "^6.26.3",
  "babel-jest": "^23.6.0",
  "babel-preset-env": "^1.7.0",
  "jest": "^24.0.0"
}

雖然我們通常建議使用每個(gè) Jest 包的相同版本，但此解決方法將允許你現(xiàn)在繼續(xù)使用最新版本的 Jest 和 Babel 6。

使用 webpack

Jest 可以用于使用 webpack 來管理資源、 樣式和編譯的項(xiàng)目中。 webpack 與其他工具相比多了一些獨(dú)特的挑戰(zhàn)。 參考 webpack 指南 來開始起步。

使用 parcel

Jest 可用于使用parcel bundler管理資產(chǎn)、樣式和編譯（類似于webpack）的項(xiàng)目中。包裹需要零配置。請(qǐng)參考官方文檔開始。

使用 TypeScript

Jest 通過 Babel 支持 TypeScript。首先，請(qǐng)確保你遵循了上面使用 Babel 的說明。接下來，通過?yarn?安裝?@babel/preset-typescript?：

yarn add --dev @babel/preset-typescript

然后添加?@babel/preset-typescript?到你的???babel.config.js?.??

// babel.config.js
module.exports = {
  presets: [
    ['@babel/preset-env', {targets: {node: 'current'}}],
+    '@babel/preset-typescript',
  ],
};

不過，在配合使用TypeScript與Babel時(shí)，仍然有一些注意事項(xiàng) 。 因?yàn)?Babel 對(duì) TypeScript 的支持是 transpilation，Jest 不會(huì)在運(yùn)行時(shí)對(duì)你的測(cè)試進(jìn)行類型檢查。 如果你想實(shí)現(xiàn)這個(gè)功能，你可以使用 ?ts-jest?。