Is there a way to intercept the Gmail Compose window Send button using InboxSDK?

Question

I'm writing a Chrome extension that modifies the Gmail Compose window to add a control that allows the user to choose between sending the message using our proprietary protocol or as regular email. My question is, once the extension determines the state of the control, how does it intercept the event sent by the Send button?

Answer 1

The easiest way to do that with Javascript:

• find the original send button and clone it
• add an event listener to the fake button
• once the user selects to send the mail using your proprietary protocol simply replace the original button with the fake one
• if the user selects to send as a regular mail, show the original button

A quick example I tried in the console (use it when the ComposeView is open):

// find the original button
const originalSendButton = document.querySelector('.mt-send');
// clone it
const fakeSendButton = originalSendButton.cloneNode(true);
fakeSendButton.addEventListener('click', () => alert('Fake Send Button clicked'));
// show fake button
originalSendButton.parentNode.replaceChild(fakeSendButton, originalSendButton);

// show original button if needed
// fakeSendButton.parentNode.replaceChild(originalSendButton, fakeSendButton);

Answer 2

The best way to do this would be to use the ComposeView "presending" event. Add an event listener (ComposeView.on("presending", callback)), and use the event.cancel() method

ComposeView.on("presending", (e) => {e.cancel()});

You can put your logic in the callback!