Testing Library's user-event type method doesn't work without delay

[peruukki]

Are you submitting a bug report or a feature request?

This is probably a feature request, to be better compatible with widely used Testing Library and its handy user-event library.

What is the current behavior?

Testing Library's user-event library's type method doesn't work with input fields controlled by React Final Form, unless I add a delay between the keystrokes. Without the delay, only the last keystroke is registered.

So this kind of a test:

test("Final Form input field without delay", () => {
  act(() => {
    render(<MyForm />);
  });
  act(() => {
    userEvent.type(screen.getByLabelText("Final Form field"), "Yay!");
  });
  expect(screen.getByLabelText("Final Form field").value).toBe("Yay!");
});

fails like this:

  ● Final Form input field without delay

    expect(received).toBe(expected) // Object.is equality

    Expected: "Yay!"
    Received: "!"

      22 |     userEvent.type(screen.getByLabelText("Final Form field"), "Yay!");
      23 |   });
    > 24 |   expect(screen.getByLabelText("Final Form field").value).toBe("Yay!");
         |                                                           ^
      25 | });
      26 |
      27 | test("Final Form input field with delay", async () => {

      at Object.<anonymous> (src/MyForm.spec.jsx:24:59)

But this succeeds:

test("Final Form input field with delay", async () => {
  act(() => {
    render(<MyForm />);
  });
  await act(async () => {
    await userEvent.type(screen.getByLabelText("Final Form field"), "Yay!", {
      delay: 1
    });
  });
  expect(screen.getByLabelText("Final Form field").value).toBe("Yay!");
});

What is the expected behavior?

I would expect the first test to pass too, for more convenient test writing without unnecessary delays. Though I admit that it isn't realistic to type multiple keystrokes without any delay. 😄 But the same test passes without delay with a plain input element, and I would assume with many other libraries since there is no delay by default.

Sandbox Link

I created tests that reproduce the failure in https://codesandbox.io/s/react-final-form-testing-library-nyozu, including a test case with a plain input field. Unfortunately I'm not able to run the tests there, but you can export the sandbox via hamburger menu > File > Export to ZIP, unzip it on your machine, install dependencies with npm i/yarn and run npm test/yarn test.

What's your environment?

"@testing-library/react": "12.0.0",
"@testing-library/user-event": "13.1.9",
"final-form": "4.20.2",
"react": "17.0.2",
"react-dom": "17.0.2",
"react-final-form": "6.5.3",
"react-scripts": "4.0.0"