reactjs - React jest 测试抛出“对象作为 React 子项无效（找到：带有键 {type，props} 的对象）”

Question

我有一个类组件。当我为它编写单元测试时，我收到一条错误消息

"Objects are not valid as a React child (found: object with keys {type, props}). If you meant to render a collection of children, use an array instead."

下面是我的组件

export class IncidentCloseFormModal extends React.Component<Props, State> {
public render(): JSX.Element {
    return (
      <Modal
        isOpen={this.props.visible}
        title={Messages.contactSupport.closeConfirmation.closeRequest()}
        closeHandler={this.props.onRequestCancellation}
        closeLinkText={Messages.contactSupport.labels.cancel()}
      >
        <SpinnerModal forceOpen={this.state.submitDisabled}/>
        <Form
          onSubmit={this.onSubmit}
          validator={this.validate}
        >
          {this.props.visible && !!this.props.errorMessage ?
            this.props.errorMessage : null
          }
          <p>{Messages.contactSupport.closeConfirmation.confirmation(this.props.incidentId)}</p>
          <small><b>{Messages.contactSupport.closeConfirmation.descriptionHeading()}</b></small>
          <Field
            fieldName={DescriptionFieldName}
            hint={<DescriptionHint /> as any}
          >
              <Textarea
                onChange={this.onDescriptionChange}
                rows={3}
                value={this.state.description}
              />
           
          </Field>

          <>
            <Button
              type={ButtonType.Submit}
              label="Request to Close"
            >
              Request to Close
            </Button>
          </>
        </Form>
      </Modal>
    );
  }
};

和我的测试

import { createMock } from "ts-auto-mock";
interface Props {
  visible: boolean;
  incidentId: string;
  incident?: Incident;
  onRequestSubmission: (description: string) => void;
  onRequestCancellation: () => void;
  errorMessage: JSX.Element;
}
describe("IncidentCloseForm tests", () => {
  let mock: Props;
   beforeEach(() => {
    mock = createMock<Props>();
  });
  it("IncidentCloseForm", async () => {
    mock.visible = true;
    const { container} = render(
      <IncidentCloseFormModal {...mock} />,
    );
    expect(container).toMatchSnapshot();
  });
});

我无法弄清楚此错误消息出了什么问题。非常感谢提供有关如何解决此问题的指示的任何帮助。

标签： reactjsjestjs