#20 Fix compatibility with Fx38

Author: janodvarko

lib/data-tooltip.js

@@ -14,6 +14,9 @@ const { Cu, Ci } = require("chrome");
 const { devtools } = Cu.import("resource://gre/modules/devtools/Loader.jsm", {});
 const { Widgets } = devtools.require("devtools/webconsole/console-output");
 const { VariablesView } = Cu.import("resource:///modules/devtools/VariablesView.jsm", {});
+const { makeInfallible } = devtools["require"]("devtools/toolkit/DevToolsUtils.js");
+const { Tooltip } = devtools["require"]("devtools/shared/widgets/Tooltip");
+const { Promise: promise } = Cu.import("resource://gre/modules/Promise.jsm", {});
 
 // Platform
 const { Services } = Cu.import("resource://gre/modules/Services.jsm", {});
@@ -22,6 +25,15 @@ const { Services } = Cu.import("resource://gre/modules/Services.jsm", {});
 const { Trace, TraceError } = require("firebug.sdk/lib/core/trace.js").get(module.id);
 const { Content } = require("firebug.sdk/lib/core/content.js");
 
+// Constants
+const XHTML_NS = "http://www.w3.org/1999/xhtml";
+
+/**
+ * This object implements a tooltip used in the MarkupView that
+ * displays jQuery data (JSON) as an expandable tree.
+ * Content of the tooltip is rendered using an iframe. Content
+ * of the iframe is implemented by markup-tooltip.html
+ */
 function DataTooltip(options) {
   this.markup = options.markup;
   this.target = options.target;
@@ -32,16 +44,10 @@ function DataTooltip(options) {
   this.onTooltipLoaded = this.onTooltipLoaded.bind(this);
 }
 
-/**
- * This object implements a tooltip used in the MarkupView that
- * displays jQuery data (JSON) as an expandable tree.
- * Content of the tooltip is rendered using an iframe. Content
- * of the iframe is implemented by markup-tooltip.html
- */
 DataTooltip.prototype =
 /** @lends DataTooltip */
 {
-  show: function() {
+  show: makeInfallible(function() {
     this.tooltip.hide(this.target);
 
     let dimensions = {
@@ -59,7 +65,7 @@ DataTooltip.prototype =
     });
 
     this.tooltip.show(this.target);
-  },
+  }),
 
   // Tooltip Event Handlers
 
@@ -121,5 +127,37 @@ DataTooltip.prototype =
   },
 }
 
+// Patch Tooltip
+// The Tooltip widget has been introduced in Fx40
+// https://bugzilla.mozilla.org/show_bug.cgi?id=980006
+if (!Tooltip.prototype.setIFrameContent) {
+  Tooltip.prototype.setIFrameContent = makeInfallible(function({width, height}, url) {
+    let def = promise.defer();
+
+    // Create an iframe
+    let iframe = this.doc.createElementNS(XHTML_NS, "iframe");
+    iframe.setAttribute("transparent", true);
+    iframe.setAttribute("width", width);
+    iframe.setAttribute("height", height);
+    iframe.setAttribute("flex", "1");
+    iframe.setAttribute("class", "devtools-tooltip-iframe");
+
+    // Wait for the load to initialize the widget
+    function onLoad() {
+      iframe.removeEventListener("load", onLoad, true);
+      def.resolve(iframe);
+    }
+    iframe.addEventListener("load", onLoad, true);
+
+    // load the document from url into the iframe
+    iframe.setAttribute("src", url);
+
+    // Put the iframe in the tooltip
+    this.content = iframe;
+
+    return def.promise;
+  });
+}
+
 // Exports from this module
 exports.DataTooltip = DataTooltip;

lib/firequery-actor.js

