Bug 1243736 - Enable browser_rules_pseudo-element_02.js with e10s and make rule-view wait for updateSourceLink; r=bgrins

devtools/client/inspector/rules/rules.js

@@ -962,12 +962,13 @@ CssRuleView.prototype = {
       }
 
       this._clearRules();
-      this._createEditors();
-
+      let onEditorsReady = this._createEditors();
       this.refreshPseudoClassPanel();
 
       // Notify anyone that cares that we refreshed.
-      this.emit("ruleview-refreshed");
+      return onEditorsReady.then(() => {
+        this.emit("ruleview-refreshed");
+      }, e => console.error(e));
     }).then(null, promiseWarn);
   },
 
@@ -1147,9 +1148,10 @@ CssRuleView.prototype = {
     let container = null;
 
     if (!this._elementStyle.rules) {
-      return;
+      return promise.resolve();
     }
 
+    let editorReadyPromises = [];
     for (let rule of this._elementStyle.rules) {
       if (rule.domRule.system) {
         continue;
@@ -1158,6 +1160,7 @@ CssRuleView.prototype = {
       // Initialize rule editor
       if (!rule.editor) {
         rule.editor = new RuleEditor(this, rule);
+        editorReadyPromises.push(rule.editor.once("source-link-updated"));
       }
 
       // Filter the rules and highlight any matches if there is a search input
@@ -1211,6 +1214,8 @@ CssRuleView.prototype = {
     } else {
       this.searchField.classList.remove("devtools-style-searchbox-no-match");
     }
+
+    return promise.all(editorReadyPromises);
   },
 
   /**

devtools/client/inspector/rules/test/browser.ini

@@ -139,7 +139,6 @@ skip-if = (os == "win" && debug) || e10s # bug 963492: win. bug 1040653: e10s.
 [browser_rules_original-source-link.js]
 [browser_rules_pseudo-element_01.js]
 [browser_rules_pseudo-element_02.js]
-skip-if = e10s # Bug 1090340
 [browser_rules_pseudo_lock_options.js]
 [browser_rules_refresh-no-flicker.js]
 [browser_rules_refresh-on-attribute-change_01.js]

devtools/client/inspector/rules/test/browser_rules_pseudo-element_02.js

@@ -11,11 +11,8 @@ const TEST_URI = URL_ROOT + "doc_pseudoelement.html";
 add_task(function*() {
   yield addTab(TEST_URI);
   let {inspector} = yield openRuleView();
-  yield testTopLeft(inspector);
-});
 
-function* testTopLeft(inspector) {
-  let node = inspector.markup.walker.frontForRawNode(getNode("#topleft"));
+  let node = yield getNodeFront("#topleft", inspector);
   let children = yield inspector.markup.walker.children(node);
 
   is(children.nodes.length, 3, "Element has correct number of children");
@@ -29,5 +26,4 @@ function* testTopLeft(inspector) {
   is(afterElement.tagName, "_moz_generated_content_after",
     "tag name is correct");
   yield selectNode(afterElement, inspector);
-}
-
+});

devtools/client/inspector/rules/views/rule-editor.js

@@ -25,6 +25,8 @@ const {
   SELECTOR_ELEMENT,
   SELECTOR_PSEUDO_CLASS
 } = require("devtools/client/shared/css-parsing-utils");
+const promise = require("promise");
+const EventEmitter = require("devtools/shared/event-emitter");
 
 XPCOMUtils.defineLazyGetter(this, "_strings", function() {
   return Services.strings.createBundle(
@@ -40,12 +42,20 @@ const XUL_NS = "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul";
  *     for its TextProperties.
  *   Manages creation of new text properties.
  *
+ * One step of a RuleEditor's instantiation is figuring out what's the original
+ * source link to the parent stylesheet (in case of source maps). This step is
+ * asynchronous and is triggered as soon as the RuleEditor is instantiated (see
+ * updateSourceLink). If you need to know when the RuleEditor is done with this,
+ * you need to listen to the source-link-updated event.
+ *
  * @param {CssRuleView} ruleView
  *        The CssRuleView containg the document holding this rule editor.
  * @param {Rule} rule
  *        The Rule object we're editing.
  */
 function RuleEditor(ruleView, rule) {
+  EventEmitter.decorate(this);
+
   this.ruleView = ruleView;
   this.doc = this.ruleView.styleDocument;
   this.rule = rule;
@@ -235,10 +245,21 @@ RuleEditor.prototype = {
     let showOrig = Services.prefs.getBoolPref(PREF_ORIG_SOURCES);
     if (showOrig && !this.rule.isSystem &&
         this.rule.domRule.type !== ELEMENT_STYLE) {
+      // Only get the original source link if the right pref is set, if the rule
+      // isn't a system rule and if it isn't an inline rule.
       this.rule.getOriginalSourceStrings().then((strings) => {
         sourceLabel.setAttribute("value", strings.short);
         sourceLabel.setAttribute("tooltiptext", strings.full);
-      }, console.error);
+      }, e => console.error(e)).then(() => {
+        this.emit("source-link-updated");
+      });
+    } else {
+      // If we're not getting the original source link, then we can emit the
+      // event immediately (but still asynchronously to give consumers a chance
+      // to register it after having instantiated the RuleEditor).
+      promise.resolve().then(() => {
+        this.emit("source-link-updated");
+      });
     }
   },