未捕获类型错误：无法读取未定义的属性（读取“isBatchingLegacy”）

Question

我正在尝试使用 jest 测试 React TypeScript 项目，但它给出了一个令人困惑的错误：

这是我的package.json：

"dependencies": {
    "@testing-library/jest-dom": "^5.16.4",
    "@testing-library/react": "^12.1.5",
    "@testing-library/user-event": "^13.5.0",
    "@types/jest": "^27.4.1",
    "@types/node": "^16.11.26",
    "@types/react": "^17.0.43",
    "@types/react-dom": "^17.0.14",
    "jest": "^27.5.1",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-router-dom": "^6.2.2",
    "react-scripts": "5.0.0",
    "ts-jest": "^27.1.4",
    "typescript": "^4.6.3",
    "web-vitals": "^2.1.4",
},

"devDependencies": {
    "@types/react-test-renderer": "^18.0.0",
    "react-test-renderer": "^18.1.0"
}

我写了这个基本测试，它给出了错误：

import renderer from 'react-test-renderer'
import AddShipmentButton from './AddShipmentButton'

it('works', () => {
    const tree = renderer.create(<AddShipmentButton />).toJSON()
    expect(tree).toMatchSnapshot()
})

我必须使用 --legacy-peer-deps 安装依赖项。可能是什么问题？预先感谢。

Answer 1

问题是我安装了最新版本的react-test-renderer v18.0.1，而React版本是v17.0.2。安装react-test-renderer版本17.0.2解决了这个问题。

Answer 2

像这样升级您的应用程序依赖项

"react": "~18.0.0",
 "react-dom": "^18.0.0", 
 "react-test-renderer": "^18.0.0"

React 文档中定义的 import 是错误的，尝试用这种方式

import TestRenderer from 'react-test-renderer';

import AddShipmentButton from './AddShipmentButton'

it('works', () => {
  const tree = TestRenderer.create(<AddShipmentButton />).toJSON()
  expect(tree).toMatchSnapshot()
})

在此处阅读 TestRenderer 的用法

Answer 3

确保您使用相同版本的

react

和

react-test-renderer

您可以使用

npm install [package-name]@[version-number]

更改节点包的版本

Answer 4

将你的react和react-dom版本降级到更稳定的版本（17.0.0）。

最初我有以下依赖项并遇到相同的错误

"react": "^18.0.2",
"react-dom": "^18.0.2"

但是一旦我将我的依赖关系降级为

"react": "^17.0.0",
"react-dom": "^17.0.0"

错误已解决