@@ -16,7 +16,7 @@ const { DebuggerServer } = Cu.import("resource://gre/modules/devtools/dbg-server
 const { devtools } = Cu.import("resource://gre/modules/devtools/Loader.jsm", {});
 const protocol = devtools["require"]("devtools/server/protocol");
 const { method, RetVal, ActorClass, Actor, Arg, types } = protocol;
-const Events = require("sdk/event/core");
+const Events = devtools["require"]("sdk/event/core");
 const { makeInfallible } = devtools["require"]("devtools/toolkit/DevToolsUtils.js");
 const DevToolsUtils = devtools["require"]("devtools/toolkit/DevToolsUtils");
 const { NodeActor } = devtools["require"]("devtools/server/actors/inspector");
@@ -184,7 +184,14 @@ var FireQueryActor = ActorClass(
       length: length,
     };
 
-    if (actor.threadActor._gripDepth > 1) {
+    // Introduced in Fx42
+    let hooks = actor.hooks;
+    if (hooks && hooks.getGripDepth() > 1) {
+      return true;
+    }
+
+    let threadActor = this.parent.threadActor;
+    if (threadActor && threadActor._gripDepth > 1) {
       return true;
     }
 
@@ -205,14 +212,14 @@ var FireQueryActor = ActorClass(
         let value = Cu.unwaiveXrays(desc.value);
         value = makeDebuggeeValueIfNeeded(actor.obj, value);
 
-        let grip = actor.threadActor.createValueGrip(value);
+        let grip = this.createValueGrip(actor, value);
         preview.items.push(grip);
 
         let data = hasJQueryData(desc.value);
         if (data) {
           data = Cu.unwaiveXrays(data);
           data = makeDebuggeeValueIfNeeded(actor.obj, data);
-          grip.preview.jQueryData = actor.threadActor.createValueGrip(data);
+          grip.preview.jQueryData = this.createValueGrip(actor, data);
 
           // xxxHonza: generate preview for the data?
         }
@@ -230,6 +237,15 @@ var FireQueryActor = ActorClass(
     return true;
   }),
 
+  createValueGrip: function(actor, value) {
+    // Introduced in Fx42
+    if (actor.hooks) {
+      return actor.hooks.createValueGrip(value);
+    }
+
+    return actor.threadActor.createValueGrip(value);
+  },
+
   /**
    * Set UI stylesheet for anonymous content (sent from the client).
    */
@@ -248,7 +264,6 @@ var FireQueryActor = ActorClass(
     }, true);
 
     win.addEventListener("firequery-event", event => {
-      let threadActor = this.parent.threadActor;
       let walkerActor = this.conn.getActor(this.walkerActorID);
       if (!walkerActor) {
         return;
@@ -367,7 +382,7 @@ function hasJQueryData(object) {
 
 // Patching NodeActor (add custom info into actor form)
 // Bug 1036949 - New API: MarkupView customization
-// xxxHonza: Can be removed as soon as Firefox 41 is the
+// xxxHonza: Can be removed as soon as Fx42 is the
 // minimum required version.
 let originalForm = NodeActor.prototype.form;
 NodeActor.prototype.form = function(detail) {
@@ -379,7 +394,6 @@ NodeActor.prototype.form = function(detail) {
   }
 
   // form.setFormProperty has been introduced in Bug 1036949
-  // (released in Firefox 41)
   // The content of the following if block is taken from the
   // patch attached to Bug 1036949
   if (!form.setFormProperty) {

lib/inspector-overlay.js

@@ -13,6 +13,10 @@ const { Class } = require("sdk/core/heritage");
 const { loadSheet, removeSheet } = require("sdk/stylesheet/utils");
 const { on, off } = require("sdk/event/core");
 
+// DevTools
+const { devtools } = Cu.import("resource://gre/modules/devtools/Loader.jsm", {});
+const { MarkupView } = devtools["require"]("devtools/markupview/markup-view");
+
 // Firebug SDK
 const { Trace, TraceError } = require("firebug.sdk/lib/core/trace.js").get(module.id);
 const { PanelOverlay } = require("firebug.sdk/lib/panel-overlay.js");
@@ -187,14 +191,17 @@ const InspectorOverlay = Class(
   onMarkupViewContainerCreated: function(eventId, container) {
     Trace.sysout("InspectorOverlay.onMarkupViewContainerCreated; ", arguments);
 
+    let nodeFront = container.node;
+    let hasJQueryData = false;
+
     // nodeFront.getFormProperty has been introduced in Bug 1036949
-    // (released in Firefox 41)
     // xxxHonza: Checking existence of the method can be removed
-    // as soon as Firefox 41 is the minimum required version.
-    let nodeFront = container.node;
-    let hasJQueryData = nodeFront.getFormProperty ?
-      nodeFront.getFormProperty("hasJQueryData") :
-      nodeFront._form.props.hasJQueryData;
+    // as soon as Fx42 is the minimum required version.
+    if (nodeFront.getFormProperty) {
+      hasJQueryData = nodeFront.getFormProperty("hasJQueryData");
+    } else if (nodeFront._form.props) {
+      hasJQueryData = nodeFront._form.props.hasJQueryData;
+    }
 
     if (!hasJQueryData) {
       return;
@@ -204,6 +211,8 @@ const InspectorOverlay = Class(
   },
 
   createDataIcon: function(element) {
+    Trace.sysout("InspectorOverlay.createDataIcon; ", element);
+
     let icon = element.querySelector(".fireQueryData");
     if (icon) {
       return;
@@ -398,7 +407,29 @@ const InspectorOverlay = Class(
   },
 });
 
-// Helpers
-
+// Patching MarkupView (fire a new "container-created" event)
+// Bug 1036949 - New API: MarkupView customization
+// xxxHonza: Can be removed as soon as Fx42 is the
+// minimum required version.
+let originalImportNode = MarkupView.prototype.importNode;
+MarkupView.prototype.importNode = function(aNode, aFlashNode) {
+  if (!aNode) {
+    return null;
+  }
+
+  if (this._containers.has(aNode)) {
+    return this.getContainer(aNode);
+  }
+
+  let container = originalImportNode.apply(this, arguments);
+
+  // Feature detection based on nodeFront.getFormProperty() API
+  let nodeFront = container.node;
+  if (!nodeFront.getFormProperty) {
+    this._inspector.emit("container-created", container);
+  }
+
+  return container;
+}
 // Exports from this module
 exports.InspectorOverlay = InspectorOverlay;