Firing event by react-testing-library and handling it in onInput event

[valisij94]

Hi all! Need a help with react-testing-library. I use Preact in my project, and use preact-testing-library wrapper for RTL. The problem is in the onInput event. The project is big and there are many controlled inputs. These inputs don't have onChange event handler, but they have onInput handler instead. I'm trying to write a simple test for my component:

it('First test', async () => {
  const field = await screen.findByLabelText('label');
  // type in the field
  fireEvent.input(field,  { target: { value: 'BADBADBAD12345' }});
});

And this is a code fragment of my component:

<input
    type="tel"
    autoComplete="tel"
    id={id}
    title={title}
    name={name}
    className={classes}
    onPaste={this.pasteHandler}
    onInput={this.inputHandler}
    onBlur={this.blur}
    onFocus={this.focused}
    onKeyDown={this.keyDown}
    onChange={(e) => {console.log('changed ', e.target.value)}}
    value={this.state.value}
    required={required}
  />

When I call the fireEvent.change method, the onChange handler called. But no method (fireEvent.change, fireEvent.input) does not fire the onInput handler. I tried to use @testing-library/user-event, and call userEvent.type, but still no effect. Can somebody help with this issue? I don't have any option to change the onInput to onChange.

[mikerob215]

@valisij94 is there any chance you have a reproduction of this? I'd be interested in looking into it. Experimenting locally in a simple example, this seems to work for me,