Bug 1628325 - Disable the Inspect button for zombie tabs in about:debugging r=daisuke,fluent-reviewers,flod
authorJulian Descottes <jdescottes@mozilla.com>
Wed, 03 Jun 2020 12:26:12 +0000
changeset 533839 a7793b023327b42422575d7773b7f24c8e731b8b
parent 533838 1a4de21085f64eae0050f8f6ca326edab4f41ec8
child 533840 cef7c719bb963933e82a403a8dde48a50e25df0c
push id37479
push userapavel@mozilla.com
push dateThu, 04 Jun 2020 15:32:20 +0000
treeherdermozilla-central@0d21bdf3fc01 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersdaisuke, fluent-reviewers, flod
bugs1628325
milestone79.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 1628325 - Disable the Inspect button for zombie tabs in about:debugging r=daisuke,fluent-reviewers,flod Depends on D77497 Differential Revision: https://phabricator.services.mozilla.com/D77498
devtools/client/aboutdebugging/src/components/RuntimePage.js
devtools/client/aboutdebugging/src/components/debugtarget/TabAction.js
devtools/client/aboutdebugging/src/components/debugtarget/moz.build
devtools/client/aboutdebugging/src/middleware/tab-component-data.js
devtools/client/locales/en-US/aboutdebugging.ftl
--- a/devtools/client/aboutdebugging/src/components/RuntimePage.js
+++ b/devtools/client/aboutdebugging/src/components/RuntimePage.js
@@ -43,16 +43,19 @@ const ServiceWorkerAdditionalActions = c
   require("devtools/client/aboutdebugging/src/components/debugtarget/ServiceWorkerAdditionalActions")
 );
 const ServiceWorkersWarning = createFactory(
   require("devtools/client/aboutdebugging/src/components/ServiceWorkersWarning")
 );
 const ProcessDetail = createFactory(
   require("devtools/client/aboutdebugging/src/components/debugtarget/ProcessDetail")
 );
+const TabAction = createFactory(
+  require("devtools/client/aboutdebugging/src/components/debugtarget/TabAction")
+);
 const TabDetail = createFactory(
   require("devtools/client/aboutdebugging/src/components/debugtarget/TabDetail")
 );
 const TemporaryExtensionAdditionalActions = createFactory(
   require("devtools/client/aboutdebugging/src/components/debugtarget/TemporaryExtensionAdditionalActions")
 );
 const TemporaryExtensionDetail = createFactory(
   require("devtools/client/aboutdebugging/src/components/debugtarget/TemporaryExtensionDetail")
@@ -211,17 +214,17 @@ class RuntimePage extends PureComponent 
       RuntimeActions({ dispatch, runtimeId, runtimeDetails }),
       runtimeDetails.serviceWorkersAvailable ? null : ServiceWorkersWarning(),
       CompatibilityWarning({ compatibilityReport }),
       this.renderDebugTargetPane(
         "Tabs",
         this.getIconByType(DEBUG_TARGETS.TAB),
         tabs,
         null,
-        InspectAction,
+        TabAction,
         null,
         TabDetail,
         DEBUG_TARGET_PANE.TAB,
         "about-debugging-runtime-tabs"
       ),
       this.renderDebugTargetPane(
         "Temporary Extensions",
         this.getIconByType(DEBUG_TARGETS.EXTENSION),
new file mode 100644
--- /dev/null
+++ b/devtools/client/aboutdebugging/src/components/debugtarget/TabAction.js
@@ -0,0 +1,52 @@
+/* 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";
+
+const {
+  createFactory,
+  PureComponent,
+} = require("devtools/client/shared/vendor/react");
+const PropTypes = require("devtools/client/shared/vendor/react-prop-types");
+
+const FluentReact = require("devtools/client/shared/vendor/fluent-react");
+const Localized = createFactory(FluentReact.Localized);
+
+const InspectAction = createFactory(
+  require("devtools/client/aboutdebugging/src/components/debugtarget/InspectAction")
+);
+
+const Types = require("devtools/client/aboutdebugging/src/types/index");
+
+/**
+ * This component displays the inspect button for tabs.
+ */
+class TabAction extends PureComponent {
+  static get propTypes() {
+    return {
+      dispatch: PropTypes.func.isRequired,
+      target: Types.debugTarget.isRequired,
+    };
+  }
+
+  render() {
+    const isZombieTab = this.props.target.details.isZombieTab;
+    return Localized(
+      {
+        id: "about-debugging-zombie-tab-inspect-action-disabled",
+        attrs: {
+          // Show an explanatory title only if the action is disabled.
+          title: isZombieTab,
+        },
+      },
+      InspectAction({
+        disabled: isZombieTab,
+        dispatch: this.props.dispatch,
+        target: this.props.target,
+      })
+    );
+  }
+}
+
+module.exports = FluentReact.withLocalization(TabAction);
--- a/devtools/client/aboutdebugging/src/components/debugtarget/moz.build
+++ b/devtools/client/aboutdebugging/src/components/debugtarget/moz.build
@@ -12,16 +12,17 @@ DevToolsModules(
     'ExtensionDetail.js',
     'FieldPair.css',
     'FieldPair.js',
     'InspectAction.js',
     'ProcessDetail.js',
     'ServiceWorkerAction.css',
     'ServiceWorkerAction.js',
     'ServiceWorkerAdditionalActions.js',
+    'TabAction.js',
     'TabDetail.js',
     'TemporaryExtensionAdditionalActions.js',
     'TemporaryExtensionDetail.js',
     'TemporaryExtensionInstaller.js',
     'TemporaryExtensionInstallSection.css',
     'TemporaryExtensionInstallSection.js',
     'WorkerDetail.js',
 )
--- a/devtools/client/aboutdebugging/src/middleware/tab-component-data.js
+++ b/devtools/client/aboutdebugging/src/middleware/tab-component-data.js
@@ -29,22 +29,23 @@ function toComponentData(tabs) {
     const type = DEBUG_TARGETS.TAB;
     const id = tab.outerWindowID;
     const icon = tab.favicon
       ? `data:image/png;base64,${btoa(
           String.fromCharCode.apply(String, tab.favicon)
         )}`
       : "chrome://devtools/skin/images/globe.svg";
     const name = tab.title || tab.url;
-    const url = tab.url;
+    const { url, isZombieTab } = tab;
     return {
       name,
       icon,
       id,
       type,
       details: {
+        isZombieTab,
         url,
       },
     };
   });
 }
 
 module.exports = tabComponentDataMiddleware;
--- a/devtools/client/locales/en-US/aboutdebugging.ftl
+++ b/devtools/client/locales/en-US/aboutdebugging.ftl
@@ -354,16 +354,20 @@ about-debugging-worker-scope =
 # of a worker
 about-debugging-worker-push-service =
   .label = Push Service
 
 # Displayed as title of the inspect button when service worker debugging is disabled.
 about-debugging-worker-inspect-action-disabled =
   .title = Service Worker inspection is currently disabled for multiprocess { -brand-shorter-name }
 
+# Displayed as title of the inspect button for zombie tabs (e.g. tabs loaded via a session restore).
+about-debugging-zombie-tab-inspect-action-disabled =
+  .title = Tab is not fully loaded and cannot be inspected
+
 # Displayed as name for the Main Process debug target in the Processes category. Only for
 # remote runtimes, if `devtools.aboutdebugging.process-debugging` is true.
 about-debugging-main-process-name = Main Process
 
 # Displayed as description for the Main Process debug target in the Processes category.
 # Only for remote browsers, if `devtools.aboutdebugging.process-debugging` is true.
 about-debugging-main-process-description2 = Main Process for the target browser