reactjs - 挂载错误: 'TypeError: ReactWrapper can only wrap valid elements' when using enzyme.

Question

将 React 元素传递给“mount”函数时遇到此错误:

it("Book - move book to a shelf should work", () => {
    let test = (<Book book={book} />);
    let component = mount(test);
    const select = component.find("select").first();
    expect(select).toBeDefined();

但是，如果我删除变量并将元素直接传递给方法，它就会起作用。

it("Book - move book to a shelf should work", () => {
    let component = mount(<Book book={book} />);
    const select = component.find("select").first();
    expect(select).toBeDefined();

它们有何不同？

更新:由于某种原因，此方法(来自 Jest 的 renderer.create)不会提示这一点:

let component = renderer.create(<Book onMoveBook={onMoveBook} book={book} />);
const tree = component.toJSON(); // Works fine.

此外，令人惊讶的是，将变量转换为函数并将其传递给 React.createElement 有效:

var test = React.createElement(() => <Book onMoveBook={onMoveBook} book={book} />);
let component = mount(test);

Answer 1

有同样的错误。该错误是由您安装“测试”组件的方式引起的。你这样做的方式，你没有安装一个有效的组件，而只是一个变量。您想将变量放在 < /> 之间使其成为一个组件。

你正在做let component = mount(test);而你应该做let component = mount(<test/>);