Bug 883220 - Raise the toolbox window if breakpoint is hit, r=vporof

browser/devtools/debugger/DebuggerPanel.jsm

@@ -93,6 +93,9 @@ DebuggerPanel.prototype = {
 
   highlightWhenPaused: function() {
     this._toolbox.highlightTool("jsdebugger");
+    // Also raise the toolbox window if it is undocked or select the
+    // corresponding tab when toolbox is docked.
+    this._toolbox.raise();
   },
 
   unhighlightWhenResumed: function() {

browser/devtools/debugger/test/Makefile.in

@@ -95,6 +95,7 @@ MOCHITEST_BROWSER_TESTS = \
 	browser_dbg_bug737803_editor_actual_location.js \
 	browser_dbg_bug786070_hide_nonenums.js \
 	browser_dbg_bug868163_highight_on_pause.js \
+	browser_dbg_bug883220_raise_on_pause.js \
 	browser_dbg_displayName.js \
 	browser_dbg_pause-exceptions.js \
 	browser_dbg_multiple-windows.js \

browser/devtools/debugger/test/browser_dbg_bug883220_raise_on_pause.js

@@ -0,0 +1,134 @@
+/* vim:set ts=2 sw=2 sts=2 et: */
+/*
+ * Any copyright is dedicated to the Public Domain.
+ * http://creativecommons.org/publicdomain/zero/1.0/
+ */
+
+// Tests that debugger's tab is highlighted when it is paused and not the
+// currently selected tool.
+
+var gTab = null;
+var gTab2 = null;
+var gDebugger = null;
+var gToolbox = null;
+var gToolboxTab = null;
+var gFocusedWindow = null;
+Promise._reportErrors = true;
+
+function test() {
+  debug_tab_pane(STACK_URL, function(aTab, aDebuggee, aPane) {
+    gTab = aTab;
+    gDebugger = aPane.panelWin;
+    gToolbox = aPane._toolbox;
+    gToolboxTab = gToolbox.doc.getElementById("toolbox-tab-jsdebugger");
+    gBrowser.selectedTab = gTab2 = gBrowser.addTab();
+    executeSoon(function() {
+      is(gBrowser.selectedTab, gTab2, "Debugger's tab is not the selected tab.");
+      gFocusedWindow = window;
+      testPause();
+    });
+  });
+}
+
+function focusMainWindow() {
+  // Make sure toolbox is not focused.
+  window.addEventListener("focus", onFocus, true);
+
+  // execute soon to avoid any race conditions between toolbox and main window
+  // getting focused.
+  executeSoon(() => {
+    window.focus();
+  });
+}
+
+function onFocus() {
+  window.removeEventListener("focus", onFocus, true);
+  info("main window focused.")
+  gFocusedWindow = window;
+  testPause();
+}
+
+function testPause() {
+  is(gDebugger.DebuggerController.activeThread.paused, false,
+    "Should be running after debug_tab_pane.");
+
+  is(gFocusedWindow, window, "Main window is the top level window before pause");
+
+  if (gToolbox.hostType == devtools.Toolbox.HostType.WINDOW) {
+    gToolbox._host._window.onfocus = () => {
+      gFocusedWindow = gToolbox._host._window;
+    };
+  }
+
+  gDebugger.DebuggerController.activeThread.addOneTimeListener("paused", function() {
+    Services.tm.currentThread.dispatch({ run: function() {
+
+      if (gToolbox.hostType == devtools.Toolbox.HostType.WINDOW) {
+        is(gFocusedWindow, gToolbox._host._window,
+           "Toolbox window is the top level window on pause.");
+      }
+      else {
+        is(gBrowser.selectedTab, gTab, "Debugger's tab got selected.");
+      }
+      gToolbox.selectTool("webconsole").then(() => {
+        ok(gToolboxTab.classList.contains("highlighted"),
+           "The highlighted class is present");
+        ok(!gToolboxTab.hasAttribute("selected") ||
+           gToolboxTab.getAttribute("selected") != "true",
+           "The tab is not selected");
+      }).then(() => gToolbox.selectTool("jsdebugger")).then(() => {
+        ok(gToolboxTab.classList.contains("highlighted"),
+           "The highlighted class is present");
+        ok(gToolboxTab.hasAttribute("selected") &&
+           gToolboxTab.getAttribute("selected") == "true",
+           "and the tab is selected, so the orange glow will not be present.");
+      }).then(testResume);
+    }}, 0);
+  });
+
+  EventUtils.sendMouseEvent({ type: "mousedown" },
+    gDebugger.document.getElementById("resume"),
+    gDebugger);
+}
+
+function testResume() {
+  gDebugger.DebuggerController.activeThread.addOneTimeListener("resumed", function() {
+    Services.tm.currentThread.dispatch({ run: function() {
+
+      gToolbox.selectTool("webconsole").then(() => {
+        ok(!gToolboxTab.classList.contains("highlighted"),
+           "The highlighted class is not present now after the resume");
+        ok(!gToolboxTab.hasAttribute("selected") ||
+           gToolboxTab.getAttribute("selected") != "true",
+           "The tab is not selected");
+      }).then(maybeEndTest);
+    }}, 0);
+  });
+
+  EventUtils.sendMouseEvent({ type: "mousedown" },
+    gDebugger.document.getElementById("resume"),
+    gDebugger);
+}
+
+function maybeEndTest() {
+  if (gToolbox.hostType == devtools.Toolbox.HostType.WINDOW) {
+    gToolbox.switchHost(devtools.Toolbox.HostType.BOTTOM)
+            .then(closeDebuggerAndFinish);
+  }
+  else {
+    info("switching to toolbox window.")
+    gToolbox.switchHost(devtools.Toolbox.HostType.WINDOW).then(focusMainWindow).then(null, console.error);
+  }
+}
+
+registerCleanupFunction(function() {
+  Services.prefs.setCharPref("devtools.toolbox.host", devtools.Toolbox.HostType.BOTTOM);
+  removeTab(gTab);
+  removeTab(gTab2);
+  gTab = null;
+  gTab2 = null;
+  gDebugger = null;
+  gToolbox = null;
+  gToolboxTab = null;
+  gFocusedWindow = null;
+});

browser/devtools/framework/test/Makefile.in

@@ -28,6 +28,7 @@ MOCHITEST_BROWSER_FILES = \
 		browser_toolbox_options_disablejs.html \
 		browser_toolbox_options_disablejs_iframe.html \
 		browser_toolbox_highlight.js \
+		browser_toolbox_raise.js \
 		$(NULL)
 
 include $(topsrcdir)/config/rules.mk

browser/devtools/framework/test/browser_toolbox_raise.js

@@ -0,0 +1,87 @@
+/* vim: set ts=2 et sw=2 tw=80: */
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+Cu.import("resource://gre/modules/Services.jsm");
+let temp = {}
+Cu.import("resource:///modules/devtools/gDevTools.jsm", temp);
+let DevTools = temp.DevTools;
+
+Cu.import("resource://gre/modules/devtools/Loader.jsm", temp);
+let devtools = temp.devtools;
+
+let Toolbox = devtools.Toolbox;
+
+let toolbox, target, tab1, tab2;
+
+function test() {
+  waitForExplicitFinish();
+
+  gBrowser.selectedTab = tab1 = gBrowser.addTab();
+  tab2 = gBrowser.addTab();
+  target = TargetFactory.forTab(gBrowser.selectedTab);
+
+  gBrowser.selectedBrowser.addEventListener("load", function onLoad(evt) {
+    gBrowser.selectedBrowser.removeEventListener(evt.type, onLoad, true);
+    gDevTools.showToolbox(target)
+             .then(testBottomHost, console.error)
+             .then(null, console.error);
+  }, true);
+
+  content.location = "data:text/html,test for opening toolbox in different hosts";
+}
+
+function testBottomHost(aToolbox) {
+  toolbox = aToolbox;
+
+  // switch to another tab and test toolbox.raise()
+  gBrowser.selectedTab = tab2;
+  executeSoon(function() {
+    is(gBrowser.selectedTab, tab2, "Correct tab is selected before calling raise");
+    toolbox.raise();
+    executeSoon(function() {
+      is(gBrowser.selectedTab, tab1, "Correct tab was selected after calling raise");
+
+      toolbox.switchHost(Toolbox.HostType.WINDOW).then(testWindowHost).then(null, console.error);
+    });
+  });
+}
+
+function testWindowHost() {
+  // Make sure toolbox is not focused.
+  window.addEventListener("focus", onFocus, true);
+
+  // Need to wait for focus  as otherwise window.focus() is overridden by
+  // toolbox window getting focused first on Linux and Mac.
+  let onToolboxFocus = () => {
+    toolbox._host._window.removeEventListener("focus", onToolboxFocus, true);
+    info("focusing main window.");
+    window.focus()
+  };
+  // Need to wait for toolbox window to get focus.
+  toolbox._host._window.addEventListener("focus", onToolboxFocus, true);
+}
+
+function onFocus() {
+  info("Main window is focused before calling toolbox.raise()")
+  window.removeEventListener("focus", onFocus, true);
+
+  // Check if toolbox window got focus.
+  toolbox._host._window.onfocus = () => {
+    ok(true, "Toolbox window is the focused window after calling toolbox.raise()");
+    cleanup();
+  };
+  // Now raise toolbox.
+  toolbox.raise();
+}
+
+function cleanup() {
+  Services.prefs.setCharPref("devtools.toolbox.host", Toolbox.HostType.BOTTOM);
+
+  toolbox.destroy().then(function() {
+    DevTools = Toolbox = toolbox = target = null;
+    gBrowser.removeCurrentTab();
+    gBrowser.removeCurrentTab();
+    finish();
+  });
+}