title: How to simulate/trigger keydown of tab in JavaScript?
body: <p>I'm trying to trigger a keydown of the <kbd>tab</kbd> key in JavaScript.</p>
  <p><strong>Scenario:</strong> 2 HTML input elements. Initially focus is on the 1st input, then wait 3 seconds, then simulate pressing of the tab key, which should set focus to the 2nd input.</p>
  <p><strong>Issue:</strong> Dispatching a <kbd>tab</kbd> <code>keydown</code> event does nothing.</p>
  <p><strong>Fiddles:</strong></p>
  <ul>
  <li>Using KeyboardEvent &amp; dispatchEvent - <a href="http://jsfiddle.net/dH9ZE/" rel="nofollow noreferrer">http://jsfiddle.net/dH9ZE/</a></li>
  <li>Using simulant.js - <a href="http://jsfiddle.net/3E5dB/" rel="nofollow noreferrer">http://jsfiddle.net/3E5dB/</a></li>
  </ul>
  <p>I am after a JavaScript solution. No jQuery thanks.</p>
  <p><strong>Fiddle example using simulant.js below:</strong></p>
  <p>HTML:</p>
  <pre><code>&lt;input id=&quot;first&quot;&gt;
  &lt;input id=&quot;second&quot;&gt;
  &lt;p&gt;Dispatching Tab keydown event in 3 seconds... &lt;span id=&quot;done&quot; style=&quot;color:red&quot;&gt;&lt;/span&gt;&lt;/p&gt;
  </code></pre>
  <p>JavaScript:</p>
  <pre><code>//simulates keydown of the tab key
  function simulateTab() {
      var TAB_KEY = 9;    
      simulant.fire(document, 'keydown', { keyCode: TAB_KEY });
  }
  
  //focus 'first' input
  document.getElementById('first').focus();
  
  //focus 'second' input after 3 seconds
  setTimeout(function(){
      simulateTab();
      document.getElementById('done').innerHTML = 'Done!';
  }, 3000);
  </code></pre>