karlhorky / refined-gmail-userscript Goto Github PK

Implementation strategy for: Always window.open new windows on clicks to Compose button and Reply button

Use DOM modification and event interception + modification to do this:

1. Compose button
   1. Add new "click catcher" element to the DOM inside the compose button
   2. Stop propagation on the original event
   3. Fire new event with shiftKey: true
2. Reply and Forward button
   1. Listen for "new email viewed" event (maybe with add an XHR interceptor like gmail.js and then search for the .Bu div.if .ams.bkH (Reply) and .Bu div.if .ams.bkH (Forward))
   2. Add new "click catcher" element to the DOM inside the reply/forward button
   3. Stop propagation on the original event
   4. Fire new event with shiftKey: true
   5. Unfortunately, this will only open up a compose div inside the application. So we need to continue:
   6. Wait for this element (use mutationObserver?)
   7. Trigger a mousedown and mouseup (with shiftKey: true) on the little diagonal arrow in the top right of this compose div

Some incomplete code:

// The relatively-stable compose button selector in Gmail
const composeButtonSelector = ".T-I.J-J5-Ji.T-I-KE.L3";

// TODO: Create full-sized element with the class `clickCatcher` inside compose button selector to intercept clicks

document.querySelector(`${composeButtonSelector} > .clickCatcher`).onclick = (
  event
) => {
  event.stopPropagation();
  const composeButton = document.querySelector(composeButtonSelector);
  // Need mousedown and mouseup for Gmail
  // Source: https://stackoverflow.com/a/57512820/1268612
  composeButton.dispatchEvent(new MouseEvent("mousedown", { shiftKey: true }));
  setTimeout(() =>
    composeButton.dispatchEvent(new MouseEvent("mouseup", { shiftKey: true }))
  );
};