我只是尝试使用酶库中的containsMatchingElement()测试一个电子邮件组件，下面是我正在测试的组件：

import React from "react";
type Props = {
  submitted: boolean;
  email: string;
  handleChange: React.ChangeEventHandler<HTMLInputElement>;
};
const EmailField = ({ submitted, email, handleChange }: Props) => {
  return (
    <React.Fragment>
      <input
        style={{ padding: "0.75em 1em" }}
        type="text"
        className="intro-x login__input input input--lg border border-gray-300 block"
        placeholder="Email"
        name="email"
        value={email}
        onChange={handleChange}
      />
      {submitted && !email ? (
        <h2 className="mt-1 text-theme-6">Email is required</h2>
      ) : null}
    </React.Fragment>
  );
};

export default EmailField;

下面是测试文件，我希望toEqual返回true，但返回了false：

import { shallow, configure } from "enzyme";
import Adapter from "enzyme-adapter-react-16";
import EmailField from "./EmailField";

configure({ adapter: new Adapter() });

describe("rendering error message appropriately", () => {
  it("no error message", () => {
    let email = "z3376349@gmail.com";
    let handleChange = () => {};
    let submitted = true;
    const submittedAndEmailPresent = shallow(
      <EmailField submitted={submitted} email={email} handleChange={handleChange} />
    );

    expect(
      submittedAndEmailPresent.containsMatchingElement(
        <input
          style={{ padding: "0.75em 1em" }}
          type="text"
          className="intro-x login__input input input--lg border border-gray-300 block"
          placeholder="Email"
          name="email"
          value={email}
          onChange={handleChange}
        />
      )
    ).toEqual(true);

    
  });
});

我是酶库的新手，所以我猜我遗漏了一些非常基本的东西。我试着从组件中删除tailwind类，但没有成功。我是否正确使用了containsMatchingElement()方法？