chrome-devtools-frontend 1.0.1672557 → 1.0.1675430

package/front_end/panels/mobile_throttling/CPUThrottlingSelector.ts

@@ -0,0 +1,313 @@
+// Copyright 2026 The Chromium Authors
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+import * as Common from '../../core/common/common.js';
+import * as i18n from '../../core/i18n/i18n.js';
+import * as SDK from '../../core/sdk/sdk.js';
+import * as CrUXManager from '../../models/crux-manager/crux-manager.js';
+import * as UI from '../../ui/legacy/legacy.js';
+import * as Lit from '../../ui/lit/lit.js';
+import * as VisualLogging from '../../ui/visual_logging/visual_logging.js';
+import * as PanelsCommon from '../common/common.js';
+
+import {throttlingManager} from './ThrottlingManager.js';
+import {ThrottlingPresets} from './ThrottlingPresets.js';
+
+const {render, html, Directives} = Lit;
+
+const UIStrings = {
+  /**
+   * @description Text label for a selection box showing which CPU throttling option is applied.
+   * @example {No throttling} PH1
+   */
+  cpuThrottling: 'CPU throttling: {PH1}',
+  /**
+   * @description Text label for a selection box showing that a specific option is recommended.
+   * @example {4x slowdown} PH1
+   */
+  recommendedThrottling: '{PH1} – recommended',
+  /**
+   * @description Text to prompt the user to run the CPU calibration process.
+   */
+  calibrate: 'Calibrate…',
+  /**
+   * @description Text to prompt the user to re-run the CPU calibration process.
+   */
+  recalibrate: 'Recalibrate…',
+  /**
+   * @description CPU preset option with no throttling.
+   */
+  disabledThrottlingPreset: 'Disabled',
+  /**
+   * @description Default presets category title.
+   */
+  defaultPresets: 'Presets',
+  /**
+   * @description Label shown above a list of CPU calibration preset options.
+   */
+  labelCalibratedPresets: 'Calibrated presets',
+} as const;
+
+const str_ = i18n.i18n.registerUIStrings(
+    'panels/mobile_throttling/CPUThrottlingSelector.ts',
+    UIStrings,
+);
+const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
+
+interface CPUThrottlingGroup {
+  name: string;
+  items: PanelsCommon.CPUThrottlingOption.CPUThrottlingOption[];
+}
+
+interface ViewInput {
+  recommendedOption: PanelsCommon.CPUThrottlingOption.CPUThrottlingOption|null;
+  currentOption: PanelsCommon.CPUThrottlingOption.CPUThrottlingOption;
+  groups: CPUThrottlingGroup[];
+  throttling: PanelsCommon.CPUThrottlingOption.CalibratedCPUThrottling;
+  onSelect: (
+      option: PanelsCommon.CPUThrottlingOption.CPUThrottlingOption,
+      ) => void;
+  onCalibrateClick: () => void;
+}
+
+const optionsMap = new WeakMap<HTMLOptionElement, PanelsCommon.CPUThrottlingOption.CPUThrottlingOption>();
+
+export const DEFAULT_VIEW = (
+    input: ViewInput,
+    _output: undefined,
+    target: HTMLElement,
+    ): void => {
+  const selectionTitle = input.currentOption.title();
+  const hasCalibratedOnce = input.throttling.low || input.throttling.mid;
+  const calibrationLabel = hasCalibratedOnce ? i18nString(UIStrings.recalibrate) : i18nString(UIStrings.calibrate);
+
+  function onSelect(event: Event): void {
+    const element = event.target as HTMLSelectElement | null;
+    if (!element) {
+      return;
+    }
+    const option = element.selectedOptions[0];
+    if (!option) {
+      return;
+    }
+    const condition = optionsMap.get(option);
+    if (condition) {
+      input.onSelect(condition);
+    } else {
+      input.onCalibrateClick();
+      event.consume(true);
+      element.value = String(
+          input.currentOption.calibratedDeviceType ?? input.currentOption.rate(),
+      );
+    }
+  }
+
+  // clang-format off
+  render(
+    html`${input.groups.map(group => {
+      return html` <optgroup
+        label=${group.name}
+        title=${group.name}
+      >
+        ${group.items.map(option => {
+          const title =
+            option === input.recommendedOption
+              ? i18nString(UIStrings.recommendedThrottling, {
+                  PH1: option.title(),
+                })
+              : option.title();
+          const rate = option.rate();
+          return html`
+            <option
+              ${Directives.ref(
+                optionEl =>
+                  optionEl &&
+                  optionsMap.set(optionEl as HTMLOptionElement, option),
+              )}
+              .value=${String(option.calibratedDeviceType ?? rate)}
+              ?selected=${input.currentOption === option}
+              ?disabled=${rate === 0}
+              title=${title}
+              aria-label=${title}
+              jslog=${VisualLogging.item(option.jslogContext).track({
+                click: true,
+              })}
+            >
+              ${title}
+            </option>
+          `;
+        })}
+        ${group.name === i18nString(UIStrings.labelCalibratedPresets)
+          ? html`<option
+              .value=${
+                '-1' /* This won't be displayed unless it has some value. */
+              }
+              title=${calibrationLabel}
+              aria-label=${calibrationLabel}
+              jslog=${VisualLogging.action(
+                'cpu-throttling-selector-calibrate',
+              ).track({click: true})}
+            >
+              ${calibrationLabel}
+            </option>`
+          : Lit.nothing}
+      </optgroup>`;
+    })}`,
+    target,
+    {
+      container: {
+        listeners: {change: onSelect},
+        attributes: {
+          title: i18nString(UIStrings.cpuThrottling, {PH1: selectionTitle}),
+          'aria-label': i18nString(UIStrings.cpuThrottling, {PH1: selectionTitle}),
+          jslog: `${VisualLogging.dropDown('cpu-throttling').track({change: true})}`,
+        },
+      },
+    },
+  );
+  // clang-format on
+};
+
+type View = typeof DEFAULT_VIEW;
+
+export class CPUThrottlingSelector extends UI.Widget.Widget {
+  #currentOption: PanelsCommon.CPUThrottlingOption.CPUThrottlingOption;
+  #recommendedOption: PanelsCommon.CPUThrottlingOption.CPUThrottlingOption|null = null;
+  #groups: CPUThrottlingGroup[] = [];
+  #calibratedThrottlingSetting: Common.Settings.Setting<PanelsCommon.CPUThrottlingOption.CalibratedCPUThrottling>;
+  readonly #view: View;
+  readonly #cpuThrottlingManager = SDK.CPUThrottlingManager.CPUThrottlingManager.instance();
+
+  static createForGlobalConditions(
+      element: HTMLElement,
+      ): CPUThrottlingSelector {
+    const selectElement = element.createChild('select');
+    const select = new CPUThrottlingSelector(selectElement);
+    select.show(element, undefined, /* suppressOrphanWidgetError= */ true);
+    select.performUpdate();
+    return select;
+  }
+
+  constructor(element?: HTMLElement, view: View = DEFAULT_VIEW) {
+    super(element);
+    this.#currentOption = throttlingManager().cpuThrottlingOption();
+    this.#calibratedThrottlingSetting =
+        Common.Settings.Settings.instance().createSetting<PanelsCommon.CPUThrottlingOption.CalibratedCPUThrottling>(
+            'calibrated-cpu-throttling',
+            {},
+            Common.Settings.SettingStorageType.GLOBAL,
+        );
+    this.#resetGroups();
+    this.#view = view;
+    this.performUpdate();
+  }
+
+  set recommendedOption(
+      recommendedOption: PanelsCommon.CPUThrottlingOption.CPUThrottlingOption|null,
+  ) {
+    this.#recommendedOption = recommendedOption;
+    this.requestUpdate();
+  }
+
+  #updateRecommendation = (): void => {
+    let cpuOption: PanelsCommon.CPUThrottlingOption.CPUThrottlingOption =
+        PanelsCommon.CPUThrottlingOption.CalibratedMidTierMobileThrottlingOption;
+    if (cpuOption.rate() === 0) {
+      cpuOption = PanelsCommon.CPUThrottlingOption.MidTierThrottlingOption;
+    }
+    this.recommendedOption = cpuOption;
+  };
+
+  override wasShown(): void {
+    super.wasShown();
+    this.#cpuThrottlingManager.addEventListener(
+        SDK.CPUThrottlingManager.Events.RATE_CHANGED,
+        this.#onOptionChange,
+        this,
+    );
+    this.#calibratedThrottlingSetting.addChangeListener(
+        this.#onCalibratedSettingChanged,
+        this,
+    );
+    CrUXManager.CrUXManager.instance().addEventListener(
+        CrUXManager.Events.FIELD_DATA_CHANGED,
+        this.#updateRecommendation,
+    );
+    this.#updateRecommendation();
+    this.#onOptionChange();
+  }
+
+  override willHide(): void {
+    super.willHide();
+    this.#calibratedThrottlingSetting.removeChangeListener(
+        this.#onCalibratedSettingChanged,
+        this,
+    );
+    this.#cpuThrottlingManager.removeEventListener(
+        SDK.CPUThrottlingManager.Events.RATE_CHANGED,
+        this.#onOptionChange,
+        this,
+    );
+    CrUXManager.CrUXManager.instance().removeEventListener(
+        CrUXManager.Events.FIELD_DATA_CHANGED,
+        this.#updateRecommendation,
+    );
+  }
+
+  #onOptionChange(): void {
+    this.#currentOption = throttlingManager().cpuThrottlingOption();
+    this.requestUpdate();
+  }
+
+  #onCalibratedSettingChanged(): void {
+    this.#resetGroups();
+    this.requestUpdate();
+  }
+
+  #onSelect(
+      option: PanelsCommon.CPUThrottlingOption.CPUThrottlingOption,
+      ): void {
+    throttlingManager().setCPUThrottlingOption(option);
+  }
+
+  #onCalibrateClick(): void {
+    void Common.Revealer.reveal(this.#calibratedThrottlingSetting);
+    this.requestUpdate();
+  }
+
+  #resetGroups(): void {
+    this.#groups = [
+      {
+        name: i18nString(UIStrings.disabledThrottlingPreset),
+        items: ThrottlingPresets.cpuThrottlingPresets.filter(
+            option => option.rate() === 1 && !option.calibratedDeviceType,
+            ),
+      },
+      {
+        name: i18nString(UIStrings.defaultPresets),
+        items: ThrottlingPresets.cpuThrottlingPresets.filter(
+            option => !option.calibratedDeviceType && option.rate() > 1,
+            ),
+      },
+      {
+        name: i18nString(UIStrings.labelCalibratedPresets),
+        items: ThrottlingPresets.cpuThrottlingPresets.filter(
+            option => option.calibratedDeviceType,
+            ),
+      },
+    ];
+  }
+
+  override performUpdate(): void {
+    const input: ViewInput = {
+      recommendedOption: this.#recommendedOption,
+      currentOption: this.#currentOption,
+      groups: this.#groups,
+      throttling: this.#calibratedThrottlingSetting.get(),
+      onSelect: this.#onSelect.bind(this),
+      onCalibrateClick: this.#onCalibrateClick.bind(this),
+    };
+    this.#view(input, undefined, this.contentElement as HTMLSelectElement);
+  }
+}

