UserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/52.0.2743.116 Safari/537.36

Steps to reproduce the problem:
1. Follow the link: http://jsbin.com/bagumexeji/1/edit?js,console,output
2. Write down "123" in the first input and then press "Backspace" button.

Here is the minimal JavaScript code to reproduce the problem:

var h1 = document.createElement('h1');
h1.innerHTML = 'Event Dispatching Problem';
document.body.appendChild(h1);

var div = document.createElement('div');
div.innerHTML = 'Write down "123" in the first input and then press "Backspace" button.<br /><b>Expected behaviour:</b> last char deleted<br/><b>Actual behaviour:</b> the whole input is cleared.';
document.body.appendChild(div);

var mainInput = document.createElement('input');
document.body.appendChild(mainInput);
document.body.appendChild(document.createElement('br'));
var secondaryInput = document.createElement('input');
document.body.appendChild(secondaryInput);

mainInput.addEventListener('input', function(e) {
  secondaryInput.dispatchEvent(new KeyboardEvent('keydown', {key: " "}));
});

What is the expected behavior?
Last character of the first input value is deleted.

What went wrong?
The whole input is cleared.

Did this work before? N/A 

Chrome version: 52.0.2743.116  Channel: stable
OS Version: OS X 10.11.6
Flash Version: Shockwave Flash 22.0 r0