Bug 1543940 - Rely on chromeEventHandler for toolboxContextMenu events r=ochameau
authorJulian Descottes <jdescottes@mozilla.com>
Wed, 08 May 2019 21:35:02 +0000
changeset 531949 0484e2e8f7fd170c14218dcf60c9c3983e1a8267
parent 531948 9b6e243f261203cbc078d25a9725c0e5ac44003f
child 531950 388f61b1b134177011dcfe55f52faff072a50052
push id11265
push userffxbld-merge
push dateMon, 13 May 2019 10:53:39 +0000
treeherdermozilla-beta@77e0fe8dbdd3 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersochameau
bugs1543940
milestone68.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1543940 - Rely on chromeEventHandler for toolboxContextMenu events r=ochameau Using chromeEventHandler will allow us to catch events fired from any frame. By default when DevTools are in a type=chrome frame, events also bubble across frames. With type=content this is no longer the case. Differential Revision: https://phabricator.services.mozilla.com/D27693
devtools/client/framework/toolbox.js
--- a/devtools/client/framework/toolbox.js
+++ b/devtools/client/framework/toolbox.js
@@ -170,16 +170,17 @@ function Toolbox(target, selectedTool, h
   this._onPickerStarting = this._onPickerStarting.bind(this);
   this._onPickerStarted = this._onPickerStarted.bind(this);
   this._onPickerStopped = this._onPickerStopped.bind(this);
   this._onPickerCanceled = this._onPickerCanceled.bind(this);
   this._onInspectObject = this._onInspectObject.bind(this);
   this._onNewSelectedNodeFront = this._onNewSelectedNodeFront.bind(this);
   this._onToolSelected = this._onToolSelected.bind(this);
   this._onTargetClosed = this._onTargetClosed.bind(this);
+  this._onContextMenu = this._onContextMenu.bind(this);
   this.updateToolboxButtonsVisibility = this.updateToolboxButtonsVisibility.bind(this);
   this.updateToolboxButtons = this.updateToolboxButtons.bind(this);
   this.selectTool = this.selectTool.bind(this);
   this._pingTelemetrySelectTool = this._pingTelemetrySelectTool.bind(this);
   this.toggleSplitConsole = this.toggleSplitConsole.bind(this);
   this.toggleOptions = this.toggleOptions.bind(this);
   this.togglePaintFlashing = this.togglePaintFlashing.bind(this);
   this.toggleDragging = this.toggleDragging.bind(this);
@@ -505,31 +506,16 @@ Toolbox.prototype = {
       this.isReady = true;
 
       const framesPromise = this._listFrames();
 
       Services.prefs.addObserver("devtools.cache.disabled", this._applyCacheSettings);
       Services.prefs.addObserver("devtools.serviceWorkers.testing.enabled",
                                  this._applyServiceWorkersTestingSettings);
 
-      // Register listener for handling context menus in standard
-      // input elements: <input> and <textarea>.
-      // There is also support for custom input elements using
-      // .devtools-input class (e.g. CodeMirror instances).
-      this.doc.addEventListener("contextmenu", (e) => {
-        if (e.originalTarget.closest("input[type=text]") ||
-            e.originalTarget.closest("input[type=search]") ||
-            e.originalTarget.closest("input:not([type])") ||
-            e.originalTarget.closest(".devtools-input") ||
-            e.originalTarget.closest("textarea")) {
-          e.stopPropagation();
-          e.preventDefault();
-          this.openTextBoxContextMenu(e.screenX, e.screenY);
-        }
-      });
       // Get the DOM element to mount the ToolboxController to.
       this._componentMount = this.doc.getElementById("toolbox-toolbar-mount");
 
       this._mountReactComponent();
       this._buildDockOptions();
       this._buildTabs();
       this._applyCacheSettings();
       this._applyServiceWorkersTestingSettings();
@@ -643,31 +629,33 @@ Toolbox.prototype = {
     }
 
     // Add shortcuts and window-host-shortcuts that use the ChromeEventHandler as target.
     this._addShortcuts();
     this._addWindowHostShortcuts();
 
     this._chromeEventHandler.addEventListener("keypress", this._splitConsoleOnKeypress);
     this._chromeEventHandler.addEventListener("focus", this._onFocus, true);
+    this._chromeEventHandler.addEventListener("contextmenu", this._onContextMenu);
   },
 
   _removeChromeEventHandlerEvents: function() {
     if (!this._chromeEventHandler) {
       return;
     }
 
     // Remove shortcuts and window-host-shortcuts that use the ChromeEventHandler as
     // target.
     this._removeShortcuts();
     this._removeWindowHostShortcuts();
 
     this._chromeEventHandler.removeEventListener("keypress",
       this._splitConsoleOnKeypress);
     this._chromeEventHandler.removeEventListener("focus", this._onFocus, true);
+    this._chromeEventHandler.removeEventListener("contextmenu", this._onContextMenu);
 
     this._chromeEventHandler = null;
   },
 
   _addShortcuts: function() {
     // Create shortcuts instance for the toolbox
     if (!this.shortcuts) {
       this.shortcuts = new KeyShortcuts({
@@ -789,16 +777,31 @@ Toolbox.prototype = {
 
   _removeWindowHostShortcuts: function() {
     if (this._windowHostShortcuts) {
       this._windowHostShortcuts.destroy();
       this._windowHostShortcuts = null;
     }
   },
 
+  _onContextMenu: function(e) {
+    // Handle context menu events in standard input elements: <input> and <textarea>.
+    // Also support for custom input elements using .devtools-input class
+    // (e.g. CodeMirror instances).
+    if (e.originalTarget.closest("input[type=text]") ||
+        e.originalTarget.closest("input[type=search]") ||
+        e.originalTarget.closest("input:not([type])") ||
+        e.originalTarget.closest(".devtools-input") ||
+        e.originalTarget.closest("textarea")) {
+      e.stopPropagation();
+      e.preventDefault();
+      this.openTextBoxContextMenu(e.screenX, e.screenY);
+    }
+  },
+
   _getDebugTargetData: function() {
     const url = new URL(this.win.location);
     const searchParams = new this.win.URLSearchParams(url.search);
 
     const targetType = searchParams.get("type") || DEBUG_TARGET_TYPES.TAB;
 
     const remoteId = searchParams.get("remoteId");
     const runtimeInfo = remoteClientManager.getRuntimeInfoByRemoteId(remoteId);