Question

我已经搜索了所有stackoverflow和github问题，但没有找到解决方案。我目前有一个使用react@15.4.1的项目，并且我正在尝试设置Enzyme。

每当我尝试Enzyme.mount()一个组件时，都会出现以下错误：

TypeError: _reactDom2.default.render is not a function

但是如果我Enzyme.shallow()浅化该组件，它就会起作用。

这是一个示例测试，显示了触发错误的代码：

TestComponent.test.js

import { configure, mount, shallow } from "enzyme"
import Adapter from "enzyme-adapter-react-15.4"

import React from "react"
import TestComponent from "./TestComponent"

configure({ adapter: new Adapter() })

describe("Example Tests", () => {
  test("mount does not work", () => {

    const shallowRendered = shallow(<TestComponent />) <-- this works
    const mountedComponent = mount(<TestComponent />) <-- this throws

  })
})

TestComponent.js

import React from "react"

export default class TestComponent extends React.Component {
  render() {
    return <p>test</p>
  }
}

package.json

//...
"dependencies": {
   //...
   "react": "15.4.1",
   "react-dom: "15.4.1"
}
"devDependencies": {
   //...
   "babel-jest": "24.1.0",
   "enzyme": "~3.3.0",
   "react-addons-test-utils": "15.4.1",
   "react-test-renderer": "15.4.1",
   "enzyme-adapter-react-15.4": "^1.3.1"
}

jest.config.js

module.exports = {
  verbose: true,
  collectCoverageFrom: ["<rootDir>/src/client/**/*.{js,jsx}"],
  testPathIgnorePatterns: [
    "node_modules",
    "build",
  ],
  transform: {
    "^.+\\.js$": "babel-jest",
  },
  testEnvironment: "jsdom",
  transformIgnorePatterns: ["<rootDir>/node_modules/"],
  moduleNameMapper: {
    "\\.(css|less)$": "<rootDir>/src/client/__mocks__/styleMock.js",
  },
  testURL: "http://localhost",
}

Answer 1

您需要从酶中导入{配置}。

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

configure({ adapter: new Adapter()  })

酶类型错误：_reactDom2.default.render不是函数

1 个答案: