Bug 1311941 - Updated addNode function so that on adding a new now the parent node remains selected. r=pbrosset

devtools/client/inspector/inspector.js

@@ -1471,12 +1471,11 @@ Inspector.prototype = {
 
     // Insert the html and expect a childList markup mutation.
     let onMutations = this.once("markupmutation");
-    let {nodes} = yield this.walker.insertAdjacentHTML(this.selection.nodeFront,
-                                                       "beforeEnd", html);
+    yield this.walker.insertAdjacentHTML(this.selection.nodeFront, "beforeEnd", html);
     yield onMutations;
 
-    // Select the new node (this will auto-expand its parent).
-    this.selection.setNodeFront(nodes[0], "node-inserted");
+    // Expand the parent node.
+    this.markup.expandNode(this.selection.nodeFront);
   }),
 
   /**

devtools/client/inspector/test/browser_inspector_addNode_03.js

@@ -4,8 +4,8 @@
 
 "use strict";
 
-// Test that adding nodes does work as expected: the parent gets expanded, the
-// new node gets selected.
+// Test that adding nodes does work as expected: the parent node remains selected and the
+// new node is created inside the parent.
 
 const TEST_URL = URL_ROOT + "doc_inspector_add_node.html";
 const PARENT_TREE_LEVEL = 3;
@@ -13,24 +13,24 @@ const PARENT_TREE_LEVEL = 3;
 add_task(function* () {
   let {inspector} = yield openInspectorForURL(TEST_URL);
 
-  info("Adding in element that has no children and is collapsed");
+  info("Adding a node in an element that has no children and is collapsed");
   let parentNode = yield getNodeFront("#foo", inspector);
   yield selectNode(parentNode, inspector);
   yield testAddNode(parentNode, inspector);
 
-  info("Adding in element with children but that has not been expanded yet");
+  info("Adding a node in an element with children but that has not been expanded yet");
   parentNode = yield getNodeFront("#bar", inspector);
   yield selectNode(parentNode, inspector);
   yield testAddNode(parentNode, inspector);
 
-  info("Adding in element with children that has been expanded then collapsed");
+  info("Adding a node in an element with children that has been expanded then collapsed");
   // Select again #bar and collapse it.
   parentNode = yield getNodeFront("#bar", inspector);
   yield selectNode(parentNode, inspector);
   collapseNode(parentNode, inspector);
   yield testAddNode(parentNode, inspector);
 
-  info("Adding in element with children that is expanded");
+  info("Adding a node in an element with children that is expanded");
   parentNode = yield getNodeFront("#bar", inspector);
   yield selectNode(parentNode, inspector);
   yield testAddNode(parentNode, inspector);
@@ -38,44 +38,30 @@ add_task(function* () {
 
 function* testAddNode(parentNode, inspector) {
   let btn = inspector.panelDoc.querySelector("#inspector-element-add-button");
-  let markupWindow = inspector.markup.win;
   let parentContainer = inspector.markup.getContainer(parentNode);
 
   is(parentContainer.tagLine.getAttribute("aria-level"), PARENT_TREE_LEVEL,
-    "Parent level should be up to date.");
+     "The parent aria-level is up to date.");
 
-  info("Clicking 'add node' and expecting a markup mutation and focus event");
+  info("Clicking 'add node' and expecting a markup mutation and a new container");
   let onMutation = inspector.once("markupmutation");
+  let onNewContainer = inspector.once("container-created");
   btn.click();
   let mutations = yield onMutation;
-
-  info("Expecting an inspector-updated event right after the mutation event " +
-       "to wait for the new node selection");
-  yield inspector.once("inspector-updated");
+  yield onNewContainer;
 
   is(mutations.length, 1, "There is one mutation only");
   is(mutations[0].added.length, 1, "There is one new node only");
 
   let newNode = mutations[0].added[0];
 
-  is(newNode, inspector.selection.nodeFront,
-     "The new node is selected");
+  is(parentNode, inspector.selection.nodeFront, "The parent node is still selected");
+  is(newNode.parentNode(), parentNode, "The new node is inside the right parent");
 
-  ok(parentContainer.expanded, "The parent node is now expanded");
+  let newNodeContainer = inspector.markup.getContainer(newNode);
 
-  is(inspector.selection.nodeFront.parentNode(), parentNode,
-     "The new node is inside the right parent");
-
-  let focusedElement = markupWindow.document.activeElement;
-  let focusedContainer = focusedElement.container;
-  let selectedContainer = inspector.markup._selectedContainer;
-  is(selectedContainer.tagLine.getAttribute("aria-level"),
-    PARENT_TREE_LEVEL + 1, "Added container level should be up to date.");
-  is(selectedContainer.node, inspector.selection.nodeFront,
-     "The right container is selected in the markup-view");
-  ok(selectedContainer.selected, "Selected container is set to selected");
-  is(focusedContainer.toString(), "[root container]",
-    "Root container is focused");
+  is(newNodeContainer.tagLine.getAttribute("aria-level"), PARENT_TREE_LEVEL + 1,
+     "The child aria-level is up to date.");
 }
 
 function collapseNode(node, inspector) {