reactjs - 使用 Jest 测试/模拟 ReactComponent SVG 导入

Question

我正在将 SVG 导入到我的组件中，并使用 ReactComponent 将它们作为组件导入
IE。

import { ReactComponent as D1 } from '../../../assets/images/characteristics/D1.svg';

当我运行 jest/enzyme 进行测试时，出现错误:
元素类型无效:应为字符串(对于内置组件)或类/函数(对于复合组件)但得到:未定义。您可能忘记从定义组件的文件中导出组件，或者您可能混淆了默认导入和命名导入。
看来我需要 mock 这个？我怎样才能做到这一点？
谢谢

Answer 1

尽管@skyboyer 指出的解决方案对我有用，但在运行测试时在控制台中显示以下错误:

<SvgrURL /> is using incorrect casing. Use PascalCase for React components, 
or lowercase for HTML elements.

作为解决方案，在模拟文件中更改为以下内容对我有用:

import React from 'react';
 
const SvgrMock = React.forwardRef((props, ref) => <span ref={ref} {...props} />);

export const ReactComponent = SvgrMock;
export default SvgrMock;

reference