Bug 1078374 - Add mochitest for markup view with template tag;r=bgrins draft
authorJulian Descottes <jdescottes@mozilla.com>
Thu, 21 Jun 2018 16:58:08 +0200
changeset 809839 d04e988ba186934a7fc4c65aed8e3c1ab41fba31
parent 809838 cba3b3ae692702d385c55a4349350adc0b8ab8ee
push id113825
push userjdescottes@mozilla.com
push dateSat, 23 Jun 2018 07:02:52 +0000
reviewersbgrins
bugs1078374
milestone62.0a1
Bug 1078374 - Add mochitest for markup view with template tag;r=bgrins MozReview-Commit-ID: 4knVStt5QzY
devtools/client/inspector/markup/test/browser.ini
devtools/client/inspector/markup/test/browser_markup_template.js
--- a/devtools/client/inspector/markup/test/browser.ini
+++ b/devtools/client/inspector/markup/test/browser.ini
@@ -184,16 +184,17 @@ skip-if = e10s # Bug 1036409 - The last 
 [browser_markup_tag_edit_08.js]
 [browser_markup_tag_edit_09.js]
 [browser_markup_tag_edit_10.js]
 [browser_markup_tag_edit_11.js]
 [browser_markup_tag_edit_12.js]
 [browser_markup_tag_edit_13-other.js]
 [browser_markup_tag_edit_avoid_refocus.js]
 [browser_markup_tag_edit_long-classname.js]
+[browser_markup_template.js]
 [browser_markup_textcontent_display.js]
 [browser_markup_textcontent_edit_01.js]
 [browser_markup_textcontent_edit_02.js]
 [browser_markup_toggle_01.js]
 [browser_markup_toggle_02.js]
 [browser_markup_toggle_03.js]
 [browser_markup_toggle_closing_tag_line.js]
 [browser_markup_update-on-navigtion.js]
new file mode 100644
--- /dev/null
+++ b/devtools/client/inspector/markup/test/browser_markup_template.js
@@ -0,0 +1,50 @@
+/* vim: set ts=2 et sw=2 tw=80: */
+/* Any copyright is dedicated to the Public Domain.
+ http://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+// Test the markup view displaying the content of a <template> tag.
+
+add_task(async function() {
+  const TEST_URL = `data:text/html;charset=utf-8,` + encodeURIComponent(`
+    <div id="root">
+      <template>
+        <p>template content</p>
+      </template>
+
+      <div id="template-container" style="border: 1px solid black"></div>
+    </div>
+    <script>
+      "use strict";
+
+      const template = document.querySelector("template");
+      const clone = document.importNode(template.content, true);
+      document.querySelector("#template-container").appendChild(clone);
+    </script>`);
+
+  const EXPECTED_TREE = `
+    root
+      template
+        #document-fragment
+          p
+      template-container
+        p`;
+
+  const {inspector} = await openInspectorForURL(TEST_URL);
+  const {markup} = inspector;
+
+  await assertMarkupViewAsTree(EXPECTED_TREE, "#root", inspector);
+
+  info("Select the p element under the template .");
+  const templateFront = await getNodeFront("template", inspector);
+  const templateContainer = markup.getContainer(templateFront);
+  const documentFragmentContainer = templateContainer.getChildContainers()[0];
+  const pContainer = documentFragmentContainer.getChildContainers()[0];
+
+  await selectNode(pContainer.node, inspector, "no-reason", false);
+
+  const ruleView = inspector.getPanel("ruleview").view;
+  is(ruleView.element.querySelectorAll("#ruleview-no-results").length, 1,
+    "No rules are displayed for this p element");
+});