title: Is it possible to dispatchEvent() a mouse click to a <input type=text> element?
body: <p>Basically I'm trying to dispatch a custom made mouse click event to a text input element using the following code (see this <a href="http://jsfiddle.net/epevj/10/" rel="nofollow noreferrer">jsFiddle</a>):</p>
  
  <pre><code>function simulateClick(id) {
      var clickEvent = document.createEvent("MouseEvents");
      clickEvent.initMouseEvent("click", true, true, window, 1, 0, 0, 0, 0,
          false, false, false, false, 0, null);
  
      var element = document.getElementById(id);
      element.dispatchEvent(clickEvent);
  }
  </code></pre>
  
  <p>When I run that code on a <code>type="checkbox"</code> element it works perfectly fine but it doesn't work at all when called on a <code>type="text"</code> element.</p>
  
  <p>Now here's the definition of <code>initMouseEvent()</code> on MDN:</p>
  
  <pre><code>event.initMouseEvent(type, canBubble, cancelable, view, 
                   detail, screenX, screenY, clientX, clientY, 
                   ctrlKey, altKey, shiftKey, metaKey, 
                   button, relatedTarget);
  </code></pre>
  
  <p>So in the above example <code>screenX, screenY, clientX</code> and <code>clientY</code> would all be <code>0</code> (still, the above code works perfectly fine with checkboxes regardless of their position). I tried capturing a real event and passing the screen and client coordinates to the cusom made event, to no avail.</p>
  
  <p>I though maybe text input elements ignore custom mouse events due to security reasons, but then <code>element.focus()</code> should't work either, which it does.</p>
  
  <p>Any ideas or insights would be greatly appreciated!</p>