vscode导入报错的问题

Question

测试文件中有两个导入模块报错：
import { render, RenderResult, fireEvent, cleanup, wait } from ‘@testing-library/react’

fireEvent和wait可以正常使用，但在vscode中老报错说找不到，挺烦人的，查了半天没发现在哪改。。这个是误报吗？请问该如何设置

报错信息是：
Module ‘"…/…/…/node_modules/@types/testing-library__react"’ has no exported member ‘wait’.ts(2305)

Answer 1

张轩 2020-09-21 09:10:15

同学你好 

看起来你遇到了和这位同学一样的问题 http://coding.imooc.com/learn/questiondetail/198255.html 看起来你们没有安装 @testing-library__dom 应该是版本问题

这个帖子中 https://github.com/testing-library/react-testing-library/issues/610 中解决方法就是重装一遍你可以试试

 npm uninstall @testing-library/react @testing-library/jest-dom && npm install --save-dev @testing-library/react @testing-library/jest-dom

 

Answer 2

提问者 Lion_ssg 2020-09-21 21:14:19

已解决，贴下我的情况，供后来的同学参考。。

1、尝试了老师说的重装@testing-library/react @testing-library/jest-dom，此时编译器已经可以通过了，但是报了新错

2、新错误显示：TypeError: MutationObserver is not a constructor 以及wait已经过时，用waitFor替代的警告，同时有个类型错误

3、一个个解决
过时警告：将wait改写为waitFor
类型错误：增加as断言解决，反正如果断言错误了说明用例也无法通过
MutationObserver的报错：参考了回答https://stackoverflow.com/questions/61036156/react-typescript-testing-typeerror-mutationobserver-is-not-a-constructor

增加依赖：yarn add jest-environment-jsdom-sixteen

然后修改默认test命令："test": "react-scripts test --env=jest-environment-jsdom-sixteen",

具体原因看上面的链接，还是版本问题...

最后完整的：

"dependencies": {

     //...

    "@testing-library/jest-dom": "^5.11.4",

    "@testing-library/react": "^11.0.4",

    "jest-environment-jsdom-sixteen": "^1.0.3",

    //...

}

"scripts": {

    "start": "react-scripts start",

    "build": "react-scripts build",

    "test": "react-scripts test --env=jest-environment-jsdom-sixteen",

    "eject": "react-scripts eject"

},