I am trying to send KeyboardEvents to an input element in a JSDOM based test. But for the sake of simplicity here is a web page example. According to every sample, blog post or tutorial I can find it looks like this should work. But it doesn't.
What else do I need?
<html>
<head>
<title>Keyboard Event Conundrum</title>
<script type="text/javascript">
window.onload = function() {
var textField = document.getElementById("text-input");
var button = document.getElementById("the-button");
textField.value = "This works! ";
button.addEventListener("click", function(event) {
textField.value = "";
textField.focus();
// expected to add 'a' to the input's value, but doesn't
var keyEvent = ekp = new KeyboardEvent("keypress", {
altKey: false,
bubbles: true,
code: "KeyA",
ctrlKey: false,
key: "a",
metaKey: false,
shiftKey: false
});
textField.dispatchEvent(keyEvent);
}, false);
}
</script>
</head>
<body>
<div>
<input type="text" id="text-input" />
<button id="the-button" type="button">send keyboard event</button>
</div>
</body>
</html>