Javascript 导入&x27;渲染';jsx文件中的@testing library/react出错
这个有点卡住了。我将react单元测试引入到我的团队节点/react项目中。很长一段时间以来,我们在FE中对后端和UTIL进行了jest单元测试,但没有进行react测试 我通过以下途径了解测试指南: 我的问题是,我创建测试文件的方式与创建和正确运行所有其他单元测试的方式完全相同。我在文件中放了一个假的测试用例:Javascript 导入&x27;渲染';jsx文件中的@testing library/react出错,javascript,reactjs,unit-testing,jestjs,react-testing-library,Javascript,Reactjs,Unit Testing,Jestjs,React Testing Library,这个有点卡住了。我将react单元测试引入到我的团队节点/react项目中。很长一段时间以来,我们在FE中对后端和UTIL进行了jest单元测试,但没有进行react测试 我通过以下途径了解测试指南: 我的问题是,我创建测试文件的方式与创建和正确运行所有其他单元测试的方式完全相同。我在文件中放了一个假的测试用例: import React from 'react'; //import { render } from '@testing-library/react'; describe('tes
import React from 'react';
//import { render } from '@testing-library/react';
describe('test', () => {
it('tests', () => {
expect(true).toEqual(true);
});
});
这个测试用例按预期执行。但是,只要我取消注释import{render}
行,它就会出现以下错误:
FAIL */__tests__/client/views/components/componentToTest.test.jsx
● Test suite failed to run
*/node_modules/@testing-library/dom/dist/helpers.js:44
} catch {// not using Jest's modern fake timers
^
SyntaxError: Unexpected token {
at ScriptTransformer._transformAndBuildScript (node_modules/jest-runtime/build/script_transformer.js:316:17)
at Object.<anonymous> (node_modules/@testing-library/dom/dist/pretty-dom.js:13:16)
at Object.<anonymous> (node_modules/@testing-library/dom/dist/config.js:11:18)
FAIL*/\uuuu tests\uuu/client/views/components/componentToTest.jsx
● 测试套件无法运行
*/node_modules/@testing library/dom/dist/helpers.js:44
}捕捉{//不使用Jest的现代假计时器
^
SyntaxError:意外标记{
在ScriptTransformer.\u transformAndBuildScript(node\u modules/jest runtime/build/script\u transformer.js:316:17)
对象上。(node_modules/@testing library/dom/dist/pretty dom.js:13:16)
at对象。(node_modules/@testing library/dom/dist/config.js:11:18)
我完全不知道这里发生了什么,找不到任何有类似问题的人。我的IDE甚至正确地向我显示了渲染方法的外观,所以我知道它的导入是正确的
我已经安装了指南中建议的所有软件包,并且显然已经安装了jest config来运行jsx文件(因为测试可以工作,但导入时会中断)
答案是很好的,但我真的很想指出解决这个问题的正确方向
谢谢
同样值得注意的是,我有
babeljest
和jestdom
设置,因为我知道这是许多类似问题的答案。这里的问题是JavaScript中可选的catch绑定(当您声明catch块而不绑定错误时:try{}catch{}
而不是try{}catch(error){/code>)仅适用于节点V10+
此外,测试库支持节点V10+
为了解决这个问题,您需要在Node V10+上运行测试,并确保将babel设置为使用系统中的当前节点版本,并进行适当的转换
有关更多信息,请查看
注意:您可以找到有关此问题的更多信息。因此,看起来巴贝尔需要转换/node\u modules/@testing library
中的js文件,而在您的情况下,它不会这样做。我怀疑您的jest配置(在package.json
或jest.config.js
中定义)可能是错误的需要修复,以便巴贝尔确实转换这些文件
快速修复方法是将transformIgnorePatterns
设置为空数组。默认情况下transformIgnorePatterns
设置为“/node\u modules/”
,将其设置为空数组将阻止忽略节点模块文件,因此可能是这样的情况
。。。
“转变”:{
“^.+\.(js|jsx)$”:“/node\u modules/babel jest”,
“^.+\\(css | styl | less | sass | scss)$”:“/node_modules/jest css modules transform”
},
“transformIgnorePatterns”:[],
..
当在节点v8.17.0上运行测试时,我也遇到了同样的问题。在节点v10和v13上,所有的测试都正常。哦,你实际上是100%对的。昨天,我在这一次上忙了一整天。最后,我的机器崩溃了,当我再次加载它时,它正常工作。我非常困惑,但感谢你的评论,我现在才意识到昨天我运行的是v8.7.0,因为我必须部署一个早期使用该版本的服务,并且从未切换回v10。当我的计算机崩溃时,它将我的版本重置回v10,这就是它正常运行的原因。很好的呼叫,谢谢。你是如何发现它是一个版本控制问题w/节点本身的?所以它看起来像这个正则表达式模式对于“transformIgnorePatterns”
有效的“[/\\\\\\]节点单元模块[/\\\\\][^@testing library/].+\.(js | jsx)$”,
对接受此答案的滞后表示最诚挚的歉意。感谢您的回答和额外的上下文。