[MM-34494] Encapsulate context menu in a class object and add it to each view as necessary (#1544)

src/main/contextMenu.js

@@ -6,8 +6,7 @@ import electronContextMenu from 'electron-context-menu';
 
 import urlUtils from 'common/utils/url';
 
-let disposeCurrent;
-let menuOptions = {
+const defaultMenuOptions = {
     shouldShowMenu: (e, p) => {
         const isInternalLink = p.linkURL.endsWith('#') && p.linkURL.slice(0, -1) === p.pageURL;
         let isInternalSrc;
@@ -27,38 +26,31 @@ let menuOptions = {
     showServices: true,
 };
 
-function dispose() {
-    if (disposeCurrent) {
-        disposeCurrent();
-        disposeCurrent = null;
+export default class ContextMenu {
+    constructor(options, view) {
+        const providedOptions = options || {};
+
+        this.menuOptions = Object.assign({}, defaultMenuOptions, providedOptions);
+        this.view = view;
+
+        this.reload();
+    }
+
+    dispose = () => {
+        if (this.menuDispose) {
+            this.menuDispose();
+            this.menuDispose = null;
+        }
+    }
+
+    reload = () => {
+        this.dispose();
+
+        /**
+         * Work-around issue with passing `WebContents` to `electron-context-menu` in Electron 11
+         * @see https://github.com/sindresorhus/electron-context-menu/issues/123
+         */
+        const options = {window: {webContents: this.view.webContents, inspectElement: this.view.webContents.inspectElement.bind(this.view.webContents), isDestroyed: this.view.webContents.isDestroyed.bind(this.view.webContents), off: this.view.webContents.off.bind(this.view.webContents)}, ...this.menuOptions};
+        this.menuDispose = electronContextMenu(options);
     }
 }
-
-function saveOptions(options) {
-    const providedOptions = options || {};
-
-    menuOptions = Object.assign({}, menuOptions, providedOptions);
-}
-
-function reload(target) {
-    dispose();
-
-    /**
-     * Work-around issue with passing `WebContents` to `electron-context-menu` in Electron 11
-     * @see https://github.com/sindresorhus/electron-context-menu/issues/123
-     */
-    const options = target ? {window: {webContents: target, inspectElement: target.inspectElement.bind(target), isDestroyed: target.isDestroyed.bind(target), off: target.off.bind(target)}, ...menuOptions} : menuOptions;
-    disposeCurrent = electronContextMenu(options);
-}
-
-function setup(options) {
-    saveOptions(options);
-    dispose();
-    disposeCurrent = electronContextMenu(menuOptions);
-}
-
-export default {
-    setup,
-    dispose,
-    reload,
-};

src/main/views/MattermostView.js

@@ -21,6 +21,7 @@ import {
     LOADSCREEN_END,
 } from 'common/communication';
 
+import ContextMenu from '../contextMenu';
 import {getWindowBoundaries, getLocalPreload} from '../utils';
 import * as WindowManager from '../windows/windowManager';
 import * as appState from '../appState';
@@ -82,6 +83,8 @@ export class MattermostView extends EventEmitter {
             this.altLastPressed = false;
             this.view.webContents.on('before-input-event', this.handleInputEvents);
         }
+
+        this.contextMenu = new ContextMenu({}, this.view);
     }
 
     // use the same name as the server

src/main/views/modalView.js

@@ -4,6 +4,7 @@
 import {BrowserView} from 'electron';
 import log from 'electron-log';
 
+import ContextMenu from '../contextMenu';
 import {getWindowBoundaries} from '../utils';
 
 const ACTIVE = 'active';
@@ -33,6 +34,8 @@ export class ModalView {
             log.error('there was an error loading the modal:');
             log.error(e);
         }
+
+        this.contextMenu = new ContextMenu({}, this.view);
     }
 
     show = (win, withDevTools) => {

src/main/views/viewManager.js

@@ -15,7 +15,6 @@ import {
 } from 'common/communication';
 import urlUtils from 'common/utils/url';
 
-import contextMenu from '../contextMenu';
 import {MattermostServer} from '../MattermostServer';
 import {getLocalURLString, getLocalPreload, getWindowBoundaries} from '../utils';
 
@@ -126,7 +125,6 @@ export class ViewManager {
                 } else {
                     this.fadeLoadingScreen();
                 }
-                contextMenu.reload(newView.getWebContents());
             } else {
                 log.warn(`couldn't show ${name}, not ready`);
                 if (newView.needsLoadingScreen()) {

src/main/windows/mainWindow.js

@@ -12,7 +12,7 @@ import log from 'electron-log';
 import {SELECT_NEXT_TAB, SELECT_PREVIOUS_TAB} from 'common/communication';
 
 import * as Validator from '../Validator';
-import contextMenu from '../contextMenu';
+import ContextMenu from '../contextMenu';
 import {getLocalPreload, getLocalURLString} from '../utils';
 
 function saveWindowState(file, window) {
@@ -165,7 +165,9 @@ function createMainWindow(config, options) {
         }
     });
 
-    contextMenu.setup({useSpellChecker: config.useSpellChecker});
+    const contextMenu = new ContextMenu({}, mainWindow);
+    contextMenu.reload();
+
     return mainWindow;
 }
 

src/main/windows/settingsWindow.js

@@ -4,6 +4,7 @@
 import {BrowserWindow} from 'electron';
 import log from 'electron-log';
 
+import ContextMenu from '../contextMenu';
 import {getLocalPreload, getLocalURLString} from '../utils';
 
 export function createSettingsWindow(mainWindow, config, withDevTools) {
@@ -20,6 +21,10 @@ export function createSettingsWindow(mainWindow, config, withDevTools) {
             spellcheck,
             enableRemoteModule: process.env.NODE_ENV === 'test',
         }});
+
+    const contextMenu = new ContextMenu({}, settingsWindow);
+    contextMenu.reload();
+
     const localURL = getLocalURLString('settings.html');
     settingsWindow.setMenuBarVisibility(false);
     settingsWindow.loadURL(localURL).catch(