如何解决我无法对我的Counter组件进行快照测试
我使用create-react-app
设置了我的应用程序。我正在尝试测试Counter组件,但此错误不断发生,我不太了解错误是什么,请您帮我。
import React from 'react';
import renderer from 'react-test-renderer';
import { Counter} from './App';
describe('Snapshot baby',() => {
test(() => {
const component = renderer.create(<Counter counter={1}/>).toJSON();
expect(component).toMatchSnapshot();
})
})
export const Counter = ({ counter }) => (
<div>
<p>{counter}</p>
</div>
);
src/App.spec.js
● Test suite failed to run
SyntaxError: /home/mike/Documents/All about React/Practice React/react_testing/src/App.spec.js: Support for the experimental syntax 'jsx' isn't currently enabled (9:43):
7 |
8 | test(() => {
> 9 | const component = renderer.create(<Counter counter={1}/>).toJSON();
| ^
10 | expect(component).toMatchSnapshot();
11 | })
12 | })
Add @babel/plugin-transform-react-jsx (https://git.io/vb4yd) to the 'plugins' section of your Babel config to enable transformation.
解决方法
事实证明,在我运行create-react-app
并添加新的项目后,旧版本的npm i create-react-app
无法用于快照测试。除了create-react-app
之外,您还可以自动进入监视模式,因此无需添加renderer
程序包即可进行任何配置。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。