Simulare click in vanilla JavaScript con MouseEvent

Come possiamo scrivere l’equivalente del metodo .click() di jQuery, simulando di fatto un click?

Cercando in rete si scopre facilmente che esiste già un metodo HTMLElement.click() che simula appunto l’azione dell’utente. Il brutto è che, però, potrebbe comportarsi non esattamente come ci aspettiamo, almeno non con la semplicità offerta da jQuery. In ogni caso, il metodo click()  non può essere triggato su un elemento <a> , che immagino sia spesso quello che vorremmo fare.

Vediamo quindi come utilizzare allora le API MouseEvent di JavaScript per costruire un metodo alternativo funzionante:

var simulateClick = function (elem) {
    // Opzioni
    var evt = new MouseEvent('click', {
        bubbles: true,
        cancelable: true,
        view: window
    });
    // Se cancellato non triggiamo l'evento
    var canceled = !elem.dispatchEvent(evt);
};

Per utilizzarlo, chiamiamo la funzione simulateClick  passandogli l’elemento sul quale simulare il click:

var elemento = document.querySelector('a');
simulateClick(elemento);

Ps. funziona con Internet Explorer dalla versione 9 in poi.