package/front_end/panels/mobile_throttling/NetworkPanelIndicator.ts

@@ -20,11 +20,6 @@ const UIStrings = {
    * @description Icon title for warning indicator in the Network panel title.
    */
   requestsMayBeBlocked: 'Requests may be blocked. See the Network request blocking panel',
-  /**
-   * @description Title of an icon in the Network panel that indicates that accepted content encodings have been overridden.
-   */
-  acceptedEncodingOverrideSet:
-      'The set of accepted `Content-Encoding` headers has been changed by DevTools. See the Network conditions panel',
 } as const;
 const str_ = i18n.i18n.registerUIStrings('panels/mobile_throttling/NetworkPanelIndicator.ts', UIStrings);
 const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
@@ -41,8 +36,6 @@ export class NetworkPanelIndicator {
         SDK.NetworkManager.MultitargetNetworkManager.Events.BLOCKED_PATTERNS_CHANGED, updateVisibility);
     manager.addEventListener(
         SDK.NetworkManager.MultitargetNetworkManager.Events.INTERCEPTORS_CHANGED, updateVisibility);
-    manager.addEventListener(
-        SDK.NetworkManager.MultitargetNetworkManager.Events.ACCEPTED_ENCODINGS_CHANGED, updateVisibility);
     Common.Settings.Settings.instance().moduleSetting('cache-disabled').addChangeListener(updateVisibility, this);
 
     updateVisibility();
@@ -58,9 +51,6 @@ export class NetworkPanelIndicator {
       if (manager.isBlocking()) {
         warnings.push(i18nString(UIStrings.requestsMayBeBlocked));
       }
-      if (manager.isAcceptedEncodingOverrideSet()) {
-        warnings.push(i18nString(UIStrings.acceptedEncodingOverrideSet));
-      }
       UI.InspectorView.InspectorView.instance().setPanelWarnings('network', warnings);
     }
   }

package/front_end/panels/mobile_throttling/NetworkThrottlingSelector.ts

@@ -10,7 +10,6 @@ import * as CrUXManager from '../../models/crux-manager/crux-manager.js';
 import * as UI from '../../ui/legacy/legacy.js';
 import * as Lit from '../../ui/lit/lit.js';
 import * as VisualLogging from '../../ui/visual_logging/visual_logging.js';
-import * as PanelsCommon from '../common/common.js';
 
 import {ThrottlingManager} from './ThrottlingManager.js';
 import type {NetworkThrottlingConditionsGroup} from './ThrottlingPresets.js';
@@ -84,7 +83,6 @@ export const DEFAULT_VIEW: ViewFunction = (input, output, target) => {
               .item(Platform.StringUtilities.toKebabCase(
                   ('i18nTitleKey' in condition && condition.i18nTitleKey) || title(condition)))
               .track({click: true})}`;
-
   let selectedConditions = input.selectedConditions;
   function onSelect(event: Event): void {
     const element = (event.target as HTMLSelectElement | null);
@@ -95,18 +93,16 @@ export const DEFAULT_VIEW: ViewFunction = (input, output, target) => {
     if (!option) {
       return;
     }
-    if (option === element.options[element.options.length - 1]) {
+    const conditions = optionsMap.get(option);
+    if (conditions) {
+      selectedConditions = conditions;
+      input.onSelect(conditions);
+    } else {
       input.onAddCustomConditions();
       event.consume(true);
       if (selectedConditions) {
         element.value = title(selectedConditions);
       }
-    } else {
-      const conditions = optionsMap.get(option);
-      if (conditions) {
-        selectedConditions = conditions;
-        input.onSelect(conditions);
-      }
     }
   }
 
@@ -167,6 +163,19 @@ export interface EventTypes {
   [Events.CONDITIONS_CHANGED]: SDK.NetworkManager.ThrottlingConditions;
 }
 
+/**
+ * Computes the recommended network throttling preset based on CrUX RTT field
+ * metric data. Returns null if no RTT data is available or no preset matches.
+ */
+export function getRecommendedNetworkConditions(roundTripTimeMetricData?: CrUXManager.MetricResponse):
+    SDK.NetworkManager.Conditions|null {
+  if (roundTripTimeMetricData?.percentiles) {
+    const rtt = Number(roundTripTimeMetricData.percentiles.p75);
+    return SDK.NetworkManager.getRecommendedNetworkPreset(rtt);
+  }
+  return null;
+}
+
 export class NetworkThrottlingSelect extends Common.ObjectWrapper.eventMixin<EventTypes, typeof UI.Widget.Widget>(
     UI.Widget.Widget) {
   readonly #settings: Common.Settings.Settings;
@@ -253,7 +262,9 @@ export class NetworkThrottlingSelect extends Common.ObjectWrapper.eventMixin<Eve
   #updateRecommendation = (): void => {
     const cruxManager = CrUXManager.CrUXManager.instance();
     const roundTripTimeMetricData = cruxManager.getSelectedFieldMetricData('round_trip_time');
-    this.recommendedConditions = PanelsCommon.ThrottlingUtils.getRecommendedNetworkConditions(roundTripTimeMetricData);
+    this.recommendedConditions = getRecommendedNetworkConditions(
+        roundTripTimeMetricData,
+    );
   };
 
   set bindToGlobalConditions(bind: boolean) {

package/front_end/panels/mobile_throttling/ThrottlingManager.ts

@@ -13,13 +13,7 @@ import {html, render} from '../../ui/lit/lit.js';
 import * as VisualLogging from '../../ui/visual_logging/visual_logging.js';
 import * as PanelsCommon from '../common/common.js';
 
-import {MobileThrottlingSelector} from './MobileThrottlingSelector.js';
-import {
-  type Conditions,
-  type ConditionsList,
-  type MobileThrottlingConditionsGroup,
-  ThrottlingPresets,
-} from './ThrottlingPresets.js';
+import {ThrottlingPresets} from './ThrottlingPresets.js';
 
 export interface CPUThrottlingSelectorWrapper {
   control: UI.Toolbar.ToolbarComboBox;
@@ -35,10 +29,6 @@ const UIStrings = {
    * @description Text in throttling manager of the Network panel.
    */
   forceDisconnectedFromNetwork: 'Force disconnected from network',
-  /**
-   * @description Text for throttling the network.
-   */
-  throttling: 'Throttling',
   /**
    * @description Icon title in throttling manager of the Network panel.
    */
@@ -206,53 +196,6 @@ export class ThrottlingManager extends Common.ObjectWrapper.ObjectWrapper<Thrott
     return checkbox;
   }
 
-  createMobileThrottlingButton(): UI.Toolbar.ToolbarMenuButton {
-    const button = new UI.Toolbar.ToolbarMenuButton(appendItems, undefined, undefined, 'mobile-throttling');
-    button.setTitle(i18nString(UIStrings.throttling));
-    button.setDarkText();
-
-    let options: ConditionsList = [];
-    let selectedIndex = -1;
-    const selector = new MobileThrottlingSelector(populate, select);
-    return button;
-
-    function appendItems(contextMenu: UI.ContextMenu.ContextMenu): void {
-      for (let index = 0; index < options.length; ++index) {
-        const conditions = options[index];
-        if (!conditions) {
-          continue;
-        }
-        if (conditions.title === ThrottlingPresets.getCustomConditions().title &&
-            conditions.description === ThrottlingPresets.getCustomConditions().description) {
-          continue;
-        }
-        contextMenu.defaultSection().appendCheckboxItem(
-            conditions.title, selector.optionSelected.bind(selector, conditions as Conditions),
-            {checked: selectedIndex === index, jslogContext: conditions.jslogContext});
-      }
-    }
-
-    function populate(groups: MobileThrottlingConditionsGroup[]): ConditionsList {
-      options = [];
-      for (const group of groups) {
-        for (const conditions of group.items) {
-          options.push(conditions);
-        }
-        options.push(null);
-      }
-      return options;
-    }
-
-    function select(index: number): void {
-      selectedIndex = index;
-      const option = options[index];
-      if (option) {
-        button.setText(option.title);
-        button.setTitle(`${option.title}: ${option.description}`);
-      }
-    }
-  }
-
   private updatePanelIcon(): void {
     const warnings = [];
     if (this.cpuThrottlingManager.cpuThrottlingRate() !==

package/front_end/panels/mobile_throttling/mobile_throttling.ts

@@ -2,14 +2,7 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-import './ThrottlingPresets.js';
-import './MobileThrottlingSelector.js';
-import './NetworkPanelIndicator.js';
-import './NetworkThrottlingSelector.js';
-import './ThrottlingSettingsTab.js';
-import './ThrottlingManager.js';
-
-import * as MobileThrottlingSelector from './MobileThrottlingSelector.js';
+import * as CPUThrottlingSelector from './CPUThrottlingSelector.js';
 import * as NetworkPanelIndicator from './NetworkPanelIndicator.js';
 import * as NetworkThrottlingSelector from './NetworkThrottlingSelector.js';
 import * as ThrottlingManager from './ThrottlingManager.js';
@@ -17,7 +10,7 @@ import * as ThrottlingPresets from './ThrottlingPresets.js';
 import * as ThrottlingSettingsTab from './ThrottlingSettingsTab.js';
 
 export {
-  MobileThrottlingSelector,
+  CPUThrottlingSelector,
   NetworkPanelIndicator,
   NetworkThrottlingSelector,
   ThrottlingManager,

package/front_end/panels/network/NetworkConfigView.ts

@@ -7,7 +7,7 @@ import * as Common from '../../core/common/common.js';
 import * as i18n from '../../core/i18n/i18n.js';
 import * as Platform from '../../core/platform/platform.js';
 import * as SDK from '../../core/sdk/sdk.js';
-import * as Protocol from '../../generated/protocol.js';
+import type * as Protocol from '../../generated/protocol.js';
 import * as SettingsUI from '../../ui/legacy/components/settings_ui/settings_ui.js';
 import * as UI from '../../ui/legacy/legacy.js';
 import * as VisualLogging from '../../ui/visual_logging/visual_logging.js';
@@ -49,11 +49,6 @@ const UIStrings = {
    * @description User agent setting in the network conditions panel to use the browser's default value.
    */
   selectAutomatically: 'Use browser default',
-  /**
-   * @description Title of a section in the Network conditions panel that includes
-   * a set of checkboxes to override the content encodings supported by the browser.
-   */
-  acceptedEncoding: 'Accepted `Content-Encoding`s',
   /**
    * @description Status text displayed after updating user agent client hints.
    */
@@ -83,8 +78,6 @@ export class NetworkConfigView extends UI.Widget.VBox {
     this.createNetworkThrottlingSection();
     this.contentElement.createChild('div').classList.add('panel-section-separator');
     this.createUserAgentSection();
-    this.contentElement.createChild('div').classList.add('panel-section-separator');
-    this.createAcceptedEncodingSection();
   }
 
   static instance(opts: {
@@ -301,69 +294,6 @@ export class NetworkConfigView extends UI.Widget.VBox {
     }
   }
 
-  private createAcceptedEncodingSection(): void {
-    const useCustomAcceptedEncodingSetting =
-        Common.Settings.Settings.instance().createSetting('use-custom-accepted-encodings', false);
-    const customAcceptedEncodingSetting = Common.Settings.Settings.instance().createSetting(
-        'custom-accepted-encodings',
-        `${Protocol.Network.ContentEncoding.Gzip},${Protocol.Network.ContentEncoding.Br},${
-            Protocol.Network.ContentEncoding.Deflate}`);
-
-    const title = i18nString(UIStrings.acceptedEncoding);
-    const section = this.createSection(title, 'network-config-accepted-encoding');
-    const autoCheckbox = UI.UIUtils.CheckboxLabel.create(
-        i18nString(UIStrings.selectAutomatically), true, undefined, useCustomAcceptedEncodingSetting.name);
-    section.appendChild(autoCheckbox);
-
-    function onSettingChange(): void {
-      if (!useCustomAcceptedEncodingSetting.get()) {
-        SDK.NetworkManager.MultitargetNetworkManager.instance().clearCustomAcceptedEncodingsOverride();
-      } else {
-        SDK.NetworkManager.MultitargetNetworkManager.instance().setCustomAcceptedEncodingsOverride(
-            customAcceptedEncodingSetting.get() === '' ?
-                [] :
-                customAcceptedEncodingSetting.get().split(',') as Protocol.Network.ContentEncoding[]);
-      }
-    }
-
-    customAcceptedEncodingSetting.addChangeListener(onSettingChange);
-    useCustomAcceptedEncodingSetting.addChangeListener(onSettingChange);
-
-    const encodingsSection = section.createChild('div', 'network-config-accepted-encoding-custom');
-    encodingsSection.setAttribute('jslog', `${VisualLogging.section().context(customAcceptedEncodingSetting.name)}`);
-    autoCheckbox.checked = !useCustomAcceptedEncodingSetting.get();
-    autoCheckbox.addEventListener('change', acceptedEncodingsChanged);
-    const checkboxes = new Map<Protocol.Network.ContentEncoding, UI.UIUtils.CheckboxLabel>();
-    const contentEncodings: Protocol.EnumerableEnum<typeof Protocol.Network.ContentEncoding> = {
-      Deflate: Protocol.Network.ContentEncoding.Deflate,
-      Gzip: Protocol.Network.ContentEncoding.Gzip,
-      Br: Protocol.Network.ContentEncoding.Br,
-      Zstd: Protocol.Network.ContentEncoding.Zstd,
-    };
-    for (const encoding of Object.values(contentEncodings)) {
-      const checkbox = UI.UIUtils.CheckboxLabel.createWithStringLiteral(encoding, true, encoding);
-      encodingsSection.appendChild(checkbox);
-      checkboxes.set(encoding, checkbox);
-    }
-    for (const [encoding, checkbox] of checkboxes) {
-      checkbox.checked = customAcceptedEncodingSetting.get().includes(encoding);
-      checkbox.addEventListener('change', acceptedEncodingsChanged);
-    }
-
-    acceptedEncodingsChanged();
-
-    function acceptedEncodingsChanged(): void {
-      useCustomAcceptedEncodingSetting.set(!autoCheckbox.checked);
-      const encodings = [];
-      for (const [encoding, checkbox] of checkboxes) {
-        checkbox.disabled = autoCheckbox.checked;
-        if (checkbox.checked) {
-          encodings.push(encoding);
-        }
-      }
-      customAcceptedEncodingSetting.set(encodings.join(','));
-    }
-  }
   override wasShown(): void {
     super.wasShown();
     UI.ARIAUtils.LiveAnnouncer.alert(i18nString(UIStrings.networkConditionsPanelShown));

package/front_end/panels/network/networkConfigView.css

@@ -26,8 +26,7 @@
   flex: 2 0 200px;
 }
 
-.network-config-fields span:first-of-type,
-.network-config-fields .network-config-accepted-encoding-custom {
+.network-config-fields span:first-of-type {
   padding: 3px 0;
 }
 

package/front_end/panels/profiler/HeapDetachedElementsDataGrid.ts

@@ -14,15 +14,15 @@ const {widget} = UI.Widget;
 
 const UIStrings = {
   /**
-   * @description Text in Heap Snapshot View of a profiler tool
+   * @description Column header in detached elements table displaying detached DOM nodes.
    */
   detachedNodes: 'Detached nodes',
   /**
-   * @description Text in Heap Snapshot View of a profiler tool
+   * @description Column header in detached elements table displaying the number of detached DOM nodes.
    */
   nodeSize: 'Node count',
   /**
-   * @description Label for the detached elements table
+   * @description Label for the detached elements table.
    */
   detachedElementsList: 'Detached elements list',
 } as const;

package/front_end/panels/profiler/HeapDetachedElementsView.ts

@@ -21,19 +21,19 @@ import {WritableProfileHeader} from './WritableProfileHeader.js';
 
 const UIStrings = {
   /**
-   * @description Button text to obtain the detached elements retained by JS
+   * @description Button text to get the detached elements retained by JavaScript.
    */
-  startDetachedElements: 'Obtain detached elements',
+  startDetachedElements: 'Get detached elements',
   /**
    * @description The title for the collection of profiles that are gathered from various snapshots of the heap, using a sampling (e.g. every 1/100) technique.
    */
   detachedElementsTitle: 'Detached elements',
   /**
-   * @description Description in Heap Profile View of a profiler tool
+   * @description Description for the detached elements profiling option in the Memory panel.
    */
-  detachedElementsDescription: 'Detached elements shows objects that are retained by a JS reference.',
+  detachedElementsDescription: 'Detached elements show objects retained by a JS reference.',
   /**
-   * @description Name of a profile
+   * @description Name of a profile.
    * @example {2} PH1
    */
   detachedElementProfile: 'Detached elements {PH1}',