Bug 785186 - Use the context menu in the markup panel. r=jwalker

browser/devtools/highlighter/highlighter.jsm

@@ -455,6 +455,10 @@ Highlighter.prototype = {
     let nodeInfobar = this.chromeDoc.createElement("hbox");
     nodeInfobar.id = "highlighter-nodeinfobar";
 
+    nodeInfobar.addEventListener("mousedown", function(aEvent) {
+      this.emitEvent("nodeselected");
+    }.bind(this), true);
+
     let arrowBoxTop = this.chromeDoc.createElement("box");
     arrowBoxTop.className = "highlighter-nodeinfobar-arrow";
     arrowBoxTop.id = "highlighter-nodeinfobar-arrow-top";

browser/devtools/highlighter/inspector.jsm

@@ -258,6 +258,7 @@ Inspector.prototype = {
     this._markupFrame = doc.createElement("iframe");
     this._markupFrame.setAttribute("flex", "1");
     this._markupFrame.setAttribute("tooltip", "aHTMLTooltip");
+    this._markupFrame.setAttribute("context", "inspector-node-popup");
 
     // This is needed to enable tooltips inside the iframe document.
     this._boundMarkupFrameLoad = function Inspector_initMarkupPanel_onload() {
@@ -1203,13 +1204,31 @@ InspectorUI.prototype = {
     }
   },
 
+  /**
+   * Return the currently-selected node for the purposes of the
+   * context menu.  This is usually the highlighter selection, unless
+   * the markup panel has a selected node that can't be highlighted
+   * (such as a text node).  This will be fixed once the highlighter/inspector
+   * is confortable with non-element nodes being the current selection.
+   * See bug 785180.
+   */
+  _contextSelection: function IUI__contextSelection()
+  {
+    let inspector = this.currentInspector;
+    if (inspector.markup) {
+      return inspector.markup.selected;
+    }
+    return this.selection;
+  },
+
   /**
    * Copy the innerHTML of the selected Node to the clipboard. Called via the
    * Inspector:CopyInner command.
    */
   copyInnerHTML: function IUI_copyInnerHTML()
   {
-    clipboardHelper.copyString(this.selection.innerHTML, this.selection.ownerDocument);
+    let selection = this._contextSelection();
+    clipboardHelper.copyString(selection.innerHTML, selection.ownerDocument);
   },
 
   /**
@@ -1218,7 +1237,8 @@ InspectorUI.prototype = {
    */
   copyOuterHTML: function IUI_copyOuterHTML()
   {
-    clipboardHelper.copyString(this.selection.outerHTML, this.selection.ownerDocument);
+    let selection = this._contextSelection();
+    clipboardHelper.copyString(selection.outerHTML, selection.ownerDocument);
   },
 
   /**
@@ -1226,7 +1246,7 @@ InspectorUI.prototype = {
    */
   deleteNode: function IUI_deleteNode()
   {
-    let selection = this.selection;
+    let selection = this._contextSelection();
 
     let root = selection.ownerDocument.documentElement;
     if (selection === root) {
@@ -1236,8 +1256,17 @@ InspectorUI.prototype = {
 
     let parent = selection.parentNode;
 
-    // remove the node from content
+    // If the markup panel is active, use the markup panel to delete
-    parent.removeChild(selection);
+    // the node, making this an undoable action.
+    let markup = this.currentInspector.markup;
+    if (markup) {
+      markup.deleteNode(selection);
+    } else {
+      // remove the node from content
+      parent.removeChild(selection);
+    }
+
+    // Otherwise, just delete the node.
     this.breadcrumbs.invalidateHierarchy();
 
     // select the parent node in the highlighter and breadcrumbs

browser/devtools/markupview/MarkupView.jsm

@@ -4,16 +4,6 @@
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
-/**
- * Followup bugs to be filed:
- * - Drag and drop should be implemented.
- * - Node menu should be implemented.
- * - editableField could be moved to a shared location.
- * - I'm willing to consider that judicious use of DOMTemplater could make this
- *   code easier to maintain.
- * - ScrollIntoViewIfNeeded seems jumpy, that should be fixed.
- */
-
 const Cc = Components.classes;
 const Cu = Components.utils;
 const Ci = Components.interfaces;
@@ -69,8 +59,6 @@ function MarkupView(aInspector, aFrame)
 
   this._boundFocus = this._onFocus.bind(this);
   this._frame.addEventListener("focus", this._boundFocus, false);
-
-  this._onSelect();
 }
 
 MarkupView.prototype = {