Backed out 3 changesets (bug 1349416) for Dev Tools failures CLOSED TREE
authorBogdan Tara <btara@mozilla.com>
Fri, 03 Aug 2018 12:33:32 +0300
changeset 826511 fe0afb18004246b75c6b5586816dfa9390010379
parent 826510 3ffc14b88b8ed2019210e9540bbcab44bc9fa0e0
child 826512 228be4ef7ed11764f008c6fc904089f3ed5f130e
push id118355
push userwisniewskit@gmail.com
push dateSat, 04 Aug 2018 00:24:59 +0000
bugs1349416
milestone63.0a1
backs outec5ee2990e219b1cd1c95053a21878d69ddad52c
c4f8eccf14dcdc14dee9aa597c8a42ed31c75555
b7e80d3a6810f1b98fc0703a0772b6657dfb1ed9
Backed out 3 changesets (bug 1349416) for Dev Tools failures CLOSED TREE Backed out changeset ec5ee2990e21 (bug 1349416) Backed out changeset c4f8eccf14dc (bug 1349416) Backed out changeset b7e80d3a6810 (bug 1349416)
devtools/client/inspector/markup/test/browser_markup_events_click_to_close.js
devtools/client/inspector/markup/views/element-container.js
devtools/client/shared/widgets/tooltip/HTMLTooltip.js
--- a/devtools/client/inspector/markup/test/browser_markup_events_click_to_close.js
+++ b/devtools/client/inspector/markup/test/browser_markup_events_click_to_close.js
@@ -31,46 +31,33 @@ add_task(async function() {
 
   const container2 = await getContainerForSelector("#d2", inspector);
   const evHolder2 = container2.elt.querySelector(".markup-badge[data-event]");
 
   const tooltip = inspector.markup.eventDetailsTooltip;
 
   info("Click the event icon for the first element");
   let onShown = tooltip.once("shown");
-  EventUtils.synthesizeMouseAtCenter(evHolder1, {}, inspector.markup.win);
+  EventUtils.synthesizeMouseAtCenter(evHolder1, {},
+    inspector.markup.doc.defaultView);
   await onShown;
   info("event tooltip for the first div is shown");
 
   info("Click the event icon for the second element");
-  let onHidden = tooltip.once("hidden");
+  const onHidden = tooltip.once("hidden");
   onShown = tooltip.once("shown");
-  EventUtils.synthesizeMouseAtCenter(evHolder2, {}, inspector.markup.win);
+  EventUtils.synthesizeMouseAtCenter(evHolder2, {},
+    inspector.markup.doc.defaultView);
 
   await onHidden;
   info("previous tooltip hidden");
 
   await onShown;
   info("event tooltip for the second div is shown");
 
-  info("Check that clicking on evHolder2 again hides the tooltip");
-  onHidden = tooltip.once("hidden");
-  EventUtils.synthesizeMouseAtCenter(evHolder2, {}, inspector.markup.win);
-  await onHidden;
-
-  info("Check that the tooltip does not reappear immediately after");
-  await waitForTime(1000);
-  is(tooltip.isVisible(), false,
-    "The tooltip is still hidden after waiting for one second");
-
-  info("Open the tooltip on evHolder2 again");
-  onShown = tooltip.once("shown");
-  EventUtils.synthesizeMouseAtCenter(evHolder2, {}, inspector.markup.win);
-  await onShown;
-
   info("Click on the computed view tab");
   const onHighlighterHidden = toolbox.once("node-unhighlight");
   const onTabComputedViewSelected = inspector.sidebar.once("computedview-selected");
   const computedViewTab = inspector.panelDoc.querySelector("#computedview-tab");
   EventUtils.synthesizeMouseAtCenter(computedViewTab, {},
     inspector.panelDoc.defaultView);
 
   await onTabComputedViewSelected;
--- a/devtools/client/inspector/markup/views/element-container.js
+++ b/devtools/client/inspector/markup/views/element-container.js
@@ -96,40 +96,30 @@ MarkupElementContainer.prototype = exten
       return;
     }
     this.editor._displayBadge.classList.toggle("active",
       this.markup.highlighters.gridHighlighterShown === this.node);
   },
 
   async _buildEventTooltipContent(target) {
     const tooltip = this.markup.eventDetailsTooltip;
+
     await tooltip.hide();
 
     const listenerInfo = await this.node.getEventListenerInfo();
 
     const toolbox = this.markup.toolbox;
 
     setEventTooltip(tooltip, listenerInfo, toolbox);
     // Disable the image preview tooltip while we display the event details
     this.markup._disableImagePreviewTooltip();
     tooltip.once("hidden", () => {
       // Enable the image preview tooltip after closing the event details
       this.markup._enableImagePreviewTooltip();
-
-      // Allow clicks on the event badge to display the event popup again
-      // (but allow the currently queued click event to run first).
-      this.markup.win.setTimeout(() => {
-        if (this.editor.eventBadge) {
-          this.editor.eventBadge.style.pointerEvents = "auto";
-        }
-      }, 0);
     });
-
-    // Prevent clicks on the event badge to display the event popup again.
-    this.editor.eventBadge.style.pointerEvents = "none";
     tooltip.show(target);
   },
 
   /**
    * Generates the an image preview for this Element. The element must be an
    * image or canvas (@see isPreviewable).
    *
    * @return {Promise} that is resolved with an object of form
--- a/devtools/client/shared/widgets/tooltip/HTMLTooltip.js
+++ b/devtools/client/shared/widgets/tooltip/HTMLTooltip.js
@@ -325,17 +325,16 @@ function HTMLTooltip(toolboxDoc, {
 
   // The top window is used to attach click event listeners to close the tooltip if the
   // user clicks on the content page.
   this.topWindow = this._getTopWindow();
 
   this._position = null;
 
   this._onClick = this._onClick.bind(this);
-  this._onMouseup = this._onMouseup.bind(this);
   this._onXulPanelHidden = this._onXulPanelHidden.bind(this);
 
   this._toggle = new TooltipToggle(this);
   this.startTogglingOnHover = this._toggle.start.bind(this._toggle);
   this.stopTogglingOnHover = this._toggle.stop.bind(this._toggle);
 
   this.container = this._createContainer();
 
@@ -452,17 +451,16 @@ HTMLTooltip.prototype = {
     this.doc.defaultView.clearTimeout(this.attachEventsTimer);
     this.attachEventsTimer = this.doc.defaultView.setTimeout(() => {
       if (this.autofocus) {
         this.focus();
       }
       // Update the top window reference each time in case the host changes.
       this.topWindow = this._getTopWindow();
       this.topWindow.addEventListener("click", this._onClick, true);
-      this.topWindow.addEventListener("mouseup", this._onMouseup, true);
       this.emit("shown");
     }, 0);
   },
 
   /**
    * Recalculate the dimensions and position of the tooltip in response to
    * changes to its content.
    *
@@ -691,65 +689,52 @@ HTMLTooltip.prototype = {
 
     return { width, height };
   },
 
   /**
    * Hide the current tooltip. The event "hidden" will be fired when the tooltip
    * is hidden.
    */
