Bug 1495665 - Add test for profiler dialog in aboutdebugging;r=ladybenko
authorJulian Descottes <jdescottes@mozilla.com>
Tue, 12 Feb 2019 10:17:00 +0000
changeset 458665 106bb3f48bebd07605f24bbd69028f8a530af75f
parent 458664 b096b883636d8fd8430b6405d8c88744ee6e7202
child 458666 3cd02dd2d56fb9324363483768b4f0503988fe20
push id35543
push userccoroiu@mozilla.com
push dateTue, 12 Feb 2019 16:27:27 +0000
treeherdermozilla-central@4ad4e42bcb99 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersladybenko
bugs1495665
milestone67.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1495665 - Add test for profiler dialog in aboutdebugging;r=ladybenko Depends on D18698 Differential Revision: https://phabricator.services.mozilla.com/D18699
devtools/client/aboutdebugging-new/src/components/ProfilerDialog.js
devtools/client/aboutdebugging-new/src/components/RuntimePage.js
devtools/client/aboutdebugging-new/src/modules/client-wrapper.js
devtools/client/aboutdebugging-new/test/browser/browser.ini
devtools/client/aboutdebugging-new/test/browser/browser_aboutdebugging_profiler_dialog.js
devtools/client/aboutdebugging-new/test/browser/browser_aboutdebugging_runtime_connection-prompt.js
devtools/client/aboutdebugging-new/test/browser/browser_aboutdebugging_runtime_remote_runtime_buttons.js
devtools/client/aboutdebugging-new/test/browser/mocks/helper-client-wrapper-mock.js
--- a/devtools/client/aboutdebugging-new/src/components/ProfilerDialog.js
+++ b/devtools/client/aboutdebugging-new/src/components/ProfilerDialog.js
@@ -25,24 +25,26 @@ class ProfilerDialog extends PureCompone
     };
   }
 
   hide() {
     this.props.dispatch(Actions.hideProfilerDialog());
   }
 
   render() {
+    const { clientWrapper } = this.props.runtimeDetails;
+
     return dom.div(
       {
-        className: "profiler-dialog__mask",
+        className: "profiler-dialog__mask js-profiler-dialog-mask",
         onClick: () => this.hide(),
       },
       dom.article(
         {
-          className: "profiler-dialog__inner",
+          className: "profiler-dialog__inner js-profiler-dialog",
           onClick: e => e.stopPropagation(),
         },
         dom.header(
           {
             className: "profiler-dialog__header",
           },
           Localized(
             {
@@ -52,31 +54,30 @@ class ProfilerDialog extends PureCompone
               {
                 className: "profiler-dialog__header__title",
               },
               "Performance Profiler",
             )
           ),
           dom.button(
             {
-              className: "ghost-button",
+              className: "ghost-button js-profiler-dialog-close",
               onClick: () => this.hide(),
             },
             dom.img(
               {
                 src: "chrome://devtools/skin/images/close.svg",
               }
             )
           )
         ),
         dom.iframe({
           className: "profiler-dialog__frame",
-          src: "chrome://devtools/content/performance-new/index.xhtml",
+          src: clientWrapper.getPerformancePanelUrl(),
           onLoad: (e) => {
-            const { clientWrapper } = this.props.runtimeDetails;
             clientWrapper.loadPerformanceProfiler(e.target.contentWindow);
           },
         })
       )
     );
   }
 }
 
--- a/devtools/client/aboutdebugging-new/src/components/RuntimePage.js
+++ b/devtools/client/aboutdebugging-new/src/components/RuntimePage.js
@@ -84,17 +84,17 @@ class RuntimePage extends PureComponent 
         {},
         Localized(
           {
             id: "about-debugging-runtime-profile-button",
             key: "profile-runtime-button",
           },
           dom.button(
             {
-              className: "default-button",
+              className: "default-button js-profile-runtime-button",
               onClick: () => this.onProfilerButtonClick(),
             },
             "Profile Runtime"
           ),
         ),
       ),
     ];
   }
--- a/devtools/client/aboutdebugging-new/src/modules/client-wrapper.js
+++ b/devtools/client/aboutdebugging-new/src/modules/client-wrapper.js
@@ -150,16 +150,21 @@ class ClientWrapper {
   async close() {
     return this.client.close();
   }
 
   isClosed() {
     return this.client._closed;
   }
 
+  // This method will be mocked to return a dummy URL during mochitests
+  getPerformancePanelUrl() {
+    return "chrome://devtools/content/performance-new/index.xhtml";
+  }
+
   async loadPerformanceProfiler(win) {
     const preferenceFront = await this.getFront("preference");
     const perfFront = await this.getFront("perf");
     const perfActorVersion = this.client.mainRoot.traits.perfActorVersion;
     win.gInit(perfFront, preferenceFront, perfActorVersion);
   }
 }
 
--- a/devtools/client/aboutdebugging-new/test/browser/browser.ini
+++ b/devtools/client/aboutdebugging-new/test/browser/browser.ini
@@ -54,18 +54,19 @@ skip-if = (os == 'linux' && bits == 32) 
 [browser_aboutdebugging_devtoolstoolbox_contextmenu_markupview.js]
 [browser_aboutdebugging_devtoolstoolbox_menubar.js]
 [browser_aboutdebugging_devtoolstoolbox_reload.js]
 [browser_aboutdebugging_devtoolstoolbox_shortcuts.js]
 skip-if = (os == "win" && ccov) # Bug 1521349
 [browser_aboutdebugging_devtoolstoolbox_tooltip_markupview.js]
 [browser_aboutdebugging_navigate.js]
 [browser_aboutdebugging_persist_connection.js]
+[browser_aboutdebugging_profiler_dialog.js]
 [browser_aboutdebugging_routes.js]
-[browser_aboutdebugging_runtime_connection-prompt.js]
+[browser_aboutdebugging_runtime_remote_runtime_buttons.js]
 [browser_aboutdebugging_runtime_usbclient_closed.js]
 [browser_aboutdebugging_select_network_runtime.js]
 [browser_aboutdebugging_select_page_with_serviceworker.js]
 [browser_aboutdebugging_serviceworker_fetch_flag.js]
 [browser_aboutdebugging_serviceworker_multie10s.js]
 [browser_aboutdebugging_serviceworker_not_compatible.js]
 [browser_aboutdebugging_serviceworker_push.js]
 [browser_aboutdebugging_serviceworker_pushservice_url.js]
new file mode 100644
--- /dev/null
+++ b/devtools/client/aboutdebugging-new/test/browser/browser_aboutdebugging_profiler_dialog.js
@@ -0,0 +1,83 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+/* import-globals-from helper-mocks.js */
+Services.scriptloader.loadSubScript(CHROME_URL_ROOT + "helper-mocks.js", this);
+
+/**
+ * Test opening and closing the profiler dialog.
+ */
+add_task(async function() {
+  // enable USB devices mocks
+  const mocks = new Mocks();
+  const usbClient = mocks.createUSBRuntime("1337id", {
+    deviceName: "Fancy Phone",
+    name: "Lorem ipsum",
+  });
+
+  const { document, tab, window } = await openAboutDebugging();
+
+  mocks.emitUSBUpdate();
+  await connectToRuntime("Fancy Phone", document);
+  await selectRuntime("Fancy Phone", "Lorem ipsum", document);
+
+  info("Open the profiler dialog");
+  await openProfilerDialog(usbClient, document);
+  assertDialogVisible(document);
+
+  info("Click on the close button and wait until the dialog disappears");
+  const closeDialogButton = document.querySelector(".js-profiler-dialog-close");
+  closeDialogButton.click();
+  await waitUntil(() => !document.querySelector(".js-profiler-dialog"));
+  assertDialogHidden(document);
+
+  info("Open the profiler dialog again");
+  await openProfilerDialog(usbClient, document);
+  assertDialogVisible(document);
+
+  info("Click on the mask element and wait until the dialog disappears");
+  const mask = document.querySelector(".js-profiler-dialog-mask");
+  EventUtils.synthesizeMouse(mask, 5, 5, {}, window);
+  await waitUntil(() => !document.querySelector(".js-profiler-dialog"));
+  assertDialogHidden(document);
+
+  info("Open the profiler dialog again");
+  await openProfilerDialog(usbClient, document);
+  assertDialogVisible(document);
+
+  info("Navigate to this-firefox and wait until the dialog disappears");
+  document.location.hash = "#/runtime/this-firefox";
+  await waitUntil(() => !document.querySelector(".js-profiler-dialog"));
+  assertDialogHidden(document);
+
+  info("Select the remote runtime again, check the dialog is still hidden");
+  await selectRuntime("Fancy Phone", "Lorem ipsum", document);
+  assertDialogHidden(document);
+
+  await removeTab(tab);
+});
+
+function assertDialogVisible(doc) {
+  ok(doc.querySelector(".js-profiler-dialog"), "Dialog is displayed");
+  ok(doc.querySelector(".js-profiler-dialog-mask"), "Dialog mask is displayed");
+}
+
+function assertDialogHidden(doc) {
+  ok(!document.querySelector(".js-profiler-dialog"), "Dialog is removed");
+  ok(!document.querySelector(".js-profiler-dialog-mask"), "Dialog mask is removed");
+}
+
+function openProfilerDialog(client, doc) {
+  const onProfilerLoaded = new Promise(r => {
+    client.loadPerformanceProfiler = r;
+  });
+
+  info("Click on the Profile Runtime button");
+  const profileButton = doc.querySelector(".js-profile-runtime-button");
+  profileButton.click();
+
+  info("Wait for the loadPerformanceProfiler callback to be executed on client-wrapper");
+  return onProfilerLoaded;
+}
rename from devtools/client/aboutdebugging-new/test/browser/browser_aboutdebugging_runtime_connection-prompt.js
rename to devtools/client/aboutdebugging-new/test/browser/browser_aboutdebugging_runtime_remote_runtime_buttons.js
--- a/devtools/client/aboutdebugging-new/test/browser/browser_aboutdebugging_runtime_connection-prompt.js
+++ b/devtools/client/aboutdebugging-new/test/browser/browser_aboutdebugging_runtime_remote_runtime_buttons.js
@@ -3,34 +3,37 @@
 
 "use strict";
 
 /* import-globals-from helper-mocks.js */
 Services.scriptloader.loadSubScript(
   CHROME_URL_ROOT + "helper-mocks.js", this);
 
 /**
- * Test that remote runtimes show the connection prompt,
- * but it's hidden in 'This Firefox'
+ * Test that remote runtimes show action buttons that are hidden for 'This Firefox'.
  */
 add_task(async function() {
   // enable USB devices mocks
   const mocks = new Mocks();
   mocks.createUSBRuntime("1337id", {
     deviceName: "Fancy Phone",
     name: "Lorem ipsum",
   });
 
   const { document, tab } = await openAboutDebugging();
 
   info("Checking This Firefox");
   ok(!document.querySelector(".js-connection-prompt-toggle-button"),
     "This Firefox does not contain the connection prompt button");
+  ok(!document.querySelector(".js-profile-runtime-button"),
+    "This Firefox does not contain the profile runtime button");
 
   info("Checking a USB runtime");
   mocks.emitUSBUpdate();
   await connectToRuntime("Fancy Phone", document);
   await selectRuntime("Fancy Phone", "Lorem ipsum", document);
   ok(!!document.querySelector(".js-connection-prompt-toggle-button"),
     "Runtime contains the connection prompt button");
+  ok(!!document.querySelector(".js-profile-runtime-button"),
+    "Remote runtime contains the profile runtime button");
 
   await removeTab(tab);
 });
--- a/devtools/client/aboutdebugging-new/test/browser/mocks/helper-client-wrapper-mock.js
+++ b/devtools/client/aboutdebugging-new/test/browser/mocks/helper-client-wrapper-mock.js
@@ -82,16 +82,18 @@ function createClientMock() {
     // no-op
     getFront: () => {},
     // no-op
     onFront: () => {},
     // stores the preference locally (doesn't update about:config)
     setPreference: function(prefName, value) {
       this._preferences[prefName] = value;
     },
+    getPerformancePanelUrl: () => "data:text/html;charset=UTF-8,fake_profiler_page",
+    loadPerformanceProfiler: () => {},
   };
 }
 
 // Create a ClientWrapper mock that can be used to replace the this-firefox runtime.
 function createThisFirefoxClientMock() {
   const mockThisFirefoxDescription = {
     name: "Firefox",
     channel: "nightly",