--- a/devtools/client/dom/content/components/dom-tree.js
+++ b/devtools/client/dom/content/components/dom-tree.js
@@ -51,21 +51,39 @@ var DomTree = React.createClass({
   /**
    * Render DOM panel content
    */
   render: function () {
     let columns = [{
       "id": "value"
     }];
 
+    let onDOMNodeMouseOver;
+    let onDOMNodeMouseOut;
+    let toolbox = DomProvider.getToolbox();
+    if (toolbox) {
+      onDOMNodeMouseOver = (grip, options = {}) => {
+        return toolbox.highlighterUtils
+          ? toolbox.highlighterUtils.highlightDomValueGrip(grip, options)
+          : null;
+      };
+      onDOMNodeMouseOut = (forceHide = false) => {
+        return toolbox.highlighterUtils
+          ? toolbox.highlighterUtils.unhighlight(forceHide)
+          : null;
+      };
+    }
+
     // This is the integration point with Reps. The DomTree is using
     // Reps to render all values. The code also specifies default rep
     // used for data types that don't have its own specific template.
     let renderValue = props => {
       return Rep(Object.assign({}, props, {
+        onDOMNodeMouseOver,
+        onDOMNodeMouseOut,
         defaultRep: Grip,
         cropLimit: 50,
       }));
     };
 
     return (
       TreeView({
         object: this.props.object,

--- a/devtools/client/dom/dom-panel.js
+++ b/devtools/client/dom/dom-panel.js
@@ -64,16 +64,17 @@ DomPanel.prototype = {
   initialize: function () {
     this.panelWin.addEventListener("devtools/content/message",
       this.onContentMessage, true);
 
     this.target.on("navigate", this.onTabNavigated);
     this._toolbox.on("select", this.onPanelVisibilityChange);
 
     let provider = {
+      getToolbox: this.getToolbox.bind(this),
       getPrototypeAndProperties: this.getPrototypeAndProperties.bind(this)
     };
 
     exportIntoContentScope(this.panelWin, provider, "DomProvider");
 
     this.shouldRefresh = true;
   },
 
@@ -208,16 +209,20 @@ DomPanel.prototype = {
   onContentMessage: function (event) {
     let data = event.data;
     let method = data.type;
     if (typeof this[method] == "function") {
       this[method](data.args);
     }
   },
 
+  getToolbox: function () {
+    return this._toolbox;
+  },
+
   get target() {
     return this._toolbox.target;
   },
 };
 
 // Helpers
 
 function exportIntoContentScope(win, obj, defineAs) {