reactjs - 不变违规 : Element type is invalid: expected a string (for built-in components) when testing with enzyme mount

Question

我正在测试一个包装器组件，它使用 children Prop 渲染它的 child 。问题是在测试文件中，当我设置包装器时，它工作正常。但是当我在组件中克隆子 Prop 时，出现以下错误:

Invariant Violation: Element type is invalid: expected a string (for 
built-in components) or a class/function (for composite components) but 
got: undefined. You likely forgot to export your component from the 
file it's defined in, or you might have mixed up default and named imports.

这仅在使用 mount 而不是 shallow 时发生，我希望它与 mount 一起使用。

class Parent extends React.Component {
    render() {
       const { someProps, someOtherProps, anotherProp } = this.props;

        return (
            <ParentWrapper someInfo={someProps} >
                <One someOtherProps={someOtherProps} />
                <Two  anotherProp={anotherProp} />
            </ParentWrapper>
        );
    }
}

父包装器:

class ParentWrapper extends React.Component {
    render() {
        const {children, somethin} = this.props;
        const clonedChildren = React.cloneElement(children, R.merge(children.props, { somethin }));

        return (
            <div>
                {clonedChildren}
            </div>
        );
    }
}

测试文件:

 const Parent = require('parent');
 panel = mount(<Parent {...defaultProps} />);

Answer 1

这个我也遇到过。 SO 上的大多数其他类似答案都涉及正确的导入/导出，但是当我使用 shallow() 时它工作正常，这意味着它不是导入/导出。

最终我发现我的 react 和 react-dom 版本略有不匹配。 (提醒，因为我需要它，请删除现有的 node_modules 和 package-lock.json 以确保您实际上正在拉取更新的模块)。这为我修复了它。