Bug 718973 - It would be nice to have more Tilt notifications; r=rcampbell

browser/devtools/tilt/Tilt.jsm

@@ -45,17 +45,37 @@ const Cu = Components.utils;
 // Tilt notifications dispatched through the nsIObserverService.
 const TILT_NOTIFICATIONS = {
 
-  // Fires when Tilt completes the initialization.
+  // Fires when Tilt starts the initialization.
+  INITIALIZING: "tilt-initializing",
+
+  // Fires immediately after initialization is complete.
+  // (when the canvas overlay is visible and the 3D mesh is completely created)
   INITIALIZED: "tilt-initialized",
 
-  // Fires when Tilt is destroyed.
+  // Fires immediately before the destruction is started.
+  DESTROYING: "tilt-destroying",
+
+  // Fires immediately before the destruction is finished.
+  // (just before the canvas overlay is removed from its parent node)
+  BEFORE_DESTROYED: "tilt-before-destroyed",
+
+  // Fires when Tilt is completely destroyed.
   DESTROYED: "tilt-destroyed",
 
   // Fires when Tilt is shown (after a tab-switch).
   SHOWN: "tilt-shown",
 
   // Fires when Tilt is hidden (after a tab-switch).
-  HIDDEN: "tilt-hidden"
+  HIDDEN: "tilt-hidden",
+
+  // Fires once Tilt highlights an element in the page.
+  HIGHLIGHTING: "tilt-highlighting",
+
+  // Fires once Tilt stops highlighting any element.
+  UNHIGHLIGHTING: "tilt-unhighlighting",
+
+  // Fires when a node is removed from the 3D mesh.
+  NODE_REMOVED: "tilt-node-removed"
 };
 
 Cu.import("resource://gre/modules/Services.jsm");
@@ -109,7 +129,8 @@ Tilt.prototype = {
       parentNode: this.chromeWindow.gBrowser.selectedBrowser.parentNode,
       contentWindow: this.chromeWindow.gBrowser.selectedBrowser.contentWindow,
       requestAnimationFrame: this.chromeWindow.mozRequestAnimationFrame,
-      inspectorUI: this.chromeWindow.InspectorUI
+      inspectorUI: this.chromeWindow.InspectorUI,
+      notifications: this.NOTIFICATIONS
     });
 
     // make sure the visualizer object was initialized properly
@@ -118,7 +139,7 @@ Tilt.prototype = {
       return;
     }
 
-    Services.obs.notifyObservers(null, TILT_NOTIFICATIONS.INITIALIZED, null);
+    Services.obs.notifyObservers(null, TILT_NOTIFICATIONS.INITIALIZING, null);
   },
 
   /**
@@ -157,11 +178,12 @@ Tilt.prototype = {
       let controller = this.visualizers[aId].controller;
       let presenter = this.visualizers[aId].presenter;
 
-      TiltUtils.setDocumentZoom(presenter.transforms.zoom);
-
       let content = presenter.contentWindow;
-      let pageXOffset = content.pageXOffset * TiltUtils.getDocumentZoom();
+      let pageXOffset = content.pageXOffset * presenter.transforms.zoom;
-      let pageYOffset = content.pageYOffset * TiltUtils.getDocumentZoom();
+      let pageYOffset = content.pageYOffset * presenter.transforms.zoom;
+
+      Services.obs.notifyObservers(null, TILT_NOTIFICATIONS.DESTROYING, null);
+      TiltUtils.setDocumentZoom(presenter.transforms.zoom);
 
       controller.removeEventListeners();
       controller.arcball.reset([-pageXOffset, -pageYOffset]);
@@ -171,9 +193,9 @@ Tilt.prototype = {
 
   /**
    * Handles any supplementary post-initialization work, done immediately
-   * after a TILT_NOTIFICATIONS.INITIALIZED notification.
+   * after a TILT_NOTIFICATIONS.INITIALIZING notification.
    */
-  _whenInitialized: function T__whenInitialized()
+  _whenInitializing: function T__whenInitializing()
   {
     this._whenShown();
   },
@@ -250,7 +272,7 @@ Tilt.prototype = {
 
     // add the necessary observers to handle specific notifications
     Services.obs.addObserver(
-      this._whenInitialized.bind(this), TILT_NOTIFICATIONS.INITIALIZED, false);
+      this._whenInitializing.bind(this), TILT_NOTIFICATIONS.INITIALIZING, false);
     Services.obs.addObserver(
       this._whenDestroyed.bind(this), TILT_NOTIFICATIONS.DESTROYED, false);
     Services.obs.addObserver(
@@ -284,7 +306,7 @@ Tilt.prototype = {
     Services.obs.addObserver(onClosed,
       this.chromeWindow.InspectorUI.INSPECTOR_NOTIFICATIONS.CLOSED, false);
     Services.obs.addObserver(onOpened,
-      TILT_NOTIFICATIONS.INITIALIZED, false);
+      TILT_NOTIFICATIONS.INITIALIZING, false);
     Services.obs.addObserver(onClosed,
       TILT_NOTIFICATIONS.DESTROYED, false);
 

browser/devtools/tilt/TiltVisualizer.jsm

@@ -37,7 +37,7 @@
  *
  ***** END LICENSE BLOCK *****/
 
-/*global Components, ChromeWorker */
+/*global Components, Services, ChromeWorker */
 /*global TiltGL, TiltMath, EPSILON, vec3, mat4, quat4, TiltUtils */
 "use strict";
 
@@ -78,6 +78,7 @@ const ARCBALL_RESET_INTERVAL = 1000 / 60;
 const TILT_CRAFTER = "resource:///modules/devtools/TiltWorkerCrafter.js";
 const TILT_PICKER = "resource:///modules/devtools/TiltWorkerPicker.js";
 
+Cu.import("resource://gre/modules/Services.jsm");
 Cu.import("resource:///modules/devtools/TiltGL.jsm");
 Cu.import("resource:///modules/devtools/TiltMath.jsm");
 Cu.import("resource:///modules/devtools/TiltUtils.jsm");
@@ -94,6 +95,7 @@ let EXPORTED_SYMBOLS = ["TiltVisualizer"];
  *        {Window} contentWindow: the content window holding the visualized doc
  *      {Function} requestAnimationFrame: responsible with scheduling loops
  *   {InspectorUI} inspectorUI: necessary instance of the InspectorUI
+ *        {Object} notifications: necessary notifications for Tilt
  *      {Function} onError: optional, function called if initialization failed
  *      {Function} onLoad: optional, function called if initialization worked
  */
@@ -117,6 +119,7 @@ function TiltVisualizer(aProperties)
     aProperties.contentWindow,
     aProperties.requestAnimationFrame,
     aProperties.inspectorUI,
+    aProperties.notifications,
     aProperties.onError || null,
     aProperties.onLoad || null);
 
