Bug 1409085 - Tell RDM when picking to stop simulating touch; r=mtigley,gl
authorPatrick Brosset <pbrosset@mozilla.com>
Fri, 29 Mar 2019 09:47:35 +0000
changeset 466738 5b860d8c3379fb714f6a681af763584ef01fc3cf
parent 466737 38f2cdd426ea15c0614adc219c6acd9e10e16ed8
child 466739 5ce12b53d8ec45481f0f4c19857f8b9a961a04b5
push id35780
push useropoprus@mozilla.com
push dateFri, 29 Mar 2019 21:53:01 +0000
treeherdermozilla-central@414f37afbe07 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersmtigley, gl
bugs1409085
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 1409085 - Tell RDM when picking to stop simulating touch; r=mtigley,gl Differential Revision: https://phabricator.services.mozilla.com/D25231
devtools/client/framework/toolbox.js
devtools/server/actors/emulation.js
devtools/server/actors/emulation/touch-simulator.js
devtools/shared/specs/emulation.js
--- a/devtools/client/framework/toolbox.js
+++ b/devtools/client/framework/toolbox.js
@@ -59,16 +59,18 @@ loader.lazyRequireGetter(this, "buildHar
 loader.lazyRequireGetter(this, "NetMonitorAPI",
   "devtools/client/netmonitor/src/api", true);
 loader.lazyRequireGetter(this, "sortPanelDefinitions",
   "devtools/client/framework/toolbox-tabs-order-manager", true);
 loader.lazyRequireGetter(this, "createEditContextMenu",
   "devtools/client/framework/toolbox-context-menu", true);
 loader.lazyRequireGetter(this, "remoteClientManager",
   "devtools/client/shared/remote-debugging/remote-client-manager.js", true);
+loader.lazyRequireGetter(this, "ResponsiveUIManager",
+  "devtools/client/responsive.html/manager", true);
 
 loader.lazyGetter(this, "domNodeConstants", () => {
   return require("devtools/shared/dom-node-constants");
 });
 
 loader.lazyGetter(this, "registerHarOverlay", () => {
   return require("devtools/client/netmonitor/src/har/toolbox-overlay").register;
 });
@@ -1338,33 +1340,54 @@ Toolbox.prototype = {
         this.inspector.nodePicker.cancel();
       }
       // Stop the console from toggling.
       event.stopImmediatePropagation();
     }
   },
 
   _onPickerStarting: async function() {
+    this.tellRDMAboutPickerState(true);
     this.pickerButton.isChecked = true;
     await this.selectTool("inspector", "inspect_dom");
     this.on("select", this.inspector.nodePicker.stop);
   },
 
   _onPickerStarted: async function() {
     this.doc.addEventListener("keypress", this._onPickerKeypress, true);
     this.telemetry.scalarAdd("devtools.inspector.element_picker_used", 1);
   },
 
   _onPickerStopped: function() {
+    this.tellRDMAboutPickerState(false);
     this.off("select", this.inspector.nodePicker.stop);
     this.doc.removeEventListener("keypress", this._onPickerKeypress, true);
     this.pickerButton.isChecked = false;
   },
 
   /**
+   * RDM sometimes simulates touch events. For this to work correctly at all times, it
+   * needs to know when the picker is active or not.
+   * This method communicates with the RDM Manager if it exists.
+   *
+   * @param {Boolean} state
+   */
+  tellRDMAboutPickerState: async function(state) {
+    const { tab } = this.target;
+
+    if (!ResponsiveUIManager.isActiveForTab(tab) ||
+        await !this.target.actorHasMethod("emulation", "setElementPickerState")) {
+      return;
+    }
+
+    const ui = ResponsiveUIManager.getResponsiveUIForTab(tab);
+    await ui.emulationFront.setElementPickerState(state);
+  },
+
+  /**
    * When the picker is canceled, make sure the toolbox
    * gets the focus.
    */
   _onPickerCanceled: function() {
     this.win.focus();
   },
 
   /**
--- a/devtools/server/actors/emulation.js
+++ b/devtools/server/actors/emulation.js
@@ -172,16 +172,40 @@ const EmulationActor = protocol.ActorCla
 
     return false;
   },
 
   /* Touch events override */
 
   _previousTouchEventsOverride: undefined,
 
+  /**
+   * Set the current element picker state.
+   *
+   * True means the element picker is currently active and we should not be emulating
+   * touch events.
+   * False means the element picker is not active and it is ok to emulate touch events.
+   *
+   * This actor method is meant to be called by the DevTools front-end. The reason for
+   * this is the following:
+   * RDM is the only current consumer of the touch simulator. RDM instantiates this actor
+   * on its own, whether or not the Toolbox is opened. That means it does so in its own
+   * Debugger Server instance.
+   * When the Toolbox is running, it uses a different DebuggerServer. Therefore, it is not
+   * possible for the touch simulator to know whether the picker is active or not. This
+   * state has to be sent by the client code of the Toolbox to this actor.
+   * If a future use case arises where we want to use the touch simulator from the Toolbox
+   * too, then we could add code in here to detect the picker mode as described in
+   * https://bugzilla.mozilla.org/show_bug.cgi?id=1409085#c3
+   * @param {Boolean} state
+   */
+  setElementPickerState(state) {
+    this.touchSimulator.setElementPickerState(state);
+  },
+
   setTouchEventsOverride(flag) {
     if (this.getTouchEventsOverride() == flag) {
       return false;
     }
     if (this._previousTouchEventsOverride === undefined) {
       this._previousTouchEventsOverride = this.getTouchEventsOverride();
     }
 
--- a/devtools/server/actors/emulation/touch-simulator.js
+++ b/devtools/server/actors/emulation/touch-simulator.js
@@ -68,17 +68,33 @@ TouchSimulator.prototype = {
       return;
     }
     this.events.forEach(evt => {
       this.simulatorTarget.removeEventListener(evt, this, true);
     });
     this.enabled = false;
   },
 
+  /**
+   * Set the current element picker state value.
+   * True means the element picker is currently active and we should not be emulating
+   * touch events.
+   * False means the element picker is not active and it is ok to emulate touch events.
+   * @param {Boolean} state
+   */
+  setElementPickerState(state) {
+    this._isPicking = state;
+  },
+
   handleEvent(evt) {
+    // Bail out if devtools is in pick mode in the same tab.
+    if (this._isPicking) {
+      return;
+    }
+
     // The gaia system window use an hybrid system even on the device which is
     // a mix of mouse/touch events. So let's not cancel *all* mouse events
     // if it is the current target.
     const content = this.getContent(evt.target);
     if (!content) {
       return;
     }
     const isSystemWindow = content.location.toString()
--- a/devtools/shared/specs/emulation.js
+++ b/devtools/shared/specs/emulation.js
@@ -118,12 +118,19 @@ const emulationSpec = generateActorSpec(
     },
 
     clearUserAgentOverride: {
       request: {},
       response: {
         valueChanged: RetVal("boolean"),
       },
     },
+
+    setElementPickerState: {
+      request: {
+        state: Arg(0, "boolean"),
+      },
+      response: {},
+    },
   },
 });
 
 exports.emulationSpec = emulationSpec;