`userEvent.keyboard('{Enter}')` doesn't trigger form submission when the submit button is outside the form element, even if it’s associated with the form element by using the button's form attribute.

Reproduction example

https://codesandbox.io/p/devbox/user-event-keyboard-enter-repro-6jvyx5?file=%2Fsrc%2FApp.test.tsx%3A26%2C1

Prerequisites

1. Render form element with an id and attach an event handler to onSubmit. Render radio buttons in it. Render a button outside the form with a form attribute which has the form id.
2. Give a mocked function to the form's onSubmit.
3. Give a focus in any ways to the radio button.
4. Call await user.keyboard("{enter}").
5. Assert onSubmit.

const App = ({ cb }) => {
  return (
    <div>
      <form id="form-test" onSubmit={cb}>
        <label>
          TestInput
          <input type="radio" />
        </label>
      </form>
      <button form="form-test">TestButton</button>
    </div>
  );
};

describe("Test", () => {
  it("works", async () => {
    const click = jest.fn();
    const user = userEvent.setup();

    render(<App cb={click} />);

    await user.click(screen.getByRole("radio", { name: "TestInput" }));
    await user.keyboard("{enter}");

    expect(click).toHaveBeenCalledTimes(1);
  });
});

Expected behavior

I expect the mock function given to onSubmit gets called.

Actual behavior

The mock function given to onSubmit doesn't get called

User-event version

14.5.2

Environment

Testing Library framework:

"@testing-library/jest-dom": "~6.4.0",
"@testing-library/react": "~15.0.6",
"@testing-library/user-event": "~14.5.0",

JS framework:
"react": "~18.3.1",

Test environment:

"jest": "~29.7.0",

DOM implementation:

"jest-environment-jsdom": "~29.7.0",

Additional context

I feel there are inconsistencies on the implicit submission of forms

• The test passes if I place the button inside the form element.
• The test passes if I change the radio button to a normal text input.
• The test fails with a checkbox too.
• I checked the form submission with the Enter keydown and the same elements structure, as written earlier, works on the latest version of Google Chrome, Safari, Firefox and Microsoft Edge.

Start with the reproduction in App.test.tsx from the linked CodeSandbox and run the existing userEvent.keyboard("{enter}") scenario with the radio input and externally associated button. Trace the userEvent.keyboard entry point and add a regression test for this structure; done means the form's onSubmit mock is called once, matching browser behavior.