Bug 818442 - [toolbox] Re-focus devtools window after locking the highlighter. r=harth

browser/devtools/inspector/Highlighter.jsm

@@ -96,7 +96,7 @@ Highlighter.prototype = {
 
   _init: function Highlighter__init()
   {
-    this.unlock = this.unlock.bind(this);
+    this.unlockAndFocus = this.unlockAndFocus.bind(this);
     this.updateInfobar = this.updateInfobar.bind(this);
     this.highlight = this.highlight.bind(this);
 
@@ -129,7 +129,7 @@ Highlighter.prototype = {
     this.transitionDisabler = null;
     this.pageEventsMuter = null;
 
-    this.unlock();
+    this.unlockAndFocus();
 
     this.selection.on("new-node", this.highlight);
     this.selection.on("new-node", this.updateInfobar);
@@ -159,7 +159,7 @@ Highlighter.prototype = {
    */
   destroy: function Highlighter_destroy()
   {
-    this.inspectButton.removeEventListener("command", this.unlock);
+    this.inspectButton.removeEventListener("command", this.unlockAndFocus);
     this.inspectButton = null;
 
     this.toolbox.off("select", this.onToolSelected);
@@ -297,7 +297,6 @@ Highlighter.prototype = {
     this.nodeInfo.container.removeAttribute("locked");
     this.attachMouseListeners();
     this.locked = false;
-    this.chromeWin.focus();
     if (this.selection.isElementNode() &&
         this.selection.isConnected()) {
       this.showOutline();
@@ -305,6 +304,15 @@ Highlighter.prototype = {
     this.emit("unlocked");
   },
 
+  /**
+   * Focus the browser before unlocking.
+   */
+  unlockAndFocus: function Highlighter_unlockAndFocus() {
+    if (this.locked === false) return;
+    this.chromeWin.focus();
+    this.unlock();
+  },
+
   /**
    * Hide the infobar
    */
@@ -395,7 +403,7 @@ Highlighter.prototype = {
     this.inspectButton.className = "highlighter-nodeinfobar-button highlighter-nodeinfobar-inspectbutton"
     let toolbarInspectButton = this.inspector.panelDoc.getElementById("inspector-inspect-toolbutton");
     this.inspectButton.setAttribute("tooltiptext", toolbarInspectButton.getAttribute("tooltiptext"));
-    this.inspectButton.addEventListener("command", this.unlock);
+    this.inspectButton.addEventListener("command", this.unlockAndFocus);
 
     let nodemenu = this.chromeDoc.createElement("toolbarbutton");
     nodemenu.setAttribute("type", "menu");
@@ -743,11 +751,9 @@ Highlighter.prototype = {
   {
     // Stop inspection when the user clicks on a node.
     if (aEvent.button == 0) {
-      let win = aEvent.target.ownerDocument.defaultView;
       this.lock();
       let node = this.selection.node;
       this.selection.setNode(node, "highlighter-lock");
-      win.focus();
       aEvent.preventDefault();
       aEvent.stopPropagation();
     }

browser/devtools/inspector/InspectorPanel.jsm

@@ -80,15 +80,16 @@ InspectorPanel.prototype = {
       this.highlighter = new Highlighter(this.target, this, this._toolbox);
       let button = this.panelDoc.getElementById("inspector-inspect-toolbutton");
       button.hidden = false;
-      this.updateInspectorButton = function() {
+      this.onLockStateChanged = function() {
         if (this.highlighter.locked) {
           button.removeAttribute("checked");
+          this._toolbox.raise();
         } else {
           button.setAttribute("checked", "true");
         }
       }.bind(this);
-      this.highlighter.on("locked", this.updateInspectorButton);
-      this.highlighter.on("unlocked", this.updateInspectorButton);
+      this.highlighter.on("locked", this.onLockStateChanged);
+      this.highlighter.on("unlocked", this.onLockStateChanged);
 
       // Show a warning when the debugger is paused.
       // We show the warning only when the inspector
@@ -361,8 +362,8 @@ InspectorPanel.prototype = {
     this.target.off("navigate", this.onNavigatedAway);
 
     if (this.highlighter) {
-      this.highlighter.off("locked", this.updateInspectorButton);
-      this.highlighter.off("unlocked", this.updateInspectorButton);
+      this.highlighter.off("locked", this.onLockStateChanged);
+      this.highlighter.off("unlocked", this.onLockStateChanged);
       this.highlighter.destroy();
     }
 

browser/devtools/inspector/inspector.xul

@@ -54,7 +54,7 @@
           tooltiptext="&inspector.selectButton.tooltip;"
           class="devtools-toolbarbutton"
           hidden="true"
-          oncommand="inspector.highlighter.unlock()"/>
+          oncommand="inspector.highlighter.unlockAndFocus()"/>
         <arrowscrollbox id="inspector-breadcrumbs"
           flex="1" orient="horizontal"
           clicktoscroll="true"/>

browser/devtools/inspector/test/browser_inspector_highlighter.js

@@ -57,7 +57,7 @@ function setupHighlighterTests()
   ok(h1, "we have the header");
 
   let i = getActiveInspector();
-  i.highlighter.unlock();
+  i.highlighter.unlockAndFocus();
   i.highlighter.outline.setAttribute("disable-transitions", "true");
 
   executeSoon(function() {

browser/devtools/webconsole/test/browser_webconsole_bug_653531_highlighter_console_helper.js

@@ -50,7 +50,7 @@ function setupHighlighterTests()
 
 function runSelectionTests(aInspector)
 {
-  aInspector.highlighter.unlock();
+  aInspector.highlighter.unlockAndFocus();
   aInspector.highlighter.outline.setAttribute("disable-transitions", "true");
 
   executeSoon(function() {