-  async hide({ fromMouseup = false } = {}) {
+  async hide() {
     this.doc.defaultView.clearTimeout(this.attachEventsTimer);
     if (!this.isVisible()) {
       this.emit("hidden");
       return;
     }
 
-    // If the tooltip is hidden from a mouseup event, wait for a potential click event
-    // to be consumed before removing event listeners.
-    if (fromMouseup) {
-      await new Promise(resolve => this.topWindow.setTimeout(resolve, 0));
-    }
-
-    this.removeEventListeners();
-
+    this.topWindow.removeEventListener("click", this._onClick, true);
     this.container.classList.remove("tooltip-visible");
     if (this.useXulWrapper) {
       await this._hideXulWrapper();
     }
 
     this.emit("hidden");
 
     const tooltipHasFocus = this.container.contains(this.doc.activeElement);
     if (tooltipHasFocus && this._focusedElement) {
       this._focusedElement.focus();
       this._focusedElement = null;
     }
   },
 
-  removeEventListeners: function() {
-    this.topWindow.removeEventListener("click", this._onClick, true);
-    this.topWindow.removeEventListener("mouseup", this._onMouseup, true);
-  },
-
   /**
    * Check if the tooltip is currently displayed.
    * @return {Boolean} true if the tooltip is visible
    */
   isVisible: function() {
     return this.container.classList.contains("tooltip-visible");
   },
 
   /**
    * Destroy the tooltip instance. Hide the tooltip if displayed, remove the
    * tooltip container from the document.
    */
   destroy: function() {
     this.hide();
-    this.removeEventListeners();
     this.container.remove();
     if (this.xulPanelWrapper) {
       this.xulPanelWrapper.remove();
     }
     this._toggle.destroy();
   },
 
   _createContainer: function() {
@@ -776,42 +761,29 @@ HTMLTooltip.prototype = {
     return container;
   },
 
   _onClick: function(e) {
     if (this._isInTooltipContainer(e.target)) {
       return;
     }
 
+    // If the disable autohide setting is in effect, ignore.
+    if (Services.prefs.getBoolPref("ui.popup.disable_autohide", false)) {
+      return;
+    }
+
+    this.hide();
     if (this.consumeOutsideClicks && e.button === 0) {
       // Consume only left click events (button === 0).
       e.preventDefault();
       e.stopPropagation();
     }
   },
 
-  /**
-   * Hide the tooltip on mouseup rather than on click because the surrounding markup
-   * may change on mousedown in a way that prevents a "click" event from being fired.
-   * If the element that received the mousedown and the mouseup are different, click
-   * will not be fired.
-   */
-  _onMouseup: function(e) {
-    if (this._isInTooltipContainer(e.target)) {
-      return;
-    }
-
-    // If the disable autohide setting is in effect, ignore.
-    if (Services.prefs.getBoolPref("ui.popup.disable_autohide", false)) {
-      return;
-    }
-
-    this.hide({ fromMouseup: true });
-  },
-
   _isInTooltipContainer: function(node) {
     // Check if the target is the tooltip arrow.
     if (this.arrow && this.arrow === node) {
       return true;
     }
 
     const tooltipWindow = this.panel.ownerDocument.defaultView;
     let win = node.ownerDocument.defaultView;