Fill in the ReactJS input field as an end user

Question

Using Javascript, how can I fill out an input field in a ReactJS form from an end-user perspective? Is there a specific sequence of events that React listens to when I usually update the input?

I know this is possible because a utility like 1Password works great when connecting a saved Identity and apparently using a combination of keyboard events. I tried to find the answer there, although their miniature JS code is hard to understand, as they handle many input types and extreme cases among hundreds of sites.

Answer 1

To update a text field element:

, - ( , box:

  var event = document.createEvent('FocusEvent');
  event.initEvent('focus', true, true);
  box.dispatchEvent(event);

, , "textInput". "3":

  var event = document.createEvent('TextEvent');
  event.initTextEvent('textInput', true, true, window, "3");
  box.dispatchEvent(event);

, , - , :

  var event = document.createEvent('FocusEvent');
  event.initEvent('blur', true, true);
  box.dispatchEvent(event);

: ( "select" )

  select.value = "the option value"
  var event = document.createEvent('Event');
  event.initEvent('input', true, true)
  select.dispatchEvent(event)

  var event = document.createEvent('Event');
  event.initEvent('change', true, true)
  select.dispatchEvent(event)