Bug 1748529 - Show extensions non-persistent background script status changes... (6c2b9571) · Commits · clairehurst / Tor Browser

devtools/client/aboutdebugging/aboutdebugging.css

+1 −0

Original line number	Diff line number	Diff line
		@@ -23,6 +23,7 @@
		@import "chrome://devtools/content/aboutdebugging/src/components/debugtarget/DebugTargetItem.css";
		@import "chrome://devtools/content/aboutdebugging/src/components/debugtarget/DebugTargetList.css";
		@import "chrome://devtools/content/aboutdebugging/src/components/debugtarget/DebugTargetPane.css";
		@import "chrome://devtools/content/aboutdebugging/src/components/debugtarget/ExtensionDetail.css";
		@import "chrome://devtools/content/aboutdebugging/src/components/debugtarget/FieldPair.css";
		@import "chrome://devtools/content/aboutdebugging/src/components/debugtarget/ServiceWorkerAction.css";
		@import "chrome://devtools/content/aboutdebugging/src/components/debugtarget/TemporaryExtensionInstallSection.css";

devtools/client/aboutdebugging/src/components/debugtarget/ExtensionDetail.css

0 → 100644

+27 −0

Original line number	Diff line number	Diff line
		/* 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/. */

		.extension-backgroundscript {
		display: flex;
		column-gap: calc(var(--base-unit) * 2);
		}

		.extension-backgroundscript__status {
		display: flex;
		align-items: center;
		float: inline-end;
		}

		.extension-backgroundscript__status::before {
		background-color: var(--grey-50);
		border-radius: 100%;
		content: "";
		height: calc(var(--base-unit) * 2);
		margin-inline-end: var(--base-unit);
		width: calc(var(--base-unit) * 2);
		}

		.extension-backgroundscript__status--running::before {
		background-color: var(--success-background);
		}

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

+48 −0

Original line number	Diff line number	Diff line
		@@ -30,6 +30,7 @@ const Message = createFactory(
		);

		const {
		EXTENSION_BGSCRIPT_STATUSES,
		MESSAGE_LEVEL,
		RUNTIMES,
		} = require("devtools/client/aboutdebugging/src/constants");
		@@ -164,6 +165,52 @@ class ExtensionDetail extends PureComponent {
		);
		}

		renderBackgroundScriptStatus() {
		// The status of the background script is only relevant if it is
		// not persistent.
		const { persistentBackgroundScript } = this.props.target.details;
		if (!(persistentBackgroundScript === false)) {
		return null;
		}

		const { backgroundScriptStatus } = this.props.target.details;

		let status;
		let statusLocalizationId;
		let statusClassName;

		if (backgroundScriptStatus === EXTENSION_BGSCRIPT_STATUSES.RUNNING) {
		status = `extension-backgroundscript__status--running`;
		statusLocalizationId = `about-debugging-extension-backgroundscript-status-running`;
		statusClassName = `extension-backgroundscript__status--running`;
		} else {
		status = `extension-backgroundscript__status--stopped`;
		statusLocalizationId = `about-debugging-extension-backgroundscript-status-stopped`;
		statusClassName = `extension-backgroundscript__status--stopped`;
		}

		return Localized(
		{
		id: "about-debugging-extension-backgroundscript",
		attrs: { label: true },
		},
		FieldPair({
		label: "Background Script",
		value: Localized(
		{
		id: statusLocalizationId,
		},
		dom.span(
		{
		className: `extension-backgroundscript__status qa-extension-backgroundscript-status ${statusClassName}`,
		},
		status
		)
		),
		})
		);
		}

		render() {
		return dom.section(
		{
		@@ -176,6 +223,7 @@ class ExtensionDetail extends PureComponent {
		this.renderExtensionId(),
		this.renderUUID(),
		this.renderManifest(),
		this.renderBackgroundScriptStatus(),
		this.props.children
		)
		);

devtools/client/aboutdebugging/src/constants.js

+7 −0

Original line number	Diff line number	Diff line
		@@ -27,6 +27,7 @@ const actionTypes = {
		DISCONNECT_RUNTIME_FAILURE: "DISCONNECT_RUNTIME_FAILURE",
		DISCONNECT_RUNTIME_START: "DISCONNECT_RUNTIME_START",
		DISCONNECT_RUNTIME_SUCCESS: "DISCONNECT_RUNTIME_SUCCESS",
		EXTENSION_BGSCRIPT_STATUS_UPDATED: "EXTENSION_BGSCRIPT_STATUS_UPDATED",
		HIDE_PROFILER_DIALOG: "HIDE_PROFILER_DIALOG",
		SWITCH_PROFILER_CONTEXT: "SWITCH_PROFILER_CONTEXT",
		NETWORK_LOCATIONS_UPDATE_FAILURE: "NETWORK_LOCATIONS_UPDATE_FAILURE",
		@@ -151,6 +152,11 @@ const USB_STATES = {
		UPDATING_USB: "UPDATING_USB",
		};

		const EXTENSION_BGSCRIPT_STATUSES = {
		RUNNING: "RUNNING",
		STOPPED: "STOPPED",
		};

		/**
		* These constants reference the performance-new's concept of a PageContext.
		* These are defined in devtools/client/performance-new/@types/perf.d.ts
		@@ -167,6 +173,7 @@ module.exports = Object.assign(
		{
		DEBUG_TARGETS,
		DEBUG_TARGET_PANE,
		EXTENSION_BGSCRIPT_STATUSES,
		ICON_LABEL_LEVEL,
		MESSAGE_LEVEL,
		PAGE_TYPES,

devtools/client/aboutdebugging/src/middleware/debug-target-listener.js

+50 −1

Original line number	Diff line number	Diff line
		@@ -5,11 +5,16 @@
		"use strict";

		const {
		EXTENSION_BGSCRIPT_STATUSES,
		EXTENSION_BGSCRIPT_STATUS_UPDATED,
		UNWATCH_RUNTIME_START,
		WATCH_RUNTIME_SUCCESS,
		} = require("devtools/client/aboutdebugging/src/constants");

		const Actions = require("devtools/client/aboutdebugging/src/actions/index");

		const RootResourceCommand = require("devtools/shared/commands/root-resource/root-resource-command");

		function debugTargetListenerMiddleware(store) {
		const onExtensionsUpdated = () => {
		store.dispatch(Actions.requestExtensions());
		@@ -23,12 +28,43 @@ function debugTargetListenerMiddleware(store) {
		store.dispatch(Actions.requestWorkers());
		};

		return next => action => {
		let rootResourceCommand;

		function onExtensionsBackgroundScriptStatusAvailable(resources) {
		for (const resource of resources) {
		const backgroundScriptStatus = resource.payload.isRunning
		? EXTENSION_BGSCRIPT_STATUSES.RUNNING
		: EXTENSION_BGSCRIPT_STATUSES.STOPPED;

		store.dispatch({
		type: EXTENSION_BGSCRIPT_STATUS_UPDATED,
		id: resource.payload.addonId,
		backgroundScriptStatus,
		});
		}
		}

		return next => async action => {
		switch (action.type) {
		case WATCH_RUNTIME_SUCCESS: {
		const { runtime } = action;
		const { clientWrapper } = runtime.runtimeDetails;

		rootResourceCommand = clientWrapper.createRootResourceCommand();

		// Watch extensions background script status updates.
		await rootResourceCommand
		.watchResources(
		[RootResourceCommand.TYPES.EXTENSIONS_BGSCRIPT_STATUS],
		{ onAvailable: onExtensionsBackgroundScriptStatusAvailable }
		)
		.catch(e => {
		// Log an error if watching this resource rejects (e.g. if
		// the promise was not resolved yet when about:debugging tab
		// or the RDP connection to a remote target has been closed).
		console.error(e);
		});

		// Tabs
		clientWrapper.on("tabListChanged", onTabsUpdated);

		@@ -43,6 +79,19 @@ function debugTargetListenerMiddleware(store) {
		const { runtime } = action;
		const { clientWrapper } = runtime.runtimeDetails;

		// Stop watching extensions background script status updates.
		try {
		rootResourceCommand?.unwatchResources(
		[RootResourceCommand.TYPES.EXTENSIONS_BGSCRIPT_STATUS],
		{ onAvailable: onExtensionsBackgroundScriptStatusAvailable }
		);
		} catch (e) {
		// Log an error if watching this resource rejects (e.g. if
		// the promise was not resolved yet when about:debugging tab
		// or the RDP connection to a remote target has been closed).
		console.error(e);
		}

		// Tabs
		clientWrapper.off("tabListChanged", onTabsUpdated);