How can I programmatically click a button in Google Docs with a Chrome Extension?

Question

My Chrome Extension can interact with the Comment bubbles created in Google Docs...insert text etc.

What I can't do is click the Comment button to actually post/submit a comment. Is this possible?

The Google Docs bubble button you click to submit has a class of

docos-input-buttons-post

So I've tried:

$('.docos-input-buttons-post')[0].trigger('click');

and:

var simulateClick = function (elem) {
// Create our event (with options)
console.log('Simulating click with: ', elem);
// var evt = document.createEvent("MouseEvents");
// evt.initMouseEvent("click", true, true, window,
//     0, 0, 0, 0, 0, false, false, false, false, 0, null);
var evt = new MouseEvent('click', {
    bubbles: true,
    cancelable: true,
    view: window
});
// If cancelled, don't dispatch our event
    elem.dispatchEvent(evt);
    var canceled = !elem.dispatchEvent(evt);
};

var someLink = document.querySelector('.docos-input-buttons-post');
simulateClick(someLink);

Either I get errors ('not a function') or nothing happens.

Suggestions/direction appreciated!

Answer 1

Send mousedown and mouseup :

const el = document.querySelector('.docos-input-buttons-post');
el.dispatchEvent(new MouseEvent('mousedown'));
el.dispatchEvent(new MouseEvent('mouseup'));