共同使用 enzyme 與 Jest

設定 Jest

若要使用設定檔設定 Enzyme 和轉接器（如 安裝文件 中所述）與 Jest 共同執行，請將設定檔（請至 Jest 文件 查看設定檔可能的位置）中的 setupFilesAfterEnv（之前稱為 setupTestFrameworkScriptFile）字串設定為 <rootDir> 和設定檔路徑。

{
  "jest": {
    "setupFilesAfterEnv": ["<rootDir>src/setupTests.js"]
  }
}

Jest 版本 15 及更新版本

從版本 15 開始，Jest 已 不再預設模擬模組。因此，您不再需要為 Jest 新增任何特殊設定，即可與 enzyme 搭配使用。

如同 Jest 文件 中建議，安裝 Jest 及其 Babel 整合。安裝 enzyme。然後，只需在測試檔案頂端使用 require/import 即可載入 React、enzyme 函式和您的模組。

import React from 'react';
import { shallow, mount, render } from 'enzyme';

import Foo from '../Foo';

不需要包含 Jest 本身的渲染器，除非您只想將它用於Jest 快照測試。

Jest 版本 15+ 的範例專案

• Jest 15+ 的範例測試

Jest 版本 15 之前

如果您使用的是 Jest 0.9 – 14.0 搭配 enzyme，並使用 Jest 的自動模擬功能，您需要在 package.json 中將 react 和 enzyme 標示為未模擬的。

package.json:

{
  "jest": {
    "unmockedModulePathPatterns": [
      "node_modules/react/",
      "node_modules/enzyme/"
    ]
  }
}

如果您將之前的 Jest 版本與 npm3 一起使用，您可能需要取消模擬 更多模組。