--- a/devtools/client/inspector/rules/rules.js
+++ b/devtools/client/inspector/rules/rules.js
@@ -488,16 +488,18 @@ CssRuleView.prototype = {
       // Be sure the reference the correct |rules| here.
       for (let rule of this._elementStyle.rules) {
         if (options.rule === rule.domRule) {
           rule.editor.selectorText.click();
           elementStyle._changed();
           break;
         }
       }
+
+      this.emit("ruleview-rule-added");
     });
   },
 
   /**
    * Disables add rule button when needed
    */
   refreshAddRuleButtonState: function () {
     let shouldBeDisabled = !this._viewedElement ||

--- a/devtools/client/inspector/rules/test/browser_rules_add-rule-with-menu.js
+++ b/devtools/client/inspector/rules/test/browser_rules_add-rule-with-menu.js
@@ -22,17 +22,17 @@ function* addNewRuleFromContextMenu(insp
 
   let allMenuItems = openStyleContextMenuAndGetAllItems(view, view.element);
   let menuitemAddRule = allMenuItems.find(item => item.label ===
     STYLE_INSPECTOR_L10N.getStr("styleinspector.contextmenu.addNewRule"));
 
   ok(menuitemAddRule.visible, "Add rule is visible");
 
   info("Adding the new rule and expecting a ruleview-changed event");
-  let onRuleViewChanged = view.once("ruleview-changed");
+  let onRuleViewChanged = view.once("ruleview-rule-added");
   menuitemAddRule.click();
   yield onRuleViewChanged;
 }
 
 function* testNewRule(view) {
   let ruleEditor = getRuleViewRuleEditor(view, 1);
   let editor = ruleEditor.selectorText.ownerDocument.activeElement;
   is(editor.value, "#testid", "Selector editor value is as expected");

--- a/devtools/client/inspector/rules/test/head.js
+++ b/devtools/client/inspector/rules/test/head.js
@@ -712,21 +712,23 @@ function* reloadPage(inspector, testActo
  *
  * @param {InspectorPanel} inspector
  *        The instance of InspectorPanel currently loaded in the toolbox
  * @param {CssRuleView} view
  *        The instance of the rule-view panel
  * @return a promise that resolves after the rule has been added
  */
 function* addNewRule(inspector, view) {
+  let added = view.once("ruleview-rule-added");
+
   info("Adding the new rule using the button");
   view.addRuleButton.click();
 
   info("Waiting for rule view to change");
-  yield view.once("ruleview-changed");
+  yield added;
 }
 
 /**
  * Create a new rule by clicking on the "add rule" button, dismiss the editor field and
  * verify that the selector is correct.
  *
  * @param {InspectorPanel} inspector
  *        The instance of InspectorPanel currently loaded in the toolbox