@@ -177,13 +180,15 @@ TiltVisualizer.prototype = {
  *                   function responsible with scheduling loop frames
  * @param {InspectorUI} aInspectorUI
  *                      necessary instance of the InspectorUI
+ * @param {Object} aNotifications
+ *                 necessary notifications for Tilt
  * @param {Function} onError
  *                   function called if initialization failed
  * @param {Function} onLoad
  *                   function called if initialization worked
  */
 TiltVisualizer.Presenter = function TV_Presenter(
-  aCanvas, aContentWindow, aRequestAnimationFrame, aInspectorUI,
+  aCanvas, aContentWindow, aRequestAnimationFrame, aInspectorUI, aNotifications,
   onError, onLoad)
 {
   this.canvas = aCanvas;
@@ -191,6 +196,11 @@ TiltVisualizer.Presenter = function TV_Presenter(
   this.inspectorUI = aInspectorUI;
   this.tiltUI = aInspectorUI.chromeWin.Tilt;
 
+  /**
+   * Shortcut for accessing notifications strings.
+   */
+  this.NOTIFICATIONS = aNotifications;
+
   /**
    * Create the renderer, containing useful functions for easy drawing.
    */
@@ -234,8 +244,9 @@ TiltVisualizer.Presenter = function TV_Presenter(
   /**
    * Variables holding information about the initial and current node selected.
    */
-  this._initialSelection = false; // true if an initial selection was made
   this._currentSelection = -1; // the selected node index
+  this._initialSelection = false; // true if an initial selection was made
+  this._initialMeshConfiguration = false; // true if the 3D mesh was configured
 
   /**
    * Variable specifying if the scene should be redrawn.
@@ -295,28 +306,12 @@ TiltVisualizer.Presenter = function TV_Presenter(
       this.drawVisualization();
     }
 
-    // call the attached ondraw event handler if specified (by the controller)
+    // call the attached ondraw function and handle all keyframe notifications
     if ("function" === typeof this.ondraw) {
       this.ondraw(this.frames);
     }
 
-    if (!TiltVisualizer.Prefs.introTransition && !this.isExecutingDestruction) {
+    this.handleKeyframeNotifications();
-      this.frames = INTRO_TRANSITION_DURATION;
-    }
-    if (!TiltVisualizer.Prefs.outroTransition && this.isExecutingDestruction) {
-      this.frames = OUTRO_TRANSITION_DURATION;
-    }
-
-    if ("function" === typeof this.onInitializationFinished &&
-        this.frames === INTRO_TRANSITION_DURATION &&
-       !this.isExecutingDestruction) {
-      this.onInitializationFinished();
-    }
-    if ("function" === typeof this.onDestructionFinished &&
-        this.frames === OUTRO_TRANSITION_DURATION &&
-        this.isExecutingDestruction) {
-      this.onDestructionFinished();
-    }
   }.bind(this);
 
   setup();
@@ -629,10 +624,6 @@ TiltVisualizer.Presenter.prototype = {
    */
   highlightNode: function TVP_highlightNode(aNode)
   {
-    if (!aNode) {
-      return;
-    }
-
     this.highlightNodeFor(this.traverseData.nodes.indexOf(aNode));
   },
 
@@ -701,10 +692,13 @@ TiltVisualizer.Presenter.prototype = {
     if (this._currentSelection === aNodeIndex) {
       return;
     }
+
     // if an invalid or nonexisted node is specified, disable the highlight
     if (aNodeIndex < 0) {
       this._currentSelection = -1;
       this.highlight.disabled = true;
+
+      Services.obs.notifyObservers(null, this.NOTIFICATIONS.UNHIGHLIGHTING, null);
       return;
     }
 
@@ -732,6 +726,8 @@ TiltVisualizer.Presenter.prototype = {
     this._currentSelection = aNodeIndex;
     this.inspectorUI.inspectNode(node, this.contentWindow.innerHeight < y ||
                                        this.contentWindow.pageYOffset > 0);
+
+    Services.obs.notifyObservers(null, this.NOTIFICATIONS.HIGHLIGHTING, null);
   },
 
   /**
@@ -758,6 +754,9 @@ TiltVisualizer.Presenter.prototype = {
     this.meshStacks.vertices = new renderer.VertexBuffer(meshData.vertices, 3);
     this.highlight.disabled = true;
     this.redraw = true;
+
+    Services.obs.notifyObservers(null,
+      this.NOTIFICATIONS.NODE_REMOVED, null);
   },
 
   /**
@@ -867,17 +866,40 @@ TiltVisualizer.Presenter.prototype = {
   },
 
   /**
-   * Checks if this object was initialized properly.
+   * Handles notifications at specific frame counts.
-   *
-   * @return {Boolean} true if the object was initialized properly
    */
-  isInitialized: function TVP_isInitialized()
+  handleKeyframeNotifications: function TV_handleKeyframeNotifications()
   {
-    return this.renderer && this.renderer.context;
+    if (!TiltVisualizer.Prefs.introTransition && !this.isExecutingDestruction) {
+      this.frames = INTRO_TRANSITION_DURATION;
+    }
+    if (!TiltVisualizer.Prefs.outroTransition && this.isExecutingDestruction) {
+      this.frames = OUTRO_TRANSITION_DURATION;
+    }
+
+    if (this.frames === INTRO_TRANSITION_DURATION &&
+       !this.isExecutingDestruction) {
+
+      Services.obs.notifyObservers(null, this.NOTIFICATIONS.INITIALIZED, null);
+
+      if ("function" === typeof this.onInitializationFinished) {
+        this.onInitializationFinished();
+      }
+    }
+
+    if (this.frames === OUTRO_TRANSITION_DURATION &&
+        this.isExecutingDestruction) {
+
+      Services.obs.notifyObservers(null, this.NOTIFICATIONS.BEFORE_DESTROYED, null);
+
+      if ("function" === typeof this.onDestructionFinished) {
+        this.onDestructionFinished();
+      }
+    }
   },
 
   /**
-   * Starts executing a destruction animation and executes a callback function
+   * Starts executing the destruction sequence and issues a callback function
    * when finished.
    *
    * @param {Function} aCallback
@@ -889,6 +911,10 @@ TiltVisualizer.Presenter.prototype = {
       this.isExecutingDestruction = true;
       this.onDestructionFinished = aCallback;
 
+      // if we execute the destruction after the initialization finishes,
+      // proceed normally; otherwise, skip everything and immediately issue
+      // the callback
+
       if (this.frames > OUTRO_TRANSITION_DURATION) {
         this.frames = 0;
         this.redraw = true;
@@ -898,6 +924,16 @@ TiltVisualizer.Presenter.prototype = {
     }
   },
 
+  /**
+   * Checks if this object was initialized properly.
+   *
+   * @return {Boolean} true if the object was initialized properly
+   */
+  isInitialized: function TVP_isInitialized()
+  {
+    return this.renderer && this.renderer.context;
+  },
+
   /**
    * Function called when this object is destroyed.
    */
@@ -975,7 +1011,7 @@ TiltVisualizer.Controller = function TV_Controller(aCanvas, aPresenter)
 TiltVisualizer.Controller.prototype = {
 
   /**
-   * Adds all added events listeners required by this controller.
+   * Adds events listeners required by this controller.
    */
   addEventListeners: function TVC_addEventListeners()
   {
@@ -1156,9 +1192,10 @@ TiltVisualizer.Controller.prototype = {
   onKeyUp: function TVC_onKeyUp(e)
   {
     let code = e.keyCode || e.which;
+    let tilt = this.presenter.tiltUI;
 
     if (code === e.DOM_VK_ESCAPE) {
-      this.presenter.tiltUI.destroy(this.presenter.tiltUI.currentWindowId, 1);
+      tilt.destroy(tilt.currentWindowId, true);
       return;
     }
     if (code === e.DOM_VK_X) {
@@ -1758,8 +1795,8 @@ TiltVisualizer.Arcball.prototype = {
   /**
    * Loads the keys to control this arcball.
    */
-  _loadKeys: function TVA__loadKeys() {
+  _loadKeys: function TVA__loadKeys()
-
+  {
     this.rotateKeys = {
       "up": Ci.nsIDOMKeyEvent["DOM_VK_W"],
       "down": Ci.nsIDOMKeyEvent["DOM_VK_S"],

browser/devtools/tilt/test/Makefile.in

@@ -47,6 +47,7 @@ include $(topsrcdir)/config/rules.mk
 _BROWSER_TEST_FILES = \
 	head.js \
 	browser_tilt_01_lazy_getter.js \
+	browser_tilt_02_notifications-seq.js \
 	browser_tilt_02_notifications.js \
 	browser_tilt_03_tab_switch.js \
 	browser_tilt_04_initialization-key.js \

browser/devtools/tilt/test/browser_tilt_02_notifications-seq.js

@@ -0,0 +1,82 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+/*global ok, is, info, waitForExplicitFinish, finish, executeSoon, gBrowser */
+/*global isTiltEnabled, isWebGLSupported, createTab, createTilt */
+/*global Services, Tilt, EventUtils, InspectorUI */
+/*global INITIALIZING, INITIALIZED, DESTROYING, BEFORE_DESTROYED, DESTROYED */
+"use strict";
+
+let tabEvents = "";
+
+function test() {
+  if (!isTiltEnabled()) {
+    info("Skipping notifications test because Tilt isn't enabled.");
+    return;
+  }
+  if (!isWebGLSupported()) {
+    info("Skipping notifications test because WebGL isn't supported.");
+    return;
+  }
+
+  requestLongerTimeout(10);
+  waitForExplicitFinish();
+
+  createTab(function() {
+    Services.obs.addObserver(cleanup, DESTROYED, false);
+
+    Services.obs.addObserver(obs_INITIALIZING, INITIALIZING, false);
+    Services.obs.addObserver(obs_INITIALIZED, INITIALIZED, false);
+    Services.obs.addObserver(obs_DESTROYING, DESTROYING, false);
+    Services.obs.addObserver(obs_BEFORE_DESTROYED, BEFORE_DESTROYED, false);
+    Services.obs.addObserver(obs_DESTROYED, DESTROYED, false);
+
+    info("Starting up the Tilt notifications test.");
+    createTilt({});
+  });
+}
+
+function obs_INITIALIZING() {
+  info("Handling the INITIALIZING notification.");
+  tabEvents += "INITIALIZING;";
+}
+
+function obs_INITIALIZED() {
+  info("Handling the INITIALIZED notification.");
+  tabEvents += "INITIALIZED;";
+
+  Tilt.destroy(Tilt.currentWindowId, true);
+}
+
+function obs_DESTROYING() {
+  info("Handling the DESTROYING( notification.");
+  tabEvents += "DESTROYING;";
+}
+
+function obs_BEFORE_DESTROYED() {
+  info("Handling the BEFORE_DESTROYED notification.");
+  tabEvents += "BEFORE_DESTROYED;";
+}
+
+function obs_DESTROYED() {
+  info("Handling the DESTROYED notification.");
+  tabEvents += "DESTROYED;";
+}
+
+function cleanup() {
+  info("Cleaning up the notifications test.");
+
+  is(tabEvents, "INITIALIZING;INITIALIZED;DESTROYING;BEFORE_DESTROYED;DESTROYED;",
+    "The notifications weren't fired in the correct order.");
+
+  Services.obs.removeObserver(cleanup, DESTROYED);
+
+  Services.obs.removeObserver(obs_INITIALIZING, INITIALIZING, false);
+  Services.obs.removeObserver(obs_INITIALIZED, INITIALIZED, false);
+  Services.obs.removeObserver(obs_DESTROYING, DESTROYING, false);
+  Services.obs.removeObserver(obs_BEFORE_DESTROYED, BEFORE_DESTROYED, false);
+  Services.obs.removeObserver(obs_DESTROYED, DESTROYED, false);
+
+  gBrowser.removeCurrentTab();
+  finish();
+}

browser/devtools/tilt/test/browser_tilt_02_notifications.js

@@ -2,8 +2,8 @@
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /*global ok, is, info, waitForExplicitFinish, finish, executeSoon, gBrowser */
-/*global isTiltEnabled, isWebGLSupported, createTab, createTilt, Tilt */
+/*global isTiltEnabled, isWebGLSupported, createTab, createTilt */
-/*global Services, TILT_INITIALIZED, TILT_DESTROYED, TILT_SHOWN, TILT_HIDDEN */
+/*global Services, Tilt, SHOWN, HIDDEN, INITIALIZING, DESTROYING, DESTROYED */
 "use strict";
 
 let tab0, tab1;
@@ -20,6 +20,7 @@ function test() {
     return;
   }
 
+  requestLongerTimeout(10);
   waitForExplicitFinish();
 
   gBrowser.tabContainer.addEventListener("TabSelect", tabSelect, false);
@@ -30,12 +31,14 @@ function createNewTab() {
   tab0 = gBrowser.selectedTab;
 
   tab1 = createTab(function() {
-    Services.obs.addObserver(cleanup, TILT_DESTROYED, false);
+    Services.obs.addObserver(cleanup, DESTROYED, false);
-    Services.obs.addObserver(tab_TILT_INITIALIZED, TILT_INITIALIZED, false);
-    Services.obs.addObserver(tab_TILT_DESTROYED, TILT_DESTROYED, false);
-    Services.obs.addObserver(tab_TILT_SHOWN, TILT_SHOWN, false);
-    Services.obs.addObserver(tab_TILT_HIDDEN, TILT_HIDDEN, false);
 
+    Services.obs.addObserver(tab_INITIALIZING, INITIALIZING, false);
+    Services.obs.addObserver(tab_DESTROYING, DESTROYING, false);
+    Services.obs.addObserver(tab_SHOWN, SHOWN, false);
+    Services.obs.addObserver(tab_HIDDEN, HIDDEN, false);
+
+    info("Starting up the Tilt notifications test.");
     createTilt({
       onTiltOpen: function()
       {
@@ -46,46 +49,56 @@ function createNewTab() {
   });
 }
 
-function tab_TILT_INITIALIZED() {
+function tab_INITIALIZING() {
-  tabEvents += "ti;";
+  info("Handling the INITIALIZING notification.");
+  tabEvents += "INITIALIZING;";
 }
 
-function tab_TILT_DESTROYED() {
+function tab_DESTROYING() {
-  tabEvents += "td;";
+  info("Handling the DESTROYING notification.");
+  tabEvents += "DESTROYING;";
 }
 
-function tab_TILT_SHOWN() {
+function tab_SHOWN() {
-  tabEvents += "ts;";
+  info("Handling the SHOWN notification.");
+  tabEvents += "SHOWN;";
 }
 
-function tab_TILT_HIDDEN() {
+function tab_HIDDEN() {
-  tabEvents += "th;";
+  info("Handling the HIDDEN notification.");
+  tabEvents += "HIDDEN;";
 }
 
 let testSteps = [
   function step0() {
+    info("Selecting tab0.");
     gBrowser.selectedTab = tab0;
   },
   function step1() {
+    info("Selecting tab1.");
     gBrowser.selectedTab = tab1;
   },
   function step2() {
-    Tilt.destroy(Tilt.currentWindowId);
+    info("Killing it.");
+    Tilt.destroy(Tilt.currentWindowId, true);
   }
 ];
 
 function cleanup() {
-  is(tabEvents, "ti;th;ts;td;",
+  info("Cleaning up the notifications test.");
+
+  is(tabEvents, "INITIALIZING;HIDDEN;SHOWN;DESTROYING;",
     "The notifications weren't fired in the correct order.");
 
   tab0 = null;
   tab1 = null;
 
-  Services.obs.removeObserver(cleanup, TILT_DESTROYED);
+  Services.obs.removeObserver(cleanup, DESTROYED);
-  Services.obs.removeObserver(tab_TILT_INITIALIZED, TILT_INITIALIZED, false);
+
-  Services.obs.removeObserver(tab_TILT_DESTROYED, TILT_DESTROYED, false);
+  Services.obs.removeObserver(tab_INITIALIZING, INITIALIZING, false);
-  Services.obs.removeObserver(tab_TILT_SHOWN, TILT_SHOWN, false);
+  Services.obs.removeObserver(tab_DESTROYING, DESTROYING, false);
-  Services.obs.removeObserver(tab_TILT_HIDDEN, TILT_HIDDEN, false);
+  Services.obs.removeObserver(tab_SHOWN, SHOWN, false);
+  Services.obs.removeObserver(tab_HIDDEN, HIDDEN, false);
 
   gBrowser.tabContainer.removeEventListener("TabSelect", tabSelect, false);
   gBrowser.removeCurrentTab();

browser/devtools/tilt/test/browser_tilt_04_initialization-key.js

@@ -4,7 +4,7 @@
 /*global ok, is, info, waitForExplicitFinish, finish, executeSoon, gBrowser */
 /*global isTiltEnabled, isWebGLSupported, createTab, createTilt */
 /*global Services, EventUtils, Tilt, TiltUtils, TiltVisualizer, InspectorUI */
-/*global Ci, TILT_INITIALIZED, TILT_DESTROYED, INSPECTOR_OPENED */
+/*global Ci, INITIALIZING, DESTROYED, INSPECTOR_OPENED */
 "use strict";
 
 let id;
@@ -45,13 +45,13 @@ function onInspectorOpen() {
 
     info("Pressing the accesskey should open Tilt.");
 
-    Services.obs.addObserver(onTiltOpen, TILT_INITIALIZED, false);
+    Services.obs.addObserver(onTiltOpen, INITIALIZING, false);
     EventUtils.synthesizeKey(tiltKey, eventType);
   });
 }
 
 function onTiltOpen() {
-  Services.obs.removeObserver(onTiltOpen, TILT_INITIALIZED);
+  Services.obs.removeObserver(onTiltOpen, INITIALIZING);
 
   executeSoon(function() {
     ok(Tilt.visualizers[id] instanceof TiltVisualizer,
@@ -61,7 +61,7 @@ function onTiltOpen() {
 
     info("Pressing the accesskey again should close Tilt.");
 
-    Services.obs.addObserver(onTiltClose, TILT_DESTROYED, false);
+    Services.obs.addObserver(onTiltClose, DESTROYED, false);
     EventUtils.synthesizeKey(tiltKey, eventType);
   });
 }

browser/devtools/tilt/test/browser_tilt_05_destruction-esc.js

@@ -3,7 +3,7 @@
 
 /*global ok, is, info, waitForExplicitFinish, finish, gBrowser */
 /*global isTiltEnabled, isWebGLSupported, createTab, createTilt */
-/*global Services, EventUtils, Tilt, TiltUtils, InspectorUI, TILT_DESTROYED */
+/*global Services, EventUtils, Tilt, TiltUtils, InspectorUI, DESTROYED */
 "use strict";
 
 function test() {
@@ -22,7 +22,7 @@ function test() {
     createTilt({
       onTiltOpen: function()
       {
-        Services.obs.addObserver(cleanup, TILT_DESTROYED, false);
+        Services.obs.addObserver(cleanup, DESTROYED, false);
         EventUtils.sendKey("ESCAPE");
       }
     });
@@ -35,7 +35,7 @@ function cleanup() {
   is(Tilt.visualizers[id], null,
     "The current instance of the visualizer wasn't destroyed properly.");
 
-  Services.obs.removeObserver(cleanup, TILT_DESTROYED);
+  Services.obs.removeObserver(cleanup, DESTROYED);
   gBrowser.removeCurrentTab();
   finish();
 }

browser/devtools/tilt/test/browser_tilt_05_destruction-url.js

@@ -3,7 +3,7 @@
 
 /*global ok, is, info, waitForExplicitFinish, finish, gBrowser */
 /*global isTiltEnabled, isWebGLSupported, createTab, createTilt */
-/*global Services, EventUtils, Tilt, TiltUtils, InspectorUI, TILT_DESTROYED */
+/*global Services, EventUtils, Tilt, TiltUtils, InspectorUI, DESTROYED */
 "use strict";
 
 function test() {
@@ -22,7 +22,7 @@ function test() {
     createTilt({
       onTiltOpen: function()
       {
-        Services.obs.addObserver(cleanup, TILT_DESTROYED, false);
+        Services.obs.addObserver(cleanup, DESTROYED, false);
         window.content.location = "about:mozilla";
       }
     });
@@ -35,7 +35,7 @@ function cleanup() {
   is(Tilt.visualizers[id], null,
     "The current instance of the visualizer wasn't destroyed properly.");
 
-  Services.obs.removeObserver(cleanup, TILT_DESTROYED);
+  Services.obs.removeObserver(cleanup, DESTROYED);
   gBrowser.removeCurrentTab();
   finish();
 }

browser/devtools/tilt/test/browser_tilt_05_destruction.js

@@ -3,7 +3,7 @@
 
 /*global ok, is, info, waitForExplicitFinish, finish, gBrowser */
 /*global isTiltEnabled, isWebGLSupported, createTab, createTilt */
-/*global Services, Tilt, TiltUtils, InspectorUI, TILT_DESTROYED */
+/*global Services, Tilt, TiltUtils, InspectorUI, DESTROYED */
 "use strict";
 
 function test() {
@@ -22,7 +22,7 @@ function test() {
     createTilt({
       onTiltOpen: function()
       {
-        Services.obs.addObserver(cleanup, TILT_DESTROYED, false);
+        Services.obs.addObserver(cleanup, DESTROYED, false);
         InspectorUI.closeInspectorUI();
       }
     });
@@ -35,7 +35,7 @@ function cleanup() {
   is(Tilt.visualizers[id], null,
     "The current instance of the visualizer wasn't destroyed properly.");
 
-  Services.obs.removeObserver(cleanup, TILT_DESTROYED);
+  Services.obs.removeObserver(cleanup, DESTROYED);
   gBrowser.removeCurrentTab();
   finish();
 }

browser/devtools/tilt/test/browser_tilt_arcball-reset-typeahead.js

@@ -3,7 +3,7 @@
 
 /*global ok, is, info, isApproxVec, waitForExplicitFinish, executeSoon, finish */
 /*global isTiltEnabled, isWebGLSupported, createTab, createTilt */
-/*global Services, EventUtils, InspectorUI, TiltVisualizer, TILT_DESTROYED */
+/*global Services, EventUtils, InspectorUI, TiltVisualizer, DESTROYED */
 "use strict";
 
 function test() {
@@ -30,7 +30,7 @@ function test() {
           info("Killing arcball reset test.");
 
           Services.prefs.setBoolPref("accessibility.typeaheadfind", false);
-          Services.obs.addObserver(cleanup, TILT_DESTROYED, false);
+          Services.obs.addObserver(cleanup, DESTROYED, false);
           InspectorUI.closeInspectorUI();
         });
       }
@@ -47,23 +47,23 @@ function performTest(canvas, arcball, callback) {
 
   // start translating and rotating sometime at random
 
-  executeSoon(function() {
+  window.setTimeout(function() {
     info("Synthesizing key down events.");
 
-    EventUtils.synthesizeKey("VK_W", { type: "keydown" });
+    EventUtils.synthesizeKey("VK_S", { type: "keydown" });     // add a little
-    EventUtils.synthesizeKey("VK_LEFT", { type: "keydown" });
+    EventUtils.synthesizeKey("VK_RIGHT", { type: "keydown" }); // diversity
 
     // wait for some arcball translations and rotations to happen
 
-    executeSoon(function() {
+    window.setTimeout(function() {
       info("Synthesizing key up events.");
 
-      EventUtils.synthesizeKey("VK_W", { type: "keyup" });
+      EventUtils.synthesizeKey("VK_S", { type: "keyup" });
-      EventUtils.synthesizeKey("VK_LEFT", { type: "keyup" });
+      EventUtils.synthesizeKey("VK_RIGHT", { type: "keyup" });
 
       // ok, transformations finished, we can now try to reset the model view
 
-      executeSoon(function() {
+      window.setTimeout(function() {
         info("Synthesizing arcball reset key press.");
 
         arcball.onResetStart = function() {
@@ -98,15 +98,16 @@ function performTest(canvas, arcball, callback) {
         };
 
         EventUtils.synthesizeKey("VK_R", { type: "keydown" });
-      });
+
-    });
+      }, Math.random() * 1000); // leave enough time for transforms to happen
-  });
+    }, Math.random() * 1000);
+  }, Math.random() * 1000);
 }
 
 function cleanup() { /*global gBrowser */
   info("Cleaning up arcball reset test.");
 
-  Services.obs.removeObserver(cleanup, TILT_DESTROYED);
+  Services.obs.removeObserver(cleanup, DESTROYED);
   gBrowser.removeCurrentTab();
   finish();
 }

browser/devtools/tilt/test/browser_tilt_arcball-reset.js

@@ -3,7 +3,7 @@
 
 /*global ok, is, info, isApproxVec, waitForExplicitFinish, executeSoon, finish */
 /*global isTiltEnabled, isWebGLSupported, createTab, createTilt */
-/*global Services, EventUtils, InspectorUI, TiltVisualizer, TILT_DESTROYED */
+/*global Services, EventUtils, InspectorUI, TiltVisualizer, DESTROYED */
 "use strict";
 
 function test() {
@@ -28,7 +28,7 @@ function test() {
 
           info("Killing arcball reset test.");
 
-          Services.obs.addObserver(cleanup, TILT_DESTROYED, false);
+          Services.obs.addObserver(cleanup, DESTROYED, false);
           InspectorUI.closeInspectorUI();
         });
       }
@@ -45,7 +45,7 @@ function performTest(canvas, arcball, callback) {
 
   // start translating and rotating sometime at random
 
-  executeSoon(function() {
+  window.setTimeout(function() {
     info("Synthesizing key down events.");
 
     EventUtils.synthesizeKey("VK_W", { type: "keydown" });
@@ -53,7 +53,7 @@ function performTest(canvas, arcball, callback) {
 
     // wait for some arcball translations and rotations to happen
 
-    executeSoon(function() {
+    window.setTimeout(function() {
       info("Synthesizing key up events.");
 
       EventUtils.synthesizeKey("VK_W", { type: "keyup" });
@@ -61,7 +61,7 @@ function performTest(canvas, arcball, callback) {
 
       // ok, transformations finished, we can now try to reset the model view
 
-      executeSoon(function() {
+      window.setTimeout(function() {
         info("Synthesizing arcball reset key press.");
 
         arcball.onResetStart = function() {
@@ -96,15 +96,16 @@ function performTest(canvas, arcball, callback) {
         };
 
         EventUtils.synthesizeKey("VK_R", { type: "keydown" });
-      });
+
-    });
+      }, Math.random() * 1000); // leave enough time for transforms to happen
-  });
+    }, Math.random() * 1000);
+  }, Math.random() * 1000);
 }
 
 function cleanup() { /*global gBrowser */
   info("Cleaning up arcball reset test.");
 
-  Services.obs.removeObserver(cleanup, TILT_DESTROYED);
+  Services.obs.removeObserver(cleanup, DESTROYED);
   gBrowser.removeCurrentTab();
   finish();
 }

browser/devtools/tilt/test/browser_tilt_picking.js

@@ -3,7 +3,7 @@
 
 /*global ok, is, info, waitForExplicitFinish, finish, gBrowser */
 /*global isTiltEnabled, isWebGLSupported, createTab, createTilt */
-/*global Services, InspectorUI, TILT_DESTROYED */
+/*global Services, InspectorUI, DESTROYED */
 "use strict";
 
 function test() {
@@ -35,7 +35,7 @@ function test() {
               ok(!presenter.highlight.disabled,
                 "After only picking a node, it shouldn't be highlighted.");
 
-              Services.obs.addObserver(cleanup, TILT_DESTROYED, false);
+              Services.obs.addObserver(cleanup, DESTROYED, false);
               InspectorUI.closeInspectorUI();
             }
           });
@@ -46,7 +46,7 @@ function test() {
 }
 
 function cleanup() {
-  Services.obs.removeObserver(cleanup, TILT_DESTROYED);
+  Services.obs.removeObserver(cleanup, DESTROYED);
   gBrowser.removeCurrentTab();
   finish();
 }

browser/devtools/tilt/test/browser_tilt_picking_delete.js

@@ -1,11 +1,13 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
-/*global ok, is, info, waitForExplicitFinish, finish, gBrowser */
+/*global ok, is, info, waitForExplicitFinish, finish, executeSoon, gBrowser */
 /*global isTiltEnabled, isWebGLSupported, createTab, createTilt */
-/*global Services, InspectorUI, TILT_DESTROYED */
+/*global Services, InspectorUI, NODE_REMOVED, DESTROYED */
 "use strict";
 
+let presenter;
+
 function test() {
   if (!isTiltEnabled()) {
     info("Skipping picking delete test because Tilt isn't enabled.");
@@ -22,12 +24,12 @@ function test() {
     createTilt({
       onTiltOpen: function(instance)
       {
-        let presenter = instance.presenter;
+        presenter = instance.presenter;
-        let canvas = presenter.canvas;
+        Services.obs.addObserver(whenNodeRemoved, NODE_REMOVED, false);
 
         presenter.onSetupMesh = function() {
-
+          presenter.highlightNodeAt(presenter.canvas.width / 2,
-          presenter.highlightNodeAt(canvas.width / 2, canvas.height / 2, {
+                                    presenter.canvas.height / 2, {
             onpick: function()
             {
               ok(presenter._currentSelection > 0,
@@ -36,22 +38,6 @@ function test() {
                 "After highlighting a node, it should be highlighted. D'oh.");
 
               presenter.deleteNode();
-
-              ok(presenter._currentSelection > 0,
-                "Deleting a node shouldn't change the current selection.");
-              ok(presenter.highlight.disabled,
-                "After deleting a node, it shouldn't be highlighted.");
-
-              let nodeIndex = presenter._currentSelection;
-              let meshData = presenter.meshData;
-
-              for (let i = 0, k = 36 * nodeIndex; i < 36; i++) {
-                is(meshData.vertices[i + k], 0,
-                  "The stack vertices weren't degenerated properly.");
-              }
-
-              Services.obs.addObserver(cleanup, TILT_DESTROYED, false);
-              InspectorUI.closeInspectorUI();
             }
           });
         };
@@ -60,8 +46,28 @@ function test() {
   });
 }
 
+function whenNodeRemoved() {
+  ok(presenter._currentSelection > 0,
+    "Deleting a node shouldn't change the current selection.");
+  ok(presenter.highlight.disabled,
+    "After deleting a node, it shouldn't be highlighted.");
+
+  let nodeIndex = presenter._currentSelection;
+  let meshData = presenter.meshData;
+
+  for (let i = 0, k = 36 * nodeIndex; i < 36; i++) {
+    is(meshData.vertices[i + k], 0,
+      "The stack vertices weren't degenerated properly.");
+  }
+
+  executeSoon(function() {
+    Services.obs.addObserver(cleanup, DESTROYED, false);
+    InspectorUI.closeInspectorUI();
+  });
+}
+
 function cleanup() {
-  Services.obs.removeObserver(cleanup, TILT_DESTROYED);
+  Services.obs.removeObserver(cleanup, DESTROYED);
   gBrowser.removeCurrentTab();
   finish();
 }

browser/devtools/tilt/test/browser_tilt_picking_highlight01.js

@@ -1,11 +1,13 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
-/*global ok, is, info, waitForExplicitFinish, finish, gBrowser */
+/*global ok, is, info, waitForExplicitFinish, finish, executeSoon, gBrowser */
 /*global isTiltEnabled, isWebGLSupported, createTab, createTilt */
-/*global Services, InspectorUI, TILT_DESTROYED */
+/*global Services, InspectorUI, HIGHLIGHTING, UNHIGHLIGHTING, DESTROYED */
 "use strict";
 
+let presenter;
+
 function test() {
   if (!isTiltEnabled()) {
     info("Skipping highlight test because Tilt isn't enabled.");
@@ -22,29 +24,48 @@ function test() {
     createTilt({
       onTiltOpen: function(instance)
       {
-        let presenter = instance.presenter;
+        presenter = instance.presenter;
+        Services.obs.addObserver(whenHighlighting, HIGHLIGHTING, false);
 
         presenter.onSetupMesh = function() {
           let contentDocument = presenter.contentWindow.document;
-          let body = contentDocument.getElementsByTagName("body")[0];
+          let div = contentDocument.getElementById("first-law");
 
-          presenter.highlightNode(body);
+          presenter.highlightNode(div);
-
-          ok(presenter._currentSelection > 0,
-            "Highlighting a node didn't work properly.");
-          ok(!presenter.highlight.disabled,
-            "After highlighting a node, it should be highlighted. D'oh.");
-
-          Services.obs.addObserver(cleanup, TILT_DESTROYED, false);
-          InspectorUI.closeInspectorUI();
         };
       }
     });
   });
 }
 
+function whenHighlighting() {
+  ok(presenter._currentSelection > 0,
+    "Highlighting a node didn't work properly.");
+  ok(!presenter.highlight.disabled,
+    "After highlighting a node, it should be highlighted. D'oh.");
+
+  executeSoon(function() {
+    Services.obs.addObserver(whenUnhighlighting, UNHIGHLIGHTING, false);
+    presenter.highlightNode(null);
+  });
+}
+
+function whenUnhighlighting() {
+  ok(presenter._currentSelection < 0,
+    "Unhighlighting a should remove the current selection.");
+  ok(presenter.highlight.disabled,
+    "After unhighlighting a node, it shouldn't be highlighted anymore. D'oh.");
+
+  executeSoon(function() {
+    Services.obs.addObserver(cleanup, DESTROYED, false);
+    InspectorUI.closeInspectorUI();
+  });
+}
+
 function cleanup() {
-  Services.obs.removeObserver(cleanup, TILT_DESTROYED);
+  Services.obs.removeObserver(whenHighlighting, HIGHLIGHTING);
+  Services.obs.removeObserver(whenUnhighlighting, UNHIGHLIGHTING);
+  Services.obs.removeObserver(cleanup, DESTROYED);
   gBrowser.removeCurrentTab();
   finish();
 }

browser/devtools/tilt/test/browser_tilt_picking_highlight02.js

@@ -1,11 +1,13 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
-/*global ok, is, info, waitForExplicitFinish, finish, gBrowser */
+/*global ok, is, info, waitForExplicitFinish, finish, executeSoon, gBrowser */
 /*global isTiltEnabled, isWebGLSupported, createTab, createTilt */
-/*global Services, InspectorUI, TILT_DESTROYED */
+/*global Services, InspectorUI, HIGHLIGHTING, UNHIGHLIGHTING, DESTROYED */
 "use strict";
 
+let presenter;
+
 function test() {
   if (!isTiltEnabled()) {
     info("Skipping highlight test because Tilt isn't enabled.");
@@ -22,31 +24,46 @@ function test() {
     createTilt({
       onTiltOpen: function(instance)
       {
-        let presenter = instance.presenter;
+        presenter = instance.presenter;
-        let canvas = presenter.canvas;
+        Services.obs.addObserver(whenHighlighting, HIGHLIGHTING, false);
 
         presenter.onSetupMesh = function() {
-
+          presenter.highlightNodeAt(presenter.canvas.width / 2,
-          presenter.highlightNodeAt(canvas.width / 2, canvas.height / 2, {
+                                    presenter.canvas.height / 2);
-            onpick: function()
-            {
-              ok(presenter._currentSelection > 0,
-                "Highlighting a node didn't work properly.");
-              ok(!presenter.highlight.disabled,
-                "After highlighting a node, it should be highlighted. D'oh.");
-
-              Services.obs.addObserver(cleanup, TILT_DESTROYED, false);
-              InspectorUI.closeInspectorUI();
-            }
-          });
         };
       }
     });
   });
 }
 
+function whenHighlighting() {
+  ok(presenter._currentSelection > 0,
+    "Highlighting a node didn't work properly.");
+  ok(!presenter.highlight.disabled,
+    "After highlighting a node, it should be highlighted. D'oh.");
+
+  executeSoon(function() {
+    Services.obs.addObserver(whenUnhighlighting, UNHIGHLIGHTING, false);
+    presenter.highlightNodeAt(-1, -1);
+  });
+}
+
+function whenUnhighlighting() {
+  ok(presenter._currentSelection < 0,
+    "Unhighlighting a should remove the current selection.");
+  ok(presenter.highlight.disabled,
+    "After unhighlighting a node, it shouldn't be highlighted anymore. D'oh.");
+
+  executeSoon(function() {
+    Services.obs.addObserver(cleanup, DESTROYED, false);
+    InspectorUI.closeInspectorUI();
+  });
+}
+
 function cleanup() {
-  Services.obs.removeObserver(cleanup, TILT_DESTROYED);
+  Services.obs.removeObserver(whenHighlighting, HIGHLIGHTING);
+  Services.obs.removeObserver(whenUnhighlighting, UNHIGHLIGHTING);
+  Services.obs.removeObserver(cleanup, DESTROYED);
   gBrowser.removeCurrentTab();
   finish();
 }

browser/devtools/tilt/test/browser_tilt_picking_highlight03.js

@@ -1,11 +1,13 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
-/*global ok, is, info, waitForExplicitFinish, finish, gBrowser */
+/*global ok, is, info, waitForExplicitFinish, finish, executeSoon, gBrowser */
 /*global isTiltEnabled, isWebGLSupported, createTab, createTilt */
-/*global Services, InspectorUI, TILT_DESTROYED */
+/*global Services, InspectorUI, HIGHLIGHTING, UNHIGHLIGHTING, DESTROYED */
 "use strict";
 
+let presenter;
+
 function test() {
   if (!isTiltEnabled()) {
     info("Skipping highlight test because Tilt isn't enabled.");
@@ -22,26 +24,45 @@ function test() {
     createTilt({
       onTiltOpen: function(instance)
       {
-        let presenter = instance.presenter;
+        presenter = instance.presenter;
+        Services.obs.addObserver(whenHighlighting, HIGHLIGHTING, false);
 
         presenter.onSetupMesh = function() {
-          presenter.highlightNodeFor(1);
+          presenter.highlightNodeFor(5); // 1 = html, 2 = body, 3 = first div
-
-          ok(presenter._currentSelection > 0,
-            "Highlighting a node didn't work properly.");
-          ok(!presenter.highlight.disabled,
-            "After highlighting a node, it should be highlighted. D'oh.");
-
-          Services.obs.addObserver(cleanup, TILT_DESTROYED, false);
-          InspectorUI.closeInspectorUI();
         };
       }
     });
   });
 }
 
+function whenHighlighting() {
+  ok(presenter._currentSelection > 0,
+    "Highlighting a node didn't work properly.");
+  ok(!presenter.highlight.disabled,
+    "After highlighting a node, it should be highlighted. D'oh.");
+
+  executeSoon(function() {
+    Services.obs.addObserver(whenUnhighlighting, UNHIGHLIGHTING, false);
+    presenter.highlightNodeFor(-1);
+  });
+}
+
+function whenUnhighlighting() {
+  ok(presenter._currentSelection < 0,
+    "Unhighlighting a should remove the current selection.");
+  ok(presenter.highlight.disabled,
+    "After unhighlighting a node, it shouldn't be highlighted anymore. D'oh.");
+
+  executeSoon(function() {
+    Services.obs.addObserver(cleanup, DESTROYED, false);
+    InspectorUI.closeInspectorUI();
+  });
+}
+
 function cleanup() {
-  Services.obs.removeObserver(cleanup, TILT_DESTROYED);
+  Services.obs.removeObserver(whenHighlighting, HIGHLIGHTING);
+  Services.obs.removeObserver(whenUnhighlighting, UNHIGHLIGHTING);
+  Services.obs.removeObserver(cleanup, DESTROYED);
   gBrowser.removeCurrentTab();
   finish();
 }

browser/devtools/tilt/test/browser_tilt_zoom.js

@@ -3,7 +3,7 @@
 
 /*global ok, is, info, waitForExplicitFinish, finish, executeSoon, gBrowser */
 /*global isApprox, isTiltEnabled, isWebGLSupported, createTab, createTilt */
-/*global Services, EventUtils, TiltUtils, InspectorUI, TILT_DESTROYED */
+/*global Services, EventUtils, TiltUtils, InspectorUI, DESTROYED */
 "use strict";
 
 const ZOOM = 2;
@@ -84,7 +84,7 @@ function test() {
 
           window.resizeBy(RESIZE * ZOOM, RESIZE * ZOOM);
 
-          Services.obs.addObserver(cleanup, TILT_DESTROYED, false);
+          Services.obs.addObserver(cleanup, DESTROYED, false);
           InspectorUI.closeInspectorUI();
         });
       },
@@ -93,7 +93,7 @@ function test() {
 }
 
 function cleanup() {
-  Services.obs.removeObserver(cleanup, TILT_DESTROYED);
+  Services.obs.removeObserver(cleanup, DESTROYED);
   gBrowser.removeCurrentTab();
   finish();
 }

browser/devtools/tilt/test/head.js

@@ -28,7 +28,7 @@ const DEFAULT_HTML = "data:text/html," +
       "<title>Three Laws</title>" +
     "</head>" +
     "<body>" +
-      "<div>" +
+      "<div id='first-law'>" +
         "A robot may not injure a human being or, through inaction, allow a" +
         "human being to come to harm." +
       "</div>" +
@@ -46,10 +46,16 @@ const DEFAULT_HTML = "data:text/html," +
 const INSPECTOR_OPENED = InspectorUI.INSPECTOR_NOTIFICATIONS.OPENED;
 const INSPECTOR_CLOSED = InspectorUI.INSPECTOR_NOTIFICATIONS.CLOSED;
 
-const TILT_INITIALIZED = Tilt.NOTIFICATIONS.INITIALIZED;
+const INITIALIZING = Tilt.NOTIFICATIONS.INITIALIZING;
-const TILT_DESTROYED = Tilt.NOTIFICATIONS.DESTROYED;
+const INITIALIZED = Tilt.NOTIFICATIONS.INITIALIZED;
-const TILT_SHOWN = Tilt.NOTIFICATIONS.SHOWN;
+const DESTROYING = Tilt.NOTIFICATIONS.DESTROYING;
-const TILT_HIDDEN = Tilt.NOTIFICATIONS.HIDDEN;
+const BEFORE_DESTROYED = Tilt.NOTIFICATIONS.BEFORE_DESTROYED;
+const DESTROYED = Tilt.NOTIFICATIONS.DESTROYED;
+const SHOWN = Tilt.NOTIFICATIONS.SHOWN;
+const HIDDEN = Tilt.NOTIFICATIONS.HIDDEN;
+const HIGHLIGHTING = Tilt.NOTIFICATIONS.HIGHLIGHTING;
+const UNHIGHLIGHTING = Tilt.NOTIFICATIONS.UNHIGHLIGHTING;
+const NODE_REMOVED = Tilt.NOTIFICATIONS.NODE_REMOVED;
 
 const TILT_ENABLED = Services.prefs.getBoolPref("devtools.tilt.enabled");
 const INSP_ENABLED = Services.prefs.getBoolPref("devtools.inspector.enabled");
@@ -122,6 +128,8 @@ function createTab(callback, location) {
 
 
 function createTilt(callbacks, close) {
+  Services.prefs.setBoolPref("webgl.verbose", true);
+
   Services.obs.addObserver(onInspectorOpen, INSPECTOR_OPENED, false);
   InspectorUI.toggleInspectorUI();
 
@@ -132,27 +140,27 @@ function createTilt(callbacks, close) {
       if ("function" === typeof callbacks.onInspectorOpen) {
         callbacks.onInspectorOpen();
       }
-      Services.obs.addObserver(onTiltOpen, TILT_INITIALIZED, false);
+      Services.obs.addObserver(onTiltOpen, INITIALIZING, false);
       Tilt.initialize();
     });
   }
 
   function onTiltOpen() {
-    Services.obs.removeObserver(onTiltOpen, TILT_INITIALIZED);
+    Services.obs.removeObserver(onTiltOpen, INITIALIZING);
 
     executeSoon(function() {
       if ("function" === typeof callbacks.onTiltOpen) {
         callbacks.onTiltOpen(Tilt.visualizers[Tilt.currentWindowId]);
       }
       if (close) {
-        Services.obs.addObserver(onTiltClose, TILT_DESTROYED, false);
+        Services.obs.addObserver(onTiltClose, DESTROYED, false);
         Tilt.destroy(Tilt.currentWindowId);
       }
     });
   }
 
   function onTiltClose() {
-    Services.obs.removeObserver(onTiltClose, TILT_DESTROYED);
+    Services.obs.removeObserver(onTiltClose, DESTROYED);
 
     executeSoon(function() {
       if ("function" === typeof callbacks.onTiltClose) {