为什么``userevent.click''不使用vitest和React测试库触发表格提交？

Question

在使用Create Appl时，以下测试可以运行并通过框即可。

import { render, screen } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import App from "./App";

describe("Update the name", () => {
  it("updates the name", () => {
    render(<App />);
    userEvent.type(screen.getByLabelText(/name/i), "John");
    userEvent.click(screen.getByRole("button"));

    expect(screen.getByText("John")).toBeInTheDocument();
  });
});

因此，测试本身应该很好。是的，只有1️⃣按钮，即type =“ submit”。在浏览器中运行时，APP在Create App App（CRA）中运行时可以正常工作。

我正在尝试使用Vitest（Vite）。从理论上讲，上述测试不需要任何更改。但是，这就是发生的情况：typeError：target.ownerdocument.Createange不是函数。

让我们来到配置。

vite.config.js看起来像这样：

/// <reference types="vitest" />
/// <reference types="vite/client" />

import react from "@vitejs/plugin-react";
import { defineConfig } from "vite";

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [react()],
  test: {
    globals: true,
    environment: "happy-dom",
    setupFiles: "./src/setup.js",
  },
});

./ src/setup.js看起来像这样：导入“ happy-dom”;

是，我还尝试了jsdom。

我还用fireevent.click替换userevent.click。我还将data-Testid添加到我的表单中，并在该表单上直接尝试了fireevent.submit。

在后一种情况下，没有错误，但是表格提交未触发，或者提交提交是被触发的，但渲染尚未更新。

事实是，如果