Bug 1542286 - Add tests for Firefox Preview runtime info r=daisuke
authorJulian Descottes <jdescottes@mozilla.com>
Tue, 07 May 2019 15:23:16 +0000
changeset 472921 796149a6d1b6e28ca83307dc6ad10f8882c3ca67
parent 472920 1d326e6840189ef74100cdf109eec8107ae6c689
child 472922 d59bc9316e781b0620f534692a5e104578f87157
push id35983
push userncsoregi@mozilla.com
push dateWed, 08 May 2019 03:38:51 +0000
treeherdermozilla-central@0e9e744accd3 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersdaisuke
bugs1542286
milestone68.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 1542286 - Add tests for Firefox Preview runtime info r=daisuke Depends on D29485 Differential Revision: https://phabricator.services.mozilla.com/D30064
devtools/client/aboutdebugging-new/src/components/RuntimeInfo.js
devtools/client/aboutdebugging-new/test/browser/browser.ini
devtools/client/aboutdebugging-new/test/browser/browser_aboutdebugging_fenix_runtime_display.js
devtools/client/aboutdebugging-new/test/browser/helper-mocks.js
devtools/client/framework/components/DebugTargetInfo.js
devtools/client/framework/test/jest/components/__snapshots__/debug-target-info.test.js.snap
devtools/client/framework/test/jest/components/debug-target-info.test.js
--- a/devtools/client/aboutdebugging-new/src/components/RuntimeInfo.js
+++ b/devtools/client/aboutdebugging-new/src/components/RuntimeInfo.js
@@ -32,17 +32,17 @@ class RuntimeInfo extends PureComponent 
     const { icon, deviceName, name, version, runtimeId, dispatch } = this.props;
 
     return dom.h1(
       {
         className: "main-heading runtime-info",
       },
       dom.img(
         {
-          className: "main-heading__icon runtime-info__icon",
+          className: "main-heading__icon runtime-info__icon qa-runtime-icon",
           src: icon,
         }
       ),
       Localized(
         {
           id: "about-debugging-runtime-name",
           $name: name,
           $version: version,
--- a/devtools/client/aboutdebugging-new/test/browser/browser.ini
+++ b/devtools/client/aboutdebugging-new/test/browser/browser.ini
@@ -65,16 +65,17 @@ skip-if = os == 'linux' && e10s && (asan
 [browser_aboutdebugging_devtoolstoolbox_reload.js]
 skip-if = verify || ccov # test loads the toolbox 2 times for each panel, might timeout or OOM
 [browser_aboutdebugging_devtoolstoolbox_shortcuts.js]
 skip-if = (os == "win" && ccov) # Bug 1521349
 [browser_aboutdebugging_devtoolstoolbox_splitconsole_key.js]
 [browser_aboutdebugging_devtoolstoolbox_target_destroyed.js]
 skip-if = debug || asan # This test leaks. See bug 1529005
 [browser_aboutdebugging_devtoolstoolbox_tooltip_markupview.js]
+[browser_aboutdebugging_fenix_runtime_display.js]
 [browser_aboutdebugging_message_close.js]
 [browser_aboutdebugging_navigate.js]
 [browser_aboutdebugging_persist_connection.js]
 [browser_aboutdebugging_process_category.js]
 [browser_aboutdebugging_process_main.js]
 [browser_aboutdebugging_profiler_dialog.js]
 [browser_aboutdebugging_real_usb_runtime_page_runtime_info.js]
 [browser_aboutdebugging_real_usb_sidebar.js]
new file mode 100644
--- /dev/null
+++ b/devtools/client/aboutdebugging-new/test/browser/browser_aboutdebugging_fenix_runtime_display.js
@@ -0,0 +1,144 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+const RUNTIME_ID = "1337id";
+const DEVICE_NAME = "Fancy Phone";
+const SERVER_RUNTIME_NAME = "Mozilla Firefox";
+const ADB_RUNTIME_NAME = "Firefox Preview";
+const SERVER_VERSION = "v7.3.31";
+const ADB_VERSION = "v1.3.37";
+
+const FENIX_RELEASE_ICON_SRC = "chrome://devtools/skin/images/aboutdebugging-fenix.svg";
+const FENIX_NIGHTLY_ICON_SRC =
+  "chrome://devtools/skin/images/aboutdebugging-fenix-nightly.svg";
+
+/**
+ * Check that Fenix runtime information is correctly displayed in about:debugging.
+ */
+add_task(async function() {
+  const mocks = new Mocks();
+  mocks.createUSBRuntime(RUNTIME_ID, {
+    deviceName: DEVICE_NAME,
+    isFenix: true,
+    name: SERVER_RUNTIME_NAME,
+    shortName: ADB_RUNTIME_NAME,
+    versionName: ADB_VERSION,
+    version: SERVER_VERSION,
+  });
+
+  // open a remote runtime page
+  const { document, tab, window } = await openAboutDebugging();
+  await selectThisFirefoxPage(document, window.AboutDebugging.store);
+
+  mocks.emitUSBUpdate();
+  await connectToRuntime(DEVICE_NAME, document);
+  await selectRuntime(DEVICE_NAME, ADB_RUNTIME_NAME, document);
+
+  info("Check that the runtime information is displayed as expected");
+  const runtimeInfo = document.querySelector(".qa-runtime-name");
+  ok(runtimeInfo, "Runtime info for the Fenix runtime is displayed");
+  const runtimeInfoText = runtimeInfo.textContent;
+
+  ok(runtimeInfoText.includes(ADB_RUNTIME_NAME), "Name is the ADB name");
+  ok(!runtimeInfoText.includes(SERVER_RUNTIME_NAME),
+    "Name does not include the server name");
+
+  ok(runtimeInfoText.includes(ADB_VERSION), "Version contains the ADB version");
+  ok(!runtimeInfoText.includes(SERVER_VERSION),
+    "Version does not contain the server version");
+
+  const runtimeIcon = document.querySelector(".qa-runtime-icon");
+  is(runtimeIcon.src, FENIX_RELEASE_ICON_SRC, "The runtime icon is the Fenix icon");
+
+  info("Remove USB runtime");
+  mocks.removeUSBRuntime(RUNTIME_ID);
+  mocks.emitUSBUpdate();
+  await waitUntilUsbDeviceIsUnplugged(DEVICE_NAME, document);
+
+  await removeTab(tab);
+});
+
+/**
+ * Check that Fenix runtime information is correctly displayed in about:devtools-toolbox.
+ */
+add_task(async function() {
+  // We use a real local client combined with a mocked USB runtime to be able to open
+  // about:devtools-toolbox on a real target.
+  const clientWrapper = await createLocalClientWrapper();
+
+  // Mock getDeviceDescription() to force the local client to return "nightly" as the
+  // channel. Otherwise the value of the icon source would depend on the current channel.
+  const deviceDescription = await clientWrapper.getDeviceDescription();
+  clientWrapper.getDeviceDescription = function() {
+    return Object.assign({}, deviceDescription, {
+      channel: "nightly",
+    });
+  };
+
+  const mocks = new Mocks();
+  mocks.createUSBRuntime(RUNTIME_ID, {
+    clientWrapper: clientWrapper,
+    deviceName: DEVICE_NAME,
+    isFenix: true,
+    name: SERVER_RUNTIME_NAME,
+    shortName: ADB_RUNTIME_NAME,
+    versionName: ADB_VERSION,
+    version: SERVER_VERSION,
+  });
+
+  // open a remote runtime page
+  const { document, tab, window } = await openAboutDebugging();
+  await selectThisFirefoxPage(document, window.AboutDebugging.store);
+
+  mocks.emitUSBUpdate();
+  info("Select the runtime page for the USB runtime");
+  const onRequestSuccess = waitForRequestsSuccess(window.AboutDebugging.store);
+  await connectToRuntime(DEVICE_NAME, document);
+  await selectRuntime(DEVICE_NAME, ADB_RUNTIME_NAME, document);
+
+  info("Wait for requests to finish the USB runtime is backed by a real local client");
+  await onRequestSuccess;
+
+  info("Wait for the about:debugging target to be available");
+  await waitUntil(() => findDebugTargetByText("about:debugging", document));
+  const { devtoolsDocument, devtoolsTab } =
+    await openAboutDevtoolsToolbox(document, tab, window);
+
+  const runtimeInfo = devtoolsDocument.querySelector(".qa-runtime-info");
+  const runtimeInfoText = runtimeInfo.textContent;
+  ok(runtimeInfoText.includes(ADB_RUNTIME_NAME), "Name is the ADB runtime name");
+  ok(runtimeInfoText.includes(ADB_VERSION), "Version is the ADB version");
+
+  const runtimeIcon = devtoolsDocument.querySelector(".qa-runtime-icon");
+  is(runtimeIcon.src, FENIX_NIGHTLY_ICON_SRC, "The runtime icon is the Fenix icon");
+
+  info("Wait for all pending requests to settle on the DebuggerClient");
+  await clientWrapper.client.waitForRequestsToSettle();
+
+  await closeAboutDevtoolsToolbox(document, devtoolsTab, window);
+
+  info("Remove USB runtime");
+  mocks.removeUSBRuntime(RUNTIME_ID);
+  mocks.emitUSBUpdate();
+  await waitUntilUsbDeviceIsUnplugged(DEVICE_NAME, document);
+
+  await removeTab(tab);
+  await clientWrapper.close();
+});
+
+async function createLocalClientWrapper() {
+  info("Create a local DebuggerClient");
+  const { DebuggerServer } = require("devtools/server/main");
+  const { DebuggerClient } = require("devtools/shared/client/debugger-client");
+  const { ClientWrapper } =
+    require("devtools/client/aboutdebugging-new/src/modules/client-wrapper");
+
+  DebuggerServer.init();
+  DebuggerServer.registerAllActors();
+  const client = new DebuggerClient(DebuggerServer.connectPipe());
+
+  await client.connect();
+  return new ClientWrapper(client);
+}
--- a/devtools/client/aboutdebugging-new/test/browser/helper-mocks.js
+++ b/devtools/client/aboutdebugging-new/test/browser/helper-mocks.js
@@ -119,44 +119,54 @@ class Mocks {
   }
 
   /**
    * Creates a USB runtime for which a client conenction can be established.
    * @param {String} id
    *        The id of the runtime.
    * @param {Object} optional object used to create the fake runtime & device
    *        - channel: {String} Release channel, for instance "release", "nightly"
+   *        - clientWrapper: {ClientWrapper} optional ClientWrapper for this runtime
    *        - deviceId: {String} Device id
    *        - deviceName: {String} Device name
+   *        - isFenix: {Boolean} set by ADB if the package name matches a Fenix package
    *        - name: {String} Application name, for instance "Firefox"
    *        - shortName: {String} Short name for the device
    *        - socketPath: {String} (should only be used for connecting, so not here)
    *        - version: {String} Version, for instance "63.0a"
+   *        - versionName: {String} Version return by ADB "63.0a"
    * @return {Object} Returns the mock client created for this runtime so that methods
    * can be overridden on it.
    */
   createUSBRuntime(id, runtimeInfo = {}) {
     // Add a new runtime to the list of scanned runtimes.
     this._usbRuntimes.push({
-      id: id,
-      socketPath: runtimeInfo.socketPath || "test/path",
       deviceId: runtimeInfo.deviceId || "test device id",
       deviceName: runtimeInfo.deviceName || "test device name",
+      id: id,
+      isFenix: runtimeInfo.isFenix,
       shortName: runtimeInfo.shortName || "testshort",
+      socketPath: runtimeInfo.socketPath || "test/path",
+      versionName: runtimeInfo.versionName || "1.0",
     });
 
     // Add a valid client that can be returned for this particular runtime id.
-    const mockUsbClient = createClientMock();
-    mockUsbClient.getDeviceDescription = () => {
-      return {
-        channel: runtimeInfo.channel || "release",
-        name: runtimeInfo.name || "TestBrand",
-        version: runtimeInfo.version || "1.0",
+    let mockUsbClient = runtimeInfo.clientWrapper;
+    if (!mockUsbClient) {
+      // If no clientWrapper was provided, create a mock client here.
+      mockUsbClient = createClientMock();
+      mockUsbClient.getDeviceDescription = () => {
+        return {
+          channel: runtimeInfo.channel || "release",
+          name: runtimeInfo.name || "TestBrand",
+          version: runtimeInfo.version || "1.0",
+        };
       };
-    };
+    }
+
     this._clients[RUNTIMES.USB][id] = mockUsbClient;
 
     return mockUsbClient;
   }
 
   removeUSBRuntime(id) {
     this._usbRuntimes = this._usbRuntimes.filter(runtime => runtime.id !== id);
     delete this._clients[RUNTIMES.USB][id];
--- a/devtools/client/framework/components/DebugTargetInfo.js
+++ b/devtools/client/framework/components/DebugTargetInfo.js
@@ -149,19 +149,19 @@ class DebugTargetInfo extends PureCompon
       // setup if about:devtools-toolbox was not opened from about:debugging.
       return null;
     }
 
     const { icon, deviceName } = this.props.debugTargetData.runtimeInfo;
 
     return dom.span(
       {
-        className: "iconized-label",
+        className: "iconized-label qa-runtime-info",
       },
-      dom.img({ src: icon, className: "channel-icon" }),
+      dom.img({ src: icon, className: "channel-icon qa-runtime-icon" }),
       dom.b({ className: "devtools-ellipsis-text" }, this.getRuntimeText()),
       dom.span({ className: "devtools-ellipsis-text" }, deviceName),
     );
   }
 
   renderTarget() {
     const title = this.props.toolbox.target.name;
     const url = this.props.toolbox.target.url;
--- a/devtools/client/framework/test/jest/components/__snapshots__/debug-target-info.test.js.snap
+++ b/devtools/client/framework/test/jest/components/__snapshots__/debug-target-info.test.js.snap
@@ -9,20 +9,20 @@ exports[`DebugTargetInfo component Conne
   >
     <img
       alt="usb icon"
       src="chrome://devtools/skin/images/aboutdebugging-usb-icon.svg"
     />
     toolbox.debugTargetInfo.connection.usb
   </span>
   <span
-    className="iconized-label"
+    className="iconized-label qa-runtime-info"
   >
     <img
-      className="channel-icon"
+      className="channel-icon qa-runtime-icon"
       src="chrome://devtools/skin/images/aboutdebugging-firefox-release.svg"
     />
     <b
       className="devtools-ellipsis-text"
     >
       toolbox.debugTargetInfo.runtimeLabel-usbRuntimeBrandName-1.0.0
     </b>
     <span
@@ -61,20 +61,20 @@ exports[`DebugTargetInfo component Targe
   >
     <img
       alt="usb icon"
       src="chrome://devtools/skin/images/aboutdebugging-usb-icon.svg"
     />
     toolbox.debugTargetInfo.connection.usb
   </span>
   <span
-    className="iconized-label"
+    className="iconized-label qa-runtime-info"
   >
     <img
-      className="channel-icon"
+      className="channel-icon qa-runtime-icon"
       src="chrome://devtools/skin/images/aboutdebugging-firefox-release.svg"
     />
     <b
       className="devtools-ellipsis-text"
     >
       toolbox.debugTargetInfo.runtimeLabel-usbRuntimeBrandName-1.0.0
     </b>
     <span
@@ -113,20 +113,20 @@ exports[`DebugTargetInfo component Targe
   >
     <img
       alt="usb icon"
       src="chrome://devtools/skin/images/aboutdebugging-usb-icon.svg"
     />
     toolbox.debugTargetInfo.connection.usb
   </span>
   <span
-    className="iconized-label"
+    className="iconized-label qa-runtime-info"
   >
     <img
-      className="channel-icon"
+      className="channel-icon qa-runtime-icon"
       src="chrome://devtools/skin/images/aboutdebugging-firefox-release.svg"
     />
     <b
       className="devtools-ellipsis-text"
     >
       toolbox.debugTargetInfo.runtimeLabel-usbRuntimeBrandName-1.0.0
     </b>
     <span
@@ -165,20 +165,20 @@ exports[`DebugTargetInfo component Targe
   >
     <img
       alt="usb icon"
       src="chrome://devtools/skin/images/aboutdebugging-usb-icon.svg"
     />
     toolbox.debugTargetInfo.connection.usb
   </span>
   <span
-    className="iconized-label"
+    className="iconized-label qa-runtime-info"
   >
     <img
-      className="channel-icon"
+      className="channel-icon qa-runtime-icon"
       src="chrome://devtools/skin/images/aboutdebugging-firefox-release.svg"
     />
     <b
       className="devtools-ellipsis-text"
     >
       toolbox.debugTargetInfo.runtimeLabel-usbRuntimeBrandName-1.0.0
     </b>
     <span
@@ -217,20 +217,20 @@ exports[`DebugTargetInfo component Targe
   >
     <img
       alt="usb icon"
       src="chrome://devtools/skin/images/aboutdebugging-usb-icon.svg"
     />
     toolbox.debugTargetInfo.connection.usb
   </span>
   <span
-    className="iconized-label"
+    className="iconized-label qa-runtime-info"
   >
     <img
-      className="channel-icon"
+      className="channel-icon qa-runtime-icon"
       src="chrome://devtools/skin/images/aboutdebugging-firefox-release.svg"
     />
     <b
       className="devtools-ellipsis-text"
     >
       toolbox.debugTargetInfo.runtimeLabel-usbRuntimeBrandName-1.0.0
     </b>
     <span
@@ -260,20 +260,20 @@ exports[`DebugTargetInfo component Targe
 </header>
 `;
 
 exports[`DebugTargetInfo component Target title renders the expected snapshot for This Firefox target 1`] = `
 <header
   className="debug-target-info qa-debug-target-info"
 >
   <span
-    className="iconized-label"
+    className="iconized-label qa-runtime-info"
   >
     <img
-      className="channel-icon"
+      className="channel-icon qa-runtime-icon"
       src="chrome://devtools/skin/images/aboutdebugging-firefox-release.svg"
     />
     <b
       className="devtools-ellipsis-text"
     >
       toolbox.debugTargetInfo.runtimeLabel.thisFirefox-1.0.0
     </b>
     <span
@@ -301,20 +301,20 @@ exports[`DebugTargetInfo component Targe
 </header>
 `;
 
 exports[`DebugTargetInfo component Target title renders the expected snapshot for a Toolbox with an unnamed target 1`] = `
 <header
   className="debug-target-info qa-debug-target-info"
 >
   <span
-    className="iconized-label"
+    className="iconized-label qa-runtime-info"
   >
     <img
-      className="channel-icon"
+      className="channel-icon qa-runtime-icon"
       src="chrome://devtools/skin/images/aboutdebugging-firefox-release.svg"
     />
     <b
       className="devtools-ellipsis-text"
     >
       toolbox.debugTargetInfo.runtimeLabel.thisFirefox-1.0.0
     </b>
     <span
--- a/devtools/client/framework/test/jest/components/debug-target-info.test.js
+++ b/devtools/client/framework/test/jest/components/debug-target-info.test.js
@@ -27,22 +27,24 @@ const findByClassName = (testInstance, c
   });
 };
 
 const TEST_TOOLBOX = {
   target: {
     name: "Test Tab Name",
     url: "http://some.target/url",
   },
+  doc: {},
 };
 
 const TEST_TOOLBOX_NO_NAME = {
   target: {
     url: "http://some.target/without/a/name",
   },
+  doc: {},
 };
 
 const USB_DEVICE_DESCRIPTION = {
   deviceName: "usbDeviceName",
   icon: "chrome://devtools/skin/images/aboutdebugging-firefox-release.svg",
   name: "usbRuntimeBrandName",
   version: "1.0.0",
 };