Manually handle misbehaving keyboard shortcuts (#1092)

* manually handle misbehaving keyboard shortcuts MM-19198 MM-19032 includes zooming, redo/undo & copy/cut/paste for good measure * manually handle misbehaving menu items * bump electron minor version * remove temp log import * update context menu package version
2019-10-28 11:27:59 -04:00
parent d017a68d2f
commit 81c32c2d8c
7 changed files with 297 additions and 35 deletions
--- a/package-lock.json
+++ b/package-lock.json
@@ -1391,9 +1391,9 @@
      "dev": true
    },
    "@types/node": {
-      "version": "10.14.18",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-10.14.18.tgz",
-      "integrity": "sha512-ryO3Q3++yZC/+b8j8BdKd/dn9JlzlHBPdm80656xwYUdmPkpTGTjkAdt6BByiNupGPE8w0FhBgvYy/fX9hRNGQ==",
+      "version": "10.17.0",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-10.17.0.tgz",
+      "integrity": "sha512-wuJwN2KV4tIRz1bu9vq5kSPasJ8IsEjZaP1ZR7KlmdUZvGF/rXy8DmXOVwUD0kAtvtJ7aqMKPqUXC0NUTDbrDg==",
      "dev": true
    },
    "@webassemblyjs/ast": {
@@ -4650,9 +4650,9 @@
      "dev": true
    },
    "electron": {
-      "version": "5.0.10",
-      "resolved": "https://registry.npmjs.org/electron/-/electron-5.0.10.tgz",
-      "integrity": "sha512-OSyxTlJ+7Yf0B+6pTdHdxY9RvI4U+mVKAbn+CkAOWxlCPMg3K+jt5UHKSPRRLnXQhQ0Tulg4vupbC0k27aukVw==",
+      "version": "5.0.11",
+      "resolved": "https://registry.npmjs.org/electron/-/electron-5.0.11.tgz",
+      "integrity": "sha512-2QVVycTmvMmKC3S9XV7zSvouYBooHRTOBx1r64nBwtMh44gPydR3HzUbyVYjjxsw+4vIuH6AqNuY48KtWRpajg==",
      "dev": true,
      "requires": {
        "@types/node": "^10.12.18",
--- a/package.json
+++ b/package.json
@@ -52,7 +52,7 @@
    "cross-env": "^5.2.0",
    "css-loader": "^1.0.1",
    "devtron": "^1.4.0",
-    "electron": "^5.0.10",
+    "electron": "^5.0.11",
    "electron-builder": "^21.2.0",
    "electron-connect": "^0.6.3",
    "electron-notarize": "^0.1.1",
--- a/src/browser/components/MainPage.jsx
+++ b/src/browser/components/MainPage.jsx
@@ -78,6 +78,17 @@ export default class MainPage extends React.Component {
    return null;
  }

+  getTabWebContents(index = this.state.key || 0, teams = this.props.teams) {
+    if (!teams || !teams.length || index > teams.length) {
+      return null;
+    }
+    const tabURL = teams[index].url;
+    if (!tabURL) {
+      return null;
+    }
+    return remote.webContents.getAllWebContents().find((webContents) => webContents.getURL().includes(tabURL));
+  }
+
  componentDidMount() {
    const self = this;
    ipcRenderer.on('login-request', (event, request, authInfo) => {
@@ -133,6 +144,84 @@ export default class MainPage extends React.Component {
      document.getElementById(`mattermostView${self.state.key}`).openDevTools();
    });

+    ipcRenderer.on('zoom-in', () => {
+      const activeTabWebContents = this.getTabWebContents(this.state.key);
+      if (!activeTabWebContents) {
+        return;
+      }
+      if (activeTabWebContents.getZoomLevel() >= 9) {
+        return;
+      }
+      activeTabWebContents.setZoomLevel(activeTabWebContents.getZoomLevel() + 1);
+    });
+
+    ipcRenderer.on('zoom-out', () => {
+      const activeTabWebContents = this.getTabWebContents(this.state.key);
+      if (!activeTabWebContents) {
+        return;
+      }
+      if (activeTabWebContents.getZoomLevel() <= -8) {
+        return;
+      }
+      activeTabWebContents.setZoomLevel(activeTabWebContents.getZoomLevel() - 1);
+    });
+
+    ipcRenderer.on('zoom-reset', () => {
+      const activeTabWebContents = this.getTabWebContents(this.state.key);
+      if (!activeTabWebContents) {
+        return;
+      }
+      activeTabWebContents.setZoomLevel(0);
+    });
+
+    ipcRenderer.on('undo', () => {
+      const activeTabWebContents = this.getTabWebContents(this.state.key);
+      if (!activeTabWebContents) {
+        return;
+      }
+      activeTabWebContents.undo();
+    });
+
+    ipcRenderer.on('redo', () => {
+      const activeTabWebContents = this.getTabWebContents(this.state.key);
+      if (!activeTabWebContents) {
+        return;
+      }
+      activeTabWebContents.redo();
+    });
+
+    ipcRenderer.on('cut', () => {
+      const activeTabWebContents = this.getTabWebContents(this.state.key);
+      if (!activeTabWebContents) {
+        return;
+      }
+      activeTabWebContents.cut();
+    });
+
+    ipcRenderer.on('copy', () => {
+      const activeTabWebContents = this.getTabWebContents(this.state.key);
+      if (!activeTabWebContents) {
+        return;
+      }
+      activeTabWebContents.copy();
+    });
+
+    ipcRenderer.on('paste', () => {
+      const activeTabWebContents = this.getTabWebContents(this.state.key);
+      if (!activeTabWebContents) {
+        return;
+      }
+      activeTabWebContents.paste();
+    });
+
+    ipcRenderer.on('paste-and-match', () => {
+      const activeTabWebContents = this.getTabWebContents(this.state.key);
+      if (!activeTabWebContents) {
+        return;
+      }
+      activeTabWebContents.pasteAndMatchStyle();
+    });
+
    //goBack and goForward
    ipcRenderer.on('go-back', () => {
      const mattermost = self.refs[`mattermostView${self.state.key}`];
--- a/src/main.js
+++ b/src/main.js
@@ -445,6 +445,62 @@ function handleAppWebContentsCreated(dc, contents) {
    }
    popupWindow.loadURL(url);
  });
+
+  // implemented to temporarily help solve for https://community-daily.mattermost.com/core/pl/b95bi44r4bbnueqzjjxsi46qiw
+  contents.on('before-input-event', (event, input) => {
+    if (!input.shift && !input.control && !input.alt && !input.meta) {
+      return;
+    }
+
+    if ((process.platform === 'darwin' && !input.meta) || (process.platform !== 'darwin' && !input.control)) {
+      return;
+    }
+
+    // handle certain keyboard shortcuts manually
+    switch (input.key) { // eslint-disable-line padded-blocks
+
+    // Manually handle zoom-in/out/reset keyboard shortcuts
+    // - temporary fix for https://mattermost.atlassian.net/browse/MM-19031 and https://mattermost.atlassian.net/browse/MM-19032
+    case '-':
+      mainWindow.webContents.send('zoom-out');
+      break;
+    case '=':
+      mainWindow.webContents.send('zoom-in');
+      break;
+    case '0':
+      mainWindow.webContents.send('zoom-reset');
+      break;
+
+    // Manually handle undo/redo keyboard shortcuts
+    // - temporary fix for https://mattermost.atlassian.net/browse/MM-19198
+    case 'z':
+      if (input.shift) {
+        mainWindow.webContents.send('redo');
+      } else {
+        mainWindow.webContents.send('undo');
+      }
+      break;
+
+    // Manually handle copy/cut/paste keyboard shortcuts
+    case 'c':
+      mainWindow.webContents.send('copy');
+      break;
+    case 'x':
+      mainWindow.webContents.send('cut');
+      break;
+    case 'v':
+      if (input.shift) {
+        mainWindow.webContents.send('paste-and-match');
+      } else {
+        mainWindow.webContents.send('paste');
+      }
+      break;
+    default:
+      // allows the input event to proceed if not handled by a case above
+      return;
+    }
+    event.preventDefault();
+  });
 }

 function initializeAfterAppReady() {
--- a/src/main/menus/app.js
+++ b/src/main/menus/app.js
@@ -76,15 +76,42 @@ function createTemplate(mainWindow, config, isDev) {
  template.push({
    label: '&Edit',
    submenu: [{
-      role: 'undo',
+      label: 'Undo',
+      accelerator: 'CmdOrCtrl+Z',
+      click() {
+        mainWindow.webContents.send('undo');
+      },
    }, {
-      role: 'redo',
+      label: 'Redo',
+      accelerator: 'CmdOrCtrl+SHIFT+Z',
+      click() {
+        mainWindow.webContents.send('redo');
+      },
    }, separatorItem, {
-      role: 'cut',
+      label: 'Cut',
+      accelerator: 'CmdOrCtrl+X',
+      click() {
+        mainWindow.webContents.send('cut');
+      },
    }, {
-      role: 'copy',
+      label: 'Copy',
+      accelerator: 'CmdOrCtrl+C',
+      click() {
+        mainWindow.webContents.send('copy');
+      },
    }, {
-      role: 'paste',
+      label: 'Paste',
+      accelerator: 'CmdOrCtrl+V',
+      click() {
+        mainWindow.webContents.send('paste');
+      },
+    }, {
+      label: 'Paste and Match Style',
+      accelerator: 'CmdOrCtrl+SHIFT+V',
+      visible: process.platform === 'darwin',
+      click() {
+        mainWindow.webContents.send('paste-and-match');
+      },
    }, {
      role: 'selectall',
    }],
@@ -126,21 +153,23 @@ function createTemplate(mainWindow, config, isDev) {
    }, {
      role: 'togglefullscreen',
    }, separatorItem, {
-      role: 'resetzoom',
+      label: 'Actual Size',
+      accelerator: 'CmdOrCtrl+0',
+      click() {
+        mainWindow.webContents.send('zoom-reset');
+      },
    }, {
-      role: 'zoomin',
+      label: 'Zoom In',
+      accelerator: 'CmdOrCtrl+SHIFT+=',
+      click() {
+        mainWindow.webContents.send('zoom-in');
+      },
    }, {
-      label: 'Zoom In (hidden)',
-      accelerator: 'CmdOrCtrl+=',
-      visible: false,
-      role: 'zoomin',
-    }, {
-      role: 'zoomout',
-    }, {
-      label: 'Zoom Out (hidden)',
-      accelerator: 'CmdOrCtrl+Shift+-',
-      visible: false,
-      role: 'zoomout',
+      label: 'Zoom Out',
+      accelerator: 'CmdOrCtrl+-',
+      click() {
+        mainWindow.webContents.send('zoom-out');
+      },
    }, separatorItem, {
      label: 'Developer Tools for Application Wrapper',
      accelerator: (() => {
--- a/src/package-lock.json
+++ b/src/package-lock.json
@@ -72,6 +72,14 @@
      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
      "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8="
    },
+    "ansi-styles": {
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
+      "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
+      "requires": {
+        "color-convert": "^1.9.0"
+      }
+    },
    "applescript": {
      "version": "1.0.0",
      "resolved": "https://registry.npmjs.org/applescript/-/applescript-1.0.0.tgz",
@@ -85,6 +93,11 @@
        "sprintf-js": "~1.0.2"
      }
    },
+    "astral-regex": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/astral-regex/-/astral-regex-1.0.0.tgz",
+      "integrity": "sha512-+Ryf6g3BKoRc7jfp7ad8tM4TtMiaWvbF/1/sQcZPkkS7ag3D5nMBCe2UfOTONtAkaG0tO0ij3C5Lwmf1EiyjHg=="
+    },
    "auto-launch": {
      "version": "5.0.5",
      "resolved": "https://registry.npmjs.org/auto-launch/-/auto-launch-5.0.5.tgz",
@@ -182,6 +195,45 @@
      "resolved": "https://registry.npmjs.org/classnames/-/classnames-2.2.6.tgz",
      "integrity": "sha512-JR/iSQOSt+LQIWwrwEzJ9uk0xfN3mTVYMwt1Ir5mUcSN6pU+V4zQFFaJsclJbPuAUQH+yfWef6tm7l1quW3C8Q=="
    },
+    "cli-truncate": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/cli-truncate/-/cli-truncate-2.0.0.tgz",
+      "integrity": "sha512-C4hp+8GCIFVsUUiXcw+ce+7wexVWImw8rQrgMBFsqerx9LvvcGlwm6sMjQYAEmV/Xb87xc1b5Ttx505MSpZVqg==",
+      "requires": {
+        "slice-ansi": "^2.1.0",
+        "string-width": "^4.1.0"
+      },
+      "dependencies": {
+        "ansi-regex": {
+          "version": "4.1.0",
+          "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-4.1.0.tgz",
+          "integrity": "sha512-1apePfXM1UOSqw0o9IiFAovVz9M5S1Dg+4TrDwfMewQ6p/rmMueb7tWZjQ1rx4Loy1ArBggoqGpfqqdI4rondg=="
+        },
+        "is-fullwidth-code-point": {
+          "version": "3.0.0",
+          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
+          "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg=="
+        },
+        "string-width": {
+          "version": "4.1.0",
+          "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.1.0.tgz",
+          "integrity": "sha512-NrX+1dVVh+6Y9dnQ19pR0pP4FiEIlUvdTGn8pw6CKTNq5sgib2nIhmUNT5TAmhWmvKr3WcxBcP3E8nWezuipuQ==",
+          "requires": {
+            "emoji-regex": "^8.0.0",
+            "is-fullwidth-code-point": "^3.0.0",
+            "strip-ansi": "^5.2.0"
+          }
+        },
+        "strip-ansi": {
+          "version": "5.2.0",
+          "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-5.2.0.tgz",
+          "integrity": "sha512-DuRs1gKbBqsMKIZlrffwlug8MHkcnpjs5VPmL1PAh+mA30U0DTotfDZ0d2UUsXpPmPmMMJ6W773MaA3J+lbiWA==",
+          "requires": {
+            "ansi-regex": "^4.1.0"
+          }
+        }
+      }
+    },
    "cliui": {
      "version": "3.2.0",
      "resolved": "https://registry.npmjs.org/cliui/-/cliui-3.2.0.tgz",
@@ -197,6 +249,19 @@
      "resolved": "https://registry.npmjs.org/code-point-at/-/code-point-at-1.1.0.tgz",
      "integrity": "sha1-DQcLTQQ6W+ozovGkDi7bPZpMz3c="
    },
+    "color-convert": {
+      "version": "1.9.3",
+      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
+      "integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==",
+      "requires": {
+        "color-name": "1.1.3"
+      }
+    },
+    "color-name": {
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz",
+      "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU="
+    },
    "concat-map": {
      "version": "0.0.1",
      "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
@@ -238,10 +303,11 @@
      }
    },
    "electron-context-menu": {
-      "version": "0.10.1",
-      "resolved": "https://registry.npmjs.org/electron-context-menu/-/electron-context-menu-0.10.1.tgz",
-      "integrity": "sha512-KFkKwFbT6iJUgarEknYuXQlJAT+naJZtSWFBtHf9RiSb70wscWdDNpYoUERzF7FgqYE1Mil4npfRWsjqGLwtog==",
+      "version": "0.15.0",
+      "resolved": "https://registry.npmjs.org/electron-context-menu/-/electron-context-menu-0.15.0.tgz",
+      "integrity": "sha512-XLdtbX90NPkWycG3IzwtCmfX4ggu+lofNOW1nVRStb+ScFs49WTourW1k77Z4DTyThR3gUHg3UPXVBMbW1gNsg==",
      "requires": {
+        "cli-truncate": "^2.0.0",
        "electron-dl": "^1.2.0",
        "electron-is-dev": "^1.0.1"
      }
@@ -258,9 +324,9 @@
      }
    },
    "electron-dl": {
-      "version": "1.12.0",
-      "resolved": "https://registry.npmjs.org/electron-dl/-/electron-dl-1.12.0.tgz",
-      "integrity": "sha512-UMc2CL45Ybpvu66LDPYzwmDRmYK4Ivz+wdnTM0eXcNMztvQwhixAk2UPme1c7McqG8bAlKEkQpZn3epmQy4EWg==",
+      "version": "1.14.0",
+      "resolved": "https://registry.npmjs.org/electron-dl/-/electron-dl-1.14.0.tgz",
+      "integrity": "sha512-4okyei42a1mLsvLK7hLrIfd20EQzB18nIlLTwBV992aMSmTGLUEFRTmO1MfSslGNrzD8nuPuy1l/VxO8so4lig==",
      "requires": {
        "ext-name": "^5.0.0",
        "pupa": "^1.0.0",
@@ -300,6 +366,11 @@
        }
      }
    },
+    "emoji-regex": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
+      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A=="
+    },
    "esprima": {
      "version": "4.0.1",
      "resolved": "https://registry.npmjs.org/esprima/-/esprima-4.0.1.tgz",
@@ -463,9 +534,9 @@
      }
    },
    "mime-db": {
-      "version": "1.37.0",
-      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.37.0.tgz",
-      "integrity": "sha512-R3C4db6bgQhlIhPU48fUtdVmKnflq+hRdad7IyKhtFj06VPNVdk2RhiYL3UjQIlso8L+YxAtFkobT0VK+S/ybg=="
+      "version": "1.42.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.42.0.tgz",
+      "integrity": "sha512-UbfJCR4UAVRNgMpfImz05smAXK7+c+ZntjaA26ANtkXLlOe947Aag5zdIcKQULAiF9Cq4WxBi9jUs5zkA84bYQ=="
    },
    "minimatch": {
      "version": "3.0.4",
@@ -688,6 +759,23 @@
        "unzip-stream": "^0.3.0"
      }
    },
+    "slice-ansi": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/slice-ansi/-/slice-ansi-2.1.0.tgz",
+      "integrity": "sha512-Qu+VC3EwYLldKa1fCxuuvULvSJOKEgk9pi8dZeCVK7TqBfUNTH4sFkk4joj8afVSfAYgJoSOetjx9QWOJ5mYoQ==",
+      "requires": {
+        "ansi-styles": "^3.2.0",
+        "astral-regex": "^1.0.0",
+        "is-fullwidth-code-point": "^2.0.0"
+      },
+      "dependencies": {
+        "is-fullwidth-code-point": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz",
+          "integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8="
+        }
+      }
+    },
    "sort-keys": {
      "version": "1.1.2",
      "resolved": "https://registry.npmjs.org/sort-keys/-/sort-keys-1.1.2.tgz",
--- a/src/package.json
+++ b/src/package.json
@@ -12,7 +12,7 @@
    "@hapi/joi": "^15.1.0",
    "auto-launch": "^5.0.5",
    "bootstrap": "^3.3.7",
-    "electron-context-menu": "^0.10.1",
+    "electron-context-menu": "^0.15.0",
    "electron-devtools-installer": "^2.2.4",
    "electron-is-dev": "^1.0.1",
    "electron-log": "^2.2.17",