Bug 1489219 - Add basic mochitest for This Firefox page;r=daisuke,ladybenko

--HG--
extra : rebase_source : 69e9be6640d8abd44299ad488487bf0723274346

devtools/client/aboutdebugging-new/moz.build

@@ -10,5 +10,10 @@ XPCSHELL_TESTS_MANIFESTS += [
     'test/unit/xpcshell.ini'
 ]
 
+BROWSER_CHROME_MANIFESTS += [
+    'test/browser/browser.ini'
+]
+
+
 with Files('**'):
     BUG_COMPONENT = ('DevTools', 'about:debugging')

devtools/client/aboutdebugging-new/src/components/debugtarget/DebugTargetPane.js

@@ -49,7 +49,7 @@ class DebugTargetPane extends PureComponent {
         {},
         dom.a(
           {
-            className: "debug-target-pane__title" +
+            className: "debug-target-pane__title js-debug-target-pane-title" +
                        (isCollapsed ? " debug-target-pane__title--collapsed" : ""),
             href: "#",
             onClick: e => this.toggleCollapsibility(),

devtools/client/aboutdebugging-new/src/components/sidebar/SidebarItem.js

@@ -35,7 +35,10 @@ class SidebarItem extends PureComponent {
     return dom.li(
       {
         className: "sidebar-item" +
-                   (isSelected ? " sidebar-item--selected" : "") +
+                   (isSelected ?
+                      " sidebar-item--selected js-sidebar-item-selected" :
+                      ""
+                   ) +
                    (selectable ? " sidebar-item--selectable" : ""),
         onClick: selectable ? () => this.onItemClick() : null
       },

devtools/client/aboutdebugging-new/test/browser/.eslintrc.js

@@ -0,0 +1,10 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+"use strict";
+
+module.exports = {
+  // Extend from the shared list of defined globals for mochitests.
+  "extends": "../../../../.eslintrc.mochitests.js"
+};

devtools/client/aboutdebugging-new/test/browser/browser.ini

@@ -0,0 +1,9 @@
+[DEFAULT]
+tags = devtools
+subsuite = devtools
+support-files =
+  head.js
+  !/devtools/client/shared/test/shared-head.js
+  !/devtools/client/shared/test/telemetry-test-helpers.js
+
+[browser_aboutdebugging_thisfirefox.js]

devtools/client/aboutdebugging-new/test/browser/browser_aboutdebugging_thisfirefox.js

@@ -0,0 +1,39 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+/**
+ * Check that the This Firefox page is displayed by default when opening the new
+ * about:debugging and that it contains the expected categories.
+ */
+
+const EXPECTED_TARGET_PANES = [
+  "Temporary Extensions",
+  "Extensions",
+  "Tabs",
+  "Service Workers",
+  "Shared Workers",
+  "Other Workers",
+];
+
+add_task(async function() {
+  const { document } = await openAboutDebugging();
+
+  // Check that the selected sidebar item is "This Firefox"
+  const selectedSidebarItem = document.querySelector(".js-sidebar-item-selected");
+  ok(selectedSidebarItem, "An item is selected in the sidebar");
+  is(selectedSidebarItem.textContent, "This Firefox",
+    "The selected sidebar item is This Firefox");
+
+  const paneTitlesEls = document.querySelectorAll(".js-debug-target-pane-title");
+  is(paneTitlesEls.length, EXPECTED_TARGET_PANES.length,
+    "This Firefox has the expecte number of debug target categories");
+
+  const paneTitles = [...paneTitlesEls].map(el => el.textContent);
+
+  EXPECTED_TARGET_PANES.forEach(expectedPane => {
+    ok(paneTitles.includes(expectedPane),
+      "Expected debug target category found: " + expectedPane);
+  });
+});

devtools/client/aboutdebugging-new/test/browser/head.js

@@ -0,0 +1,35 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+/* eslint-env browser */
+/* eslint no-unused-vars: [2, {"vars": "local"}] */
+/* import-globals-from ../../../shared/test/shared-head.js */
+
+"use strict";
+
+// Load the shared-head file first.
+Services.scriptloader.loadSubScript(
+  "chrome://mochitests/content/browser/devtools/client/shared/test/shared-head.js",
+  this);
+
+/**
+ * Enable the new about:debugging panel.
+ */
+async function enableNewAboutDebugging() {
+  await pushPref("devtools.aboutdebugging.new-enabled", true);
+}
+
+async function openAboutDebugging(page, win) {
+  await enableNewAboutDebugging();
+
+  info("opening about:debugging");
+  const tab = await addTab("about:debugging", { window: win });
+  const browser = tab.linkedBrowser;
+  const document = browser.contentDocument;
+  const window = browser.contentWindow;
+
+  info("Wait until the main about debugging container is available");
+  await waitUntil(() => document.querySelector(".app"));
+
+  return { tab, document, window };
+}