title: Input fill with keypress simulation
body: <p>Let's say we have an input and we want to add some texts to it:</p>
  <pre><code> &lt;form&gt;
  First name:&lt;br&gt;
  &lt;input type=&quot;text&quot; id=&quot;thename&quot; name=&quot;firstname&quot;&gt;
  &lt;/form&gt; 
  </code></pre>
  <p>The simple thing is to add value to input with classic <code>element.value...</code> .
  But what if I want to add for example 'David' by simulating the <code>keypress</code> event?</p>
  <p>I followed several approaches like this:</p>
  <pre><code>function simulateKeyEvent(character) {
    var evt = document.createEvent(&quot;KeyboardEvent&quot;);
    (evt.initKeyEvent || evt.initKeyboardEvent)(&quot;keypress&quot;, true, true, window,
                      0, 0, 0, 0,
                      0, character.charCodeAt(0)) 
    var canceled = !body.dispatchEvent(evt);
    if(canceled) {
      // A handler called preventDefault
      alert(&quot;canceled&quot;);
    } else {
      // None of the handlers called preventDefault
      alert(&quot;not canceled&quot;);
    }
  }
  </code></pre>
  <p>Taken from <a href="https://stackoverflow.com/questions/961532/firing-a-keyboard-event-in-javascript">here</a> and read almost every solutions but they didn't work.</p>
  <p>Note: I'm working in Firefox and Chrome</p>