Question

昨天我将我的React项目升级到v16.0，但我发现Enzyme有一些问题

    Error: 
      Enzyme Internal Error: Enzyme expects an adapter to be configured, but found none. To
      configure an adapter, you should call `Enzyme.configure({ adapter: new Adapter() })`
      before using any of Enzyme's top level APIs, where `Adapter` is the adapter
      corresponding to the library currently being tested. For example:
      import Adapter from 'enzyme-adapter-react-15';
      To find out more about this, see http://airbnb.io/enzyme/docs/installation/index.html

    at validateAdapter (spec/components/page_components/SongListItem/index.spec.js:9:1141986)
    at getAdapter (spec/components/page_components/SongListItem/index.spec.js:9:323041)
    at new ReactWrapper (spec/components/page_components/SongListItem/index.spec.js:9:622193)
    at mount (spec/components/page_components/SongListItem/index.spec.js:9:2025476)
    at UserContext.<anonymous> (spec/components/page_components/SongListItem/index.spec.js:9:1235741)

我在官方website

上找到了解决方案

// setup file
import { configure } from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';

configure({ adapter: new Adapter() });

但我有一个问题：酶设置文件应该写在哪里？在每个测试文件前面？

我尝试将上述代码添加到其中一个测试文件中，但仍存在问题

 Internal error: attempt to prepend statements in disallowed (non-array) context at C:/Users/killer/workspace/react/NetEase-Cloud-Music-Web/spec/components/page_components/SongListItem/index.spec.js

This是我项目的地址

Answer 1

我有类似的问题

如果您使用jest来运行测试，则可以创建test-setup.js文件并添加来自docs文档的片段：

// test-setup.js
import { configure } from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';

configure({ adapter: new Adapter() });

然后在您的jest配置中添加setupTestFrameworkScriptFile键并指向该文件。例如，如果您的jest配置位于package.json：

// package.json
{
    ...,
    "jest": {
        "setupTestFrameworkScriptFile": "<rootDir>/test-setup.js"
    }
}

来自jest docs https://facebook.github.io/jest/docs/en/configuration.html#setuptestframeworkscriptfile-string：

运行某些代码以在每次测试之前配置或设置测试框架的模块的路径。由于setupFiles在环境中安装测试框架之前执行，因此该脚本文件使您有机会在环境中安装测试框架后立即运行某些代码。

这将在您的初始化环境初始化之后但在执行酶测试之前执行

Answer 2

对于使用 create-react-app 的用户，您的设置文件的预期路径为src/setupTests.js。请参阅GitHub上的documentation（自述文件）：

初始化测试环境

注意：此功能适用于react-scripts@0.4.0及更高版本。   如果您的应用使用的是需要在测试中模拟的浏览器API   如果您在运行测试之前只需要全局设置，请添加一个   src / setupTests.js到你的项目。它会自动执行   在运行测试之前。

（因为create-react-app至少在v1.4.1中没有处理package.json中的选项setupTestFrameworkScriptFile）。

Answer 3

我遇到了与 React v16 类似的问题，并抛出了酶内部错误。您必须将以下代码放入 src / setupTests.js ：

import Enzyme from "enzyme";
import EnzymeAdapter from "enzyme-adapter-react-16";

Enzyme.configure({
  adapter: new EnzymeAdapter(),
});

在 package.json 文件中配置笑话。添加以下行：

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

Answer 4

更新 2019年6月

无论谁使用 CRA （create-react-app），src/setupTests.js都不起作用！在项目根文件夹中创建jest.config.js文件，并将其内容粘贴在下面，

module.exports = {
    "moduleNameMapper": {
      "\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/__mocks__/fileMock.js",
      "\\.(scss|sass|css)$": "identity-obj-proxy"
    },
    "setupFilesAfterEnv": ["<rootDir>/src/setupTests.js"]
}

ModuleNameMapper将避免使用静态文件导入语句（可选）。

由于setupTestFrameworkScriptFile已被弃用，因此我们必须使用setupFilesAfterEnv属性值作为数组。

确保您的项目src文件夹中有setupTests.js文件，或在项目中指定setupTests.js文件的位置。

更多信息

setupTests.js文件应具有以下内容，

import { configure } from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';

configure({ adapter: new Adapter() });

此设置适用于反应16

Answer 5

无需在 package.json 中添加配置。只需在“src”文件夹下添加一个“setupTests.js”文件并添加行

import { configure } from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';

configure({ adapter: new Adapter() });

如果你尝试添加配置 jest 会抛出这样的错误。

<块引用>

我们在您的 package.json 中检测到 setupFilesAfterEnv。

将其从Jest配置中移除，并将初始化代码放入 src/setupTests.js。这个文件会自动加载

酶设置文件应该写在哪里？

5 个答案: