Bug 1473902 - Wrong node count in 'show all nodes' button. r=jdescottes draft
authorBelén Albeza <balbeza@mozilla.com>
Tue, 24 Jul 2018 17:54:47 +0200
changeset 822633 2eaa17883198ac7313440523f737e7d33480effa
parent 821479 143984185dcece46031c970179ddea4837a6c01d
push id117414
push userbmo:balbeza@mozilla.com
push dateWed, 25 Jul 2018 14:47:49 +0000
reviewersjdescottes
bugs1473902
milestone63.0a1
Bug 1473902 - Wrong node count in 'show all nodes' button. r=jdescottes MozReview-Commit-ID: BwBqRVGli3b
devtools/client/inspector/markup/test/browser.ini
devtools/client/inspector/markup/test/browser_markup_shadowdom_show_nodes_button.js
devtools/server/actors/inspector/node.js
--- a/devtools/client/inspector/markup/test/browser.ini
+++ b/devtools/client/inspector/markup/test/browser.ini
@@ -173,16 +173,17 @@ subsuite = clipboard
 [browser_markup_shadowdom_dynamic.js]
 [browser_markup_shadowdom_hover.js]
 [browser_markup_shadowdom_maxchildren.js]
 [browser_markup_shadowdom_mutations_shadow.js]
 [browser_markup_shadowdom_navigation.js]
 [browser_markup_shadowdom_nested_pick_inspect.js]
 [browser_markup_shadowdom_noslot.js]
 [browser_markup_shadowdom_shadowroot_mode.js]
+[browser_markup_shadowdom_show_nodes_button.js]
 [browser_markup_shadowdom_slotupdate.js]
 [browser_markup_tag_delete_whitespace_node.js]
 [browser_markup_tag_edit_01.js]
 [browser_markup_tag_edit_02.js]
 [browser_markup_tag_edit_03.js]
 [browser_markup_tag_edit_04-backspace.js]
 [browser_markup_tag_edit_04-delete.js]
 [browser_markup_tag_edit_05.js]
new file mode 100644
--- /dev/null
+++ b/devtools/client/inspector/markup/test/browser_markup_shadowdom_show_nodes_button.js
@@ -0,0 +1,52 @@
+/* Any copyright is dedicated to the Public Domain.
+ http://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+// Test that the "Show all 'N' nodes" button displays the proper value
+
+const NODE_COUNT = 101;
+const TEST_URL = `data:text/html;charset=utf-8,
+  <test-component>
+  </test-component>
+
+  <script>
+    'use strict';
+    for (let i = 0; i < ${NODE_COUNT}; i++) {
+      const div = document.createElement("div");
+      div.innerHTML = i;
+      document.querySelector('test-component').appendChild(div);
+    }
+    customElements.define('test-component', class extends HTMLElement {
+      constructor() {
+        super();
+        let shadowRoot = this.attachShadow({mode: 'open'});
+        shadowRoot.innerHTML = '<slot></slot>';
+      }
+    });
+  </script>`;
+
+add_task(async function() {
+  await enableWebComponents();
+
+  const { inspector } = await openInspectorForURL(TEST_URL);
+  const { markup } = inspector;
+
+  info("Find and expand the component shadow DOM host.");
+  const hostFront = await getNodeFront("test-component", inspector);
+  const hostContainer = markup.getContainer(hostFront);
+  await expandContainer(inspector, hostContainer);
+  const shadowRootContainer = hostContainer.getChildContainers()[0];
+  await expandContainer(inspector, shadowRootContainer);
+
+  info("Expand the slot");
+  const slotContainer = shadowRootContainer.getChildContainers()[0];
+  await expandContainer(inspector, slotContainer);
+
+  info("Find the 'Show all nodes' button");
+  const button = slotContainer.elt.querySelector("button");
+  console.log(button);
+  ok(button.innerText.includes(NODE_COUNT),
+    "'Show all nodes' button contains correct node count");
+});
+
--- a/devtools/server/actors/inspector/node.js
+++ b/devtools/server/actors/inspector/node.js
@@ -198,17 +198,18 @@ const NodeActor = protocol.ActorClassWit
     const hasSVGDocument = rawNode.getSVGDocument && rawNode.getSVGDocument();
     if (numChildren === 0 && (hasContentDocument || hasSVGDocument)) {
       // This might be an iframe with virtual children.
       numChildren = 1;
     }
 
     // Normal counting misses ::before/::after.  Also, some anonymous children
     // may ultimately be skipped, so we have to consult with the walker.
-    if (numChildren === 0 || hasAnonChildren || isShadowHost(this.rawNode)) {
+    if (numChildren === 0 || hasAnonChildren || isShadowHost(this.rawNode) ||
+      isShadowAnonymous(this.rawNode)) {
       numChildren = this.walker.countChildren(this);
     }
 
     return numChildren;
   },
 
   get computedStyle() {
     if (!this._computedStyle) {