我在尝试对使用react-highcharts
的React组件进行基本的烟雾测试时遇到了问题。我使用基本Jest的典型方法会产生错误:
it('renders without crashing', () => {
const div = document.createElement('div');
render(<MyComponent {...props} />, div);
});
—>
InvalidCharacterError
at exports.name (node_modules/jest-environmentjsdom/node_modules/jsdom/lib/jsdom/living/helpers/validate-names.js:10:11)
at a.createElement (node_modules/highcharts/highcharts.js:17:221)
at Object.a.svg.z.init (node_modules/highcharts/highcharts.js:92:155)
at Object.z.createElement (node_modules/highcharts/highcharts.js:63:3)
at Object.a.svg.z.createElement (node_modules/highcharts/highcharts.js:107:525)
at Object.a.svg.z.init (node_modules/highcharts/highcharts.js:101:44)
at Object.a.svg.a.VMLRenderer.B (node_modules/highcharts/highcharts.js:109:320)
at Object.N.getContainer (node_modules/highcharts/highcharts.js:252:329)
从一些互联网调查来看,这似乎是将<ReactHighcharts />
渲染为子组件的固有问题。如何在不重组我的组件或使测试复杂化的情况下解决这个问题?
答案 0 :(得分:1)
由于问题是将<ReactHighcharts />
渲染为子组件,而我们只是想确保父组件不会爆炸,我们可以使用Enzyme的shallow
方法仅渲染没有孩子的父组件:
it('renders without crashing', () => {
expect(shallow(<MyComponent {...props} />).exists()).toBeTruthy();
});