Bug 1823456 - Enable additional devtools actions for temporarily loaded extensions for Android. r=rpl,jdescottes,devtools-reviewers

Differential Revision: https://phabricator.services.mozilla.com/D173053

devtools/client/aboutdebugging/src/components/RuntimePage.js

@@ -83,7 +83,6 @@ const {
 const {
   isSupportedDebugTargetPane,
   supportsTemporaryExtensionInstaller,
-  supportsTemporaryExtensionAdditionalActions,
 } = require("resource://devtools/client/aboutdebugging/src/modules/debug-target-support.js");
 
 class RuntimePage extends PureComponent {
@@ -227,11 +226,7 @@ class RuntimePage extends PureComponent {
       }),
       this.renderDebugTargetPane({
         actionComponent: InspectAction,
-        additionalActionsComponent: supportsTemporaryExtensionAdditionalActions(
-          runtimeDetails.info.type
-        )
-          ? TemporaryExtensionAdditionalActions
-          : null,
+        additionalActionsComponent: TemporaryExtensionAdditionalActions,
         children: this.renderTemporaryExtensionInstallSection(),
         detailComponent: TemporaryExtensionDetail,
         icon: this.getIconByType(DEBUG_TARGETS.EXTENSION),

devtools/client/aboutdebugging/src/components/debugtarget/TemporaryExtensionAdditionalActions.js

@@ -10,6 +10,9 @@ const {
 } = require("resource://devtools/client/shared/vendor/react.js");
 const dom = require("resource://devtools/client/shared/vendor/react-dom-factories.js");
 const PropTypes = require("resource://devtools/client/shared/vendor/react-prop-types.js");
+const {
+  connect,
+} = require("resource://devtools/client/shared/vendor/react-redux.js");
 
 const FluentReact = require("resource://devtools/client/shared/vendor/fluent-react.js");
 const Localized = createFactory(FluentReact.Localized);
@@ -27,6 +30,13 @@ const {
   MESSAGE_LEVEL,
 } = require("resource://devtools/client/aboutdebugging/src/constants.js");
 
+const {
+  getCurrentRuntimeDetails,
+} = require("resource://devtools/client/aboutdebugging/src/modules/runtimes-state-helper.js");
+const {
+  RUNTIMES,
+} = require("resource://devtools/client/aboutdebugging/src/constants.js");
+
 /**
  * This component provides components that reload/remove temporary extension.
  */
@@ -35,6 +45,8 @@ class TemporaryExtensionAdditionalActions extends PureComponent {
     return {
       dispatch: PropTypes.func.isRequired,
       target: Types.debugTarget.isRequired,
+      // Provided by redux state
+      runtimeDetails: Types.runtimeDetails.isRequired,
     };
   }
 
@@ -132,6 +144,30 @@ class TemporaryExtensionAdditionalActions extends PureComponent {
     );
   }
 
+  renderRemoveButton() {
+    // TODO: Bug 1823457 - Uninstalling an add-on is currently limited to a
+    // local runtime. Once it becomes possible to use the RDP protocol, we can
+    // show this "Remove" button.
+    if (this.props.runtimeDetails.info.type !== RUNTIMES.THIS_FIREFOX) {
+      return null;
+    }
+
+    return Localized(
+      {
+        id: "about-debugging-tmp-extension-remove-button",
+      },
+      dom.button(
+        {
+          className:
+            "default-button default-button--micro " +
+            "qa-temporary-extension-remove-button",
+          onClick: e => this.remove(),
+        },
+        "Remove"
+      )
+    );
+  }
+
   render() {
     return [
       dom.div(
@@ -154,20 +190,7 @@ class TemporaryExtensionAdditionalActions extends PureComponent {
             "Reload"
           )
         ),
-        Localized(
-          {
-            id: "about-debugging-tmp-extension-remove-button",
-          },
-          dom.button(
-            {
-              className:
-                "default-button default-button--micro " +
-                "qa-temporary-extension-remove-button",
-              onClick: e => this.remove(),
-            },
-            "Remove"
-          )
-        )
+        this.renderRemoveButton()
       ),
       this.renderReloadError(),
       this.renderTerminateBackgroundScriptError(),
@@ -175,4 +198,10 @@ class TemporaryExtensionAdditionalActions extends PureComponent {
   }
 }
 
-module.exports = TemporaryExtensionAdditionalActions;
+const mapStateToProps = state => {
+  return {
+    runtimeDetails: getCurrentRuntimeDetails(state.runtimes),
+  };
+};
+
+module.exports = connect(mapStateToProps)(TemporaryExtensionAdditionalActions);

devtools/client/aboutdebugging/src/modules/debug-target-support.js

@@ -95,13 +95,3 @@ function supportsTemporaryExtensionInstaller(runtimeType) {
   return runtimeType === RUNTIMES.THIS_FIREFOX;
 }
 exports.supportsTemporaryExtensionInstaller = supportsTemporaryExtensionInstaller;
-
-/**
- * Check if the given runtimeType supports temporary extension additional
- * actions (e.g. reload and remove, which are currently disallowed on
- * non-local runtimes).
- */
-function supportsTemporaryExtensionAdditionalActions(runtimeType) {
-  return runtimeType === RUNTIMES.THIS_FIREFOX;
-}
-exports.supportsTemporaryExtensionAdditionalActions = supportsTemporaryExtensionAdditionalActions;

devtools/client/aboutdebugging/test/browser/browser_aboutdebugging_addons_remote_runtime.js

@@ -94,14 +94,16 @@ async function testAddonsOnMockedRemoteClient(
     "Temporary Extension target appeared for the remote runtime"
   );
 
+  // TODO: Bug 1823457 - Allow to remove an extension using a non-local runtime.
   const removeButton = temporaryExtensionTarget.querySelector(
     ".qa-temporary-extension-remove-button"
   );
+  ok(!removeButton, "No remove button expected for the temporary extension");
+
   const reloadButton = temporaryExtensionTarget.querySelector(
     ".qa-temporary-extension-reload-button"
   );
-  ok(!removeButton, "No remove button expected for the temporary extension");
-  ok(!reloadButton, "No reload button expected for the temporary extension");
+  ok(reloadButton, "Reload button expected for the temporary extension");
 
   // The goal here is to check that runtimes addons are only updated when the remote
   // runtime is sending addonListChanged events. The reason for this test is because the