User-event: [feature request] type should support replacing the current input

[CodingDive]

An option like replaceExisting: boolean for the type event would be neat. It should mimic selecting all the content of the input field (sort of like ctrl+a) and only then start inserting the input into the text field.

[kentcdodds]

This is now supported. You can either first call clear() or (probably better), do this:

// select all:
input.setSelectionRange(0, input.value.length)
await userEvent.type(input, 'whatever new thing you want')

[smriti-spotnana]

Why do we need an await before userEvent.type above, if there is no delay passed?

[kentcdodds]

@smriti-spotnana you don't. My comment was made before that API change was made. The correct way to do this now is:

// select all:
input.setSelectionRange(0, input.value.length)
userEvent.type(input, 'whatever new thing you want')

[smriti-spotnana]

ok, thanks for the reply @kentcdodds

my tests fail intermittently, if I don't use await when typing and then await waitFor(), waiting for a popup to show up (there will you be able to comment on this? Thank You

await userEvent.type(getByRole('textbox', { name: 'Enter City' }), 'Mumbai');
await waitFor(() => {
     expect(getByLabelText('Mumbai, India')).toBeInTheDocument();
});

Edit: Also, I am using "@testing-library/user-event": "^12.1.8", - which explains the above behaviour? :D