Clone a DOM event object to re-dispatch
I found my own answer, at least for MouseEvents specifically:
function cloneMouseEvent( e ) {
var evt = document.createEvent( "MouseEvent" );
evt.initMouseEvent( e.type, e.canBubble, e.cancelable, e.view, e.detail, e.screenX, e.screenY, e.clientX, e.clientY, e.ctrlKey, e.altKey, e.shiftKey, e.metaKey, e.button, e.relatedTarget );
return evt;
}
You can then dispatch the event on a target with:
target.dispatchEvent( evt );
It seems there is now an even better solution, since initMouseEvent
and the like are deprecated. The MouseEvent() constructor, for example, takes a table of properties as its second parameter, for which you can use an existing MouseEvent object:
let my_event = new MouseEvent(`foo`, some_existing_mouse_event);
dispatchEvent(my_event);
Other classes of events have similar constructors that should be usable in the same way. Such as ClipboardEvent().
jsfiddle example