Bug 1651630 - Part 2: Hide the debug button instead of disabling it r=jdescottes,fluent-reviewers
authorBelén Albeza <balbeza@mozilla.com>
Thu, 16 Jul 2020 13:41:24 +0000
changeset 541210 f0b1929a924b5ed4aa9904a077900f9a3ec04852
parent 541209 81ecc309914f18f30b2b98f9883929e698584dd8
child 541211 2c12e2fe5b66f420933167a02574771243d4ab33
push id37619
push userapavel@mozilla.com
push dateMon, 20 Jul 2020 21:42:26 +0000
treeherdermozilla-central@2f2cb7c9bcce [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersjdescottes, fluent-reviewers
bugs1651630
milestone80.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 1651630 - Part 2: Hide the debug button instead of disabling it r=jdescottes,fluent-reviewers Differential Revision: https://phabricator.services.mozilla.com/D83484
devtools/client/application/src/components/service-workers/Worker.js
devtools/client/application/test/node/components/service-workers/components_application_panel-Worker.test.js
devtools/client/locales/en-US/application.ftl
--- a/devtools/client/application/src/components/service-workers/Worker.js
+++ b/devtools/client/application/src/components/service-workers/Worker.js
@@ -120,27 +120,26 @@ class Worker extends PureComponent {
   }
 
   formatSource(source) {
     const parts = source.split("/");
     return getUnicodeUrlPath(parts[parts.length - 1]);
   }
 
   renderDebugButton() {
-    const { isDebugEnabled } = this.props;
-
-    const isDisabled = !this.isRunning() || !isDebugEnabled;
+    // avoid rendering the debug button if service worker debugging is disabled
+    if (!this.props.isDebugEnabled) {
+      return null;
+    }
 
-    const localizationId = isDebugEnabled
-      ? "serviceworker-worker-debug"
-      : "serviceworker-worker-debug-forbidden";
+    const isDisabled = !this.isRunning();
 
     return Localized(
       {
-        id: localizationId,
+        id: "serviceworker-worker-debug",
         // The localized title is only displayed if the debug link is disabled.
         attrs: {
           title: isDisabled,
         },
       },
       UIButton({
         onClick: this.debug,
         className: `js-debug-button`,
--- a/devtools/client/application/test/node/components/service-workers/components_application_panel-Worker.test.js
+++ b/devtools/client/application/test/node/components/service-workers/components_application_panel-Worker.test.js
@@ -53,16 +53,18 @@ describe("Worker", () => {
     ).dive();
 
     // ensure proper status
     expect(wrapper.find(".js-worker-status").text()).toBe(
       "serviceworker-worker-status-stopped"
     );
     // check that Start button is available
     expect(wrapper.find(".js-start-button")).toHaveLength(1);
+    // check that Debug button is disabled
+    expect(wrapper.find(".js-debug-button[disabled=true]")).toHaveLength(1);
 
     expect(wrapper).toMatchSnapshot();
   });
 
   it("Renders the start button even if debugging workers is disabled", () => {
     const store = setupStore({});
 
     const wrapper = shallow(
@@ -93,38 +95,38 @@ describe("Worker", () => {
     ).dive();
 
     // ensure proper status
     // NOTE: since non-active status are localized directly in the front, not
     //       in the panel, we don't expect a localization ID here
     expect(wrapper.find(".js-worker-status").text()).toBe("installed");
     // check that Start button is not available
     expect(wrapper.find(".js-start-button")).toHaveLength(0);
+    // check that Debug button is disabled
+    expect(wrapper.find(".js-debug-button[disabled=true]")).toHaveLength(1);
 
     expect(wrapper).toMatchSnapshot();
   });
 
-  it("Enables/disabled the debug button depending of debugging being available", () => {
+  it("Shows/hides the debug button depending of debugging being available", () => {
     const store = setupStore({});
 
     // check disabled debugging
     let wrapper = shallow(
       Worker({
         isDebugEnabled: false,
         worker: WORKER_RUNNING,
         store,
       })
     ).dive();
-
-    expect(wrapper.find(".js-debug-button[disabled=true]")).toHaveLength(1);
+    expect(wrapper.find(".js-debug-button")).toHaveLength(0);
 
     // check enabled debugging
     wrapper = shallow(
       Worker({
         isDebugEnabled: true,
         worker: WORKER_RUNNING,
         store,
       })
     ).dive();
-
-    expect(wrapper.find(".js-debug-button[disabled=false]")).toHaveLength(1);
+    expect(wrapper.find(".js-debug-button")).toHaveLength(1);
   });
 });
--- a/devtools/client/locales/en-US/application.ftl
+++ b/devtools/client/locales/en-US/application.ftl
@@ -21,21 +21,16 @@ serviceworker-list-aboutdebugging = Open
 serviceworker-worker-unregister = Unregister
 
 # Text for the debug link displayed for an already started Service Worker. Clicking on the
 # link opens a new devtools toolbox for this service worker. The title attribute is only
 # displayed when the link is disabled.
 serviceworker-worker-debug = Debug
   .title = Only running service workers can be debugged
 
-# Text for the debug link displayed for an already started Service Worker, when we
-# are in multi e10s mode, which effectively disables this link.
-serviceworker-worker-debug-forbidden = Debug
-  .title = Can only debug service workers if multi e10s is disabled
-
 # Text for the start link displayed for a registered but not running Service Worker.
 # Clicking on the link will attempt to start the service worker.
 serviceworker-worker-start3 = Start
 
 # Text displayed for the updated time of the service worker. The <time> element will
 # display the last update time of the service worker script.
 serviceworker-worker-updated = Updated <time>{ DATETIME($date, month: "long", year: "numeric", day: "numeric", hour: "numeric", minute: "numeric", second: "numeric") }</time>