--- a/devtools/client/aboutdebugging-new/src/components/DebugTargetsPane.js
+++ b/devtools/client/aboutdebugging-new/src/components/DebugTargetsPane.js
@@ -129,51 +129,57 @@ class DebugTargetsPane extends PureCompo
         className: "debug-targets-pane",
       },
       RuntimeInfo({ info }),
       DebugTargetList({
         className: "debug-target-list--temporary-extensions",
         debugTargetItemComponent: ExtensionItem,
         debugTargets: temporaryExtensions,
         headerComponent: TemporaryExtensionInstaller,
+        preference: "devtools.aboutdebugging.expand-temporaryExtensions",
         runtime,
         title: "Temporary Extensions",
       }),
       DebugTargetList({
         className: "debug-target-list--installed-extensions",
         debugTargetItemComponent: ExtensionItem,
         debugTargets: installedExtensions,
+        preference: "devtools.aboutdebugging.expand-installedExtensions",
         runtime,
         title: "Extensions",
       }),
       DebugTargetList({
         className: "debug-target-list--tabs",
         debugTargetItemComponent: TabItem,
         debugTargets: tabs,
+        preference: "devtools.aboutdebugging.expand-tabs",
         runtime,
         title: "Tabs",
       }),
       DebugTargetList({
         className: "debug-target-list--service-workers",
         debugTargetItemComponent: ServiceWorkerItem,
         debugTargets: serviceWorkers,
+        preference: "devtools.aboutdebugging.expand-serviceWorkers",
         runtime,
         title: "Service Workers",
       }),
       DebugTargetList({
         className: "debug-target-list--shared-workers",
         debugTargetItemComponent: WorkerItem,
         debugTargets: sharedWorkers,
+        preference: "devtools.aboutdebugging.expand-sharedWorkers",
         runtime,
         title: "Shared Workers",
       }),
       DebugTargetList({
         className: "debug-target-list--other-workers",
         debugTargetItemComponent: WorkerItem,
         debugTargets: otherWorkers,
+        preference: "devtools.aboutdebugging.expand-otherWorkers",
         runtime,
         title: "Other Workers",
       })
     );
   }
 }
 
 module.exports = DebugTargetsPane;

--- a/devtools/client/aboutdebugging-new/src/components/debugtarget/DebugTargetList.css
+++ b/devtools/client/aboutdebugging-new/src/components/debugtarget/DebugTargetList.css
@@ -2,15 +2,41 @@
  * 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/. */
 
 .debug-target-list {
   margin-block-end: 30px;
 }
 
 .debug-target-list__title {
+  align-items: center;
+  cursor: pointer;
+  display: flex;
   margin-block-start: 10px;
   margin-block-end: 10px;
 }
 
+.debug-target-list__title::before {
+  background-image: url(chrome://devtools/skin/images/play.svg);
+  background-position: center;
+  background-repeat: no-repeat;
+  background-size: contain;
+  content: "";
+  display: inline-block;
+  fill: currentColor;
+  height: 1em;
+  margin-inline-end: 0.5em;
+  transform: rotate(90deg);
+  width: 1em;
+  -moz-context-properties: fill;
+}
+
 .debug-target-list__ul {
   margin-inline-start: 60px;
 }
+
+.debug-target-list--collapse :not(.debug-target-list__title) {
+  display: none;
+}
+
+.debug-target-list__title--collapse::before {
+  transform: none;
+}

--- a/devtools/client/aboutdebugging-new/src/components/debugtarget/DebugTargetList.js
+++ b/devtools/client/aboutdebugging-new/src/components/debugtarget/DebugTargetList.js
@@ -1,49 +1,79 @@
 /* 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 Services = require("Services");
+
 const { PureComponent } = require("devtools/client/shared/vendor/react");
 const dom = require("devtools/client/shared/vendor/react-dom-factories");
 const PropTypes = require("devtools/client/shared/vendor/react-prop-types");
 
 const Runtime = require("../../runtimes/runtime");
 
 class DebugTargetList extends PureComponent {
   static get propTypes() {
     return {
       className: PropTypes.string.isRequired,
       debugTargetItemComponent: PropTypes.any.isRequired,
       debugTargets: PropTypes.arrayOf(PropTypes.object).isRequired,
+      preference: PropTypes.string.isRequired,
       headerComponent: PropTypes.any,
       runtime: PropTypes.instanceOf(Runtime).isRequired,
       title: PropTypes.string.isRequired,
     };
   }
 
+  constructor(props) {
+    super(props);
+
+    this.onPreferenceUpdated = this.onPreferenceUpdated.bind(this);
+
+    this.state = {
+      isExpanded: Services.prefs.getBoolPref(props.preference, true),
+    };
+    Services.prefs.addObserver(props.preference, this.onPreferenceUpdated);
+  }
+
+  onPreferenceUpdated() {
+    const { preference } = this.props;
+    const isExpanded = Services.prefs.getBoolPref(preference, true);
+    this.setState({ isExpanded });
+  }
+
+  toggleExpandCollapse() {
+    const { preference } = this.props;
+    const isExpanded = Services.prefs.getBoolPref(preference);
+    Services.prefs.setBoolPref(preference, !isExpanded);
+  }
+
   render() {
     const {
       className,
       debugTargetItemComponent,
       debugTargets,
       headerComponent,
       runtime,
       title,
     } = this.props;
+    const { isExpanded } = this.state;
 
     return dom.div(
       {
-        className: `debug-target-list ${ className }`,
+        className: `debug-target-list ${ className }` +
+                   (isExpanded ? "" : " debug-target-list--collapse"),
       },
       dom.h2(
         {
-          className: `debug-target-list__title ${ className }__title`,
+          className: `debug-target-list__title ${ className }__title` +
+                     (isExpanded ? "" : " debug-target-list__title--collapse"),
+          onClick: e => this.toggleExpandCollapse(),
         },
         title
       ),
       headerComponent ? headerComponent({ runtime }) : null,
       dom.ul(
         {
           className: `debug-target-list__ul ${ className }__ul`,
         },

--- a/devtools/client/preferences/devtools-client.js
+++ b/devtools/client/preferences/devtools-client.js
@@ -313,8 +313,16 @@ pref("devtools.editor.autocomplete", tru
 pref("devtools.responsive.reloadConditions.touchSimulation", false);
 // Whether to reload when user agent is changed
 pref("devtools.responsive.reloadConditions.userAgent", false);
 // Whether to show the notification about reloading to apply emulation
 pref("devtools.responsive.reloadNotification.enabled", true);
 
 // Enable new about:debugging.
 pref("devtools.aboutdebugging.new-enabled", false);
+
+// Expand/Collapse state for debug target list.
+pref("devtools.aboutdebugging.expand-temporaryExtensions", true);
+pref("devtools.aboutdebugging.expand-installedExtensions", true);
+pref("devtools.aboutdebugging.expand-tabs", true);
+pref("devtools.aboutdebugging.expand-serviceWorkers", true);
+pref("devtools.aboutdebugging.expand-sharedWorkers", true);
+pref("devtools.aboutdebugging.expand-otherWorkers", true);