使用useState

Question

我对使用useState的Jest也是功能组件不熟悉，我需要使用Jest的以下代码的单元测试用例的帮助。

export const AdvanceSearch = props => {

  const { handleSubmit, reset } = props;

  const [open, togglePanel] = useState(false);

  return (

    <div>
      <div>

        <div onClick={() => togglePanel(!open)} className="toggleheader">
          {open ? (
            <i className="caret square up icon"></i>
          ) : (
            <i className="caret square down icon"></i>
          )}
          Advance Search
        </div>

        {open ? (
          <div className="togglecontent">
            <Form onSubmit={handleSubmit}>
              <Form.Group widths="equal">
                <Field
                  component={Form.Input}
                  label="Rule Name"
                  placeholder="Rule Name"
                  name="rule_name"
                />
                <Field
                  component={Form.Input}
                  label="Model"
                  placeholder="Model"
                  name="model"
                />
              </Form.Group>

              <Form.Group widths="equal">
                <Field
                  component={renderCheckbox}
                  label="Enable"
                  name="enable_status"
                />
              </Form.Group>

              <Button.Group>
                <Button positive>Search</Button>
                <Button.Or />
                <Button negative onClick={reset}>
                  Clear
                </Button>
              </Button.Group>
            </Form>
          </div>
        ) : null}
      </div>
    </div>
  );
};