chrome-devtools-frontend 1.0.1654411 → 1.0.1656897

package/front_end/core/common/Settings.ts

@@ -5,7 +5,7 @@
 import * as Platform from '../platform/platform.js';
 import * as Root from '../root/root.js';
 
-import {Console} from './Console.js';
+import type {Console} from './Console.js';
 import type {EventDescriptor, EventTargetEvent, GenericEvents} from './EventTarget.js';
 import {ObjectWrapper} from './Object.js';
 import {
@@ -30,6 +30,7 @@ export interface SettingsCreationOptions {
   settingRegistrations: SettingRegistration[];
   logSettingAccess?: (name: string, value: number|string|boolean) => Promise<void>;
   runSettingsMigration?: boolean;
+  console: Console;
 }
 
 export class Settings {
@@ -45,10 +46,18 @@ export class Settings {
   #registry = new Map<string, Setting<unknown>>();
   readonly moduleSettings = new Map<string, Setting<unknown>>();
   #logSettingAccess?: (name: string, value: number|string|boolean) => Promise<void>;
-
-  constructor(
-      {syncedStorage, globalStorage, localStorage, settingRegistrations, logSettingAccess, runSettingsMigration}:
-          SettingsCreationOptions) {
+  readonly #console: Console;
+
+  constructor({
+    syncedStorage,
+    globalStorage,
+    localStorage,
+    settingRegistrations,
+    logSettingAccess,
+    runSettingsMigration,
+    console
+  }: SettingsCreationOptions) {
+    this.#console = console;
     this.syncedStorage = syncedStorage;
     this.globalStorage = globalStorage;
     this.localStorage = localStorage;
@@ -93,10 +102,17 @@ export class Settings {
     globalStorage: SettingsStorage|null,
     localStorage: SettingsStorage|null,
     settingRegistrations: SettingRegistration[]|null,
+    console: Console|null,
     logSettingAccess?: (name: string, value: number|string|boolean) => Promise<void>,
     runSettingsMigration?: boolean,
-  } = {forceNew: null, syncedStorage: null, globalStorage: null, localStorage: null, settingRegistrations: null}):
-      Settings {
+  } = {
+    forceNew: null,
+    syncedStorage: null,
+    globalStorage: null,
+    localStorage: null,
+    settingRegistrations: null,
+    console: null
+  }): Settings {
     const {
       forceNew,
       syncedStorage,
@@ -104,10 +120,11 @@ export class Settings {
       localStorage,
       settingRegistrations,
       logSettingAccess,
-      runSettingsMigration
+      runSettingsMigration,
+      console,
     } = opts;
     if (!Root.DevToolsContext.globalInstance().has(Settings) || forceNew) {
-      if (!syncedStorage || !globalStorage || !localStorage || !settingRegistrations) {
+      if (!syncedStorage || !globalStorage || !localStorage || !settingRegistrations || !console) {
         throw new Error(`Unable to create settings: global and local storage must be provided: ${new Error().stack}`);
       }
 
@@ -117,7 +134,8 @@ export class Settings {
                                                   localStorage,
                                                   settingRegistrations,
                                                   logSettingAccess,
-                                                  runSettingsMigration
+                                                  runSettingsMigration,
+                                                  console,
                                                 }));
     }
 
@@ -195,7 +213,7 @@ export class Settings {
     const storage = this.storageFromType(storageType);
     let setting = this.#registry.get(key) as Setting<T>;
     if (!setting) {
-      setting = new Setting(key, defaultValue, this.#eventSupport, storage, this.#logSettingAccess);
+      setting = new Setting(key, defaultValue, this.#eventSupport, storage, this.#console, this.#logSettingAccess);
       this.#registry.set(key, setting);
     }
     return setting;
@@ -208,11 +226,9 @@ export class Settings {
   createRegExpSetting(key: string, defaultValue: string, regexFlags?: string, storageType?: SettingStorageType):
       RegExpSetting {
     if (!this.#registry.get(key)) {
-      this.#registry.set(
-          key,
-          new RegExpSetting(
-              key, defaultValue, this.#eventSupport, this.storageFromType(storageType), regexFlags,
-              this.#logSettingAccess));
+      this.#registry.set(key,
+                         new RegExpSetting(key, defaultValue, this.#eventSupport, this.storageFromType(storageType),
+                                           this.#console, regexFlags, this.#logSettingAccess));
     }
     return this.#registry.get(key) as RegExpSetting;
   }
@@ -324,8 +340,8 @@ export class SettingsStorage {
     return Object.keys(this.object);
   }
 
-  dumpSizes(): void {
-    Console.instance().log('Ten largest settings: ');
+  dumpSizes(commonConsole: Console): void {
+    commonConsole.log('Ten largest settings: ');
     // @ts-expect-error __proto__ optimization
     const sizes: Record<string, number> = {__proto__: null};
     for (const key in this.object) {
@@ -340,7 +356,7 @@ export class SettingsStorage {
     keys.sort(comparator);
 
     for (let i = 0; i < 10 && i < keys.length; ++i) {
-      Console.instance().log('Setting: \'' + keys[i] + '\', size: ' + sizes[keys[i]]);
+      commonConsole.log('Setting: \'' + keys[i] + '\', size: ' + sizes[keys[i]]);
     }
   }
 }
@@ -375,12 +391,13 @@ export class Setting<V> {
   #deprecation: Deprecation|null = null;
   #loggedInitialAccess = false;
   #logSettingAccess?: (name: string, value: number|string|boolean) => Promise<void>;
+  readonly #console: Console;
 
-  constructor(
-      readonly name: string, readonly defaultValue: V, private readonly eventSupport: ObjectWrapper<GenericEvents>,
-      readonly storage: SettingsStorage,
-      logSettingAccess?: (name: string, value: number|string|boolean) => Promise<void>) {
+  constructor(readonly name: string, readonly defaultValue: V,
+              private readonly eventSupport: ObjectWrapper<GenericEvents>, readonly storage: SettingsStorage,
+              console: Console, logSettingAccess?: (name: string, value: number|string|boolean) => Promise<void>) {
     storage.register(this.name);
+    this.#console = console;
     this.#logSettingAccess = logSettingAccess;
   }
 
@@ -532,7 +549,7 @@ export class Setting<V> {
         this.printSettingsSavingError(e.message, settingString);
       }
     } catch (e) {
-      Console.instance().error('Cannot stringify setting with name: ' + this.name + ', error: ' + e.message);
+      this.#console.error('Cannot stringify setting with name: ' + this.name + ', error: ' + e.message);
     }
     this.eventSupport.dispatchEventToListeners(this.name, value);
   }
@@ -623,8 +640,8 @@ export class Setting<V> {
     const errorMessage =
         'Error saving setting with name: ' + this.name + ', value length: ' + value.length + '. Error: ' + message;
     console.error(errorMessage);
-    Console.instance().error(errorMessage);
-    this.storage.dumpSizes();
+    this.#console.error(errorMessage);
+    this.storage.dumpSizes(this.#console);
   }
 }
 
@@ -633,10 +650,10 @@ export class RegExpSetting extends Setting<any> {
   #regexFlags?: string;
   #regex?: RegExp|null;
 
-  constructor(
-      name: string, defaultValue: string, eventSupport: ObjectWrapper<GenericEvents>, storage: SettingsStorage,
-      regexFlags?: string, logSettingAccess?: (name: string, value: number|string|boolean) => Promise<void>) {
-    super(name, defaultValue ? [{pattern: defaultValue}] : [], eventSupport, storage, logSettingAccess);
+  constructor(name: string, defaultValue: string, eventSupport: ObjectWrapper<GenericEvents>, storage: SettingsStorage,
+              console: Console, regexFlags?: string,
+              logSettingAccess?: (name: string, value: number|string|boolean) => Promise<void>) {
+    super(name, defaultValue ? [{pattern: defaultValue}] : [], eventSupport, storage, console, logSettingAccess);
     this.#regexFlags = regexFlags;
   }
 

package/front_end/core/sdk/CPUThrottlingManager.ts

@@ -3,54 +3,22 @@
 // found in the LICENSE file.
 
 import * as Common from '../../core/common/common.js';
-import * as i18n from '../i18n/i18n.js';
 import * as Root from '../root/root.js';
 
 import {EmulationModel} from './EmulationModel.js';
 import {type SDKModelObserver, TargetManager} from './TargetManager.js';
 
-const UIStrings = {
-  /**
-   * @description Text label for a menu item indicating that no throttling is applied.
-   */
-  noThrottling: 'No throttling',
-  /**
-   * @description Text label for a menu item indicating that a specific slowdown multiplier is applied.
-   * @example {2} PH1
-   */
-  dSlowdown: '{PH1}× slowdown',
-  /**
-   * @description Text label for a menu item indicating an average mobile device.
-   */
-  calibratedMidTierMobile: 'Mid-tier mobile',
-  /**
-   * @description Text label for a menu item indicating a below-average mobile device.
-   */
-  calibratedLowTierMobile: 'Low-tier mobile',
-  /**
-   * @description Text label indicating why an option is not available, because the user's device is not fast enough to emulate a device.
-   */
-  calibrationErrorDeviceTooWeak: 'Device is not powerful enough',
-} as const;
-const str_ = i18n.i18n.registerUIStrings('core/sdk/CPUThrottlingManager.ts', UIStrings);
-const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
-const i18nLazyString = i18n.i18n.getLazilyComputedLocalizedString.bind(undefined, str_);
-
 export class CPUThrottlingManager extends Common.ObjectWrapper.ObjectWrapper<EventTypes> implements
     SDKModelObserver<EmulationModel> {
   readonly #targetManager: TargetManager;
-  #cpuThrottlingOption: CPUThrottlingOption;
-  #calibratedThrottlingSetting: Common.Settings.Setting<CalibratedCPUThrottling>;
+  #cpuThrottlingRate: number;
   #hardwareConcurrency?: number;
   #pendingMainTargetPromise?: (r: number) => void;
 
   constructor(settings: Common.Settings.Settings, targetManager: TargetManager) {
     super();
     this.#targetManager = targetManager;
-    this.#cpuThrottlingOption = NoThrottlingOption;
-    this.#calibratedThrottlingSetting = settings.createSetting<CalibratedCPUThrottling>(
-        'calibrated-cpu-throttling', {}, Common.Settings.SettingStorageType.GLOBAL);
-    this.#calibratedThrottlingSetting.addChangeListener(this.#onCalibratedSettingChanged, this);
+    this.#cpuThrottlingRate = 1;  // No throttling
     targetManager.observeModels(EmulationModel, this);
   }
 
@@ -75,43 +43,19 @@ export class CPUThrottlingManager extends Common.ObjectWrapper.ObjectWrapper<Eve
   }
 
   cpuThrottlingRate(): number {
-    return this.#cpuThrottlingOption.rate();
-  }
-
-  cpuThrottlingOption(): CPUThrottlingOption {
-    return this.#cpuThrottlingOption;
-  }
-
-  #onCalibratedSettingChanged(): void {
-    // If a calibrated option is selected, need to propagate new rate.
-    const currentOption = this.#cpuThrottlingOption;
-    if (!currentOption.calibratedDeviceType) {
-      return;
-    }
-
-    const rate = this.#cpuThrottlingOption.rate();
-    if (rate === 0) {
-      // This calibrated option is no longer valid.
-      this.setCPUThrottlingOption(NoThrottlingOption);
-      return;
-    }
-
-    for (const emulationModel of this.#targetManager.models(EmulationModel)) {
-      void emulationModel.setCPUThrottlingRate(rate);
-    }
-    this.dispatchEventToListeners(Events.RATE_CHANGED, rate);
+    return this.#cpuThrottlingRate;
   }
 
-  setCPUThrottlingOption(option: CPUThrottlingOption): void {
-    if (option === this.#cpuThrottlingOption) {
+  setCPUThrottlingRate(rate: number): void {
+    if (rate === this.#cpuThrottlingRate) {
       return;
     }
 
-    this.#cpuThrottlingOption = option;
+    this.#cpuThrottlingRate = rate;
     for (const emulationModel of this.#targetManager.models(EmulationModel)) {
-      void emulationModel.setCPUThrottlingRate(this.#cpuThrottlingOption.rate());
+      void emulationModel.setCPUThrottlingRate(this.#cpuThrottlingRate);
     }
-    this.dispatchEventToListeners(Events.RATE_CHANGED, this.#cpuThrottlingOption.rate());
+    this.dispatchEventToListeners(Events.RATE_CHANGED, this.#cpuThrottlingRate);
   }
 
   setHardwareConcurrency(concurrency: number): void {
@@ -166,8 +110,8 @@ export class CPUThrottlingManager extends Common.ObjectWrapper.ObjectWrapper<Eve
   }
 
   modelAdded(emulationModel: EmulationModel): void {
-    if (this.#cpuThrottlingOption !== NoThrottlingOption) {
-      void emulationModel.setCPUThrottlingRate(this.#cpuThrottlingOption.rate());
+    if (this.#cpuThrottlingRate !== 1) {
+      void emulationModel.setCPUThrottlingRate(this.#cpuThrottlingRate);
     }
     if (this.#hardwareConcurrency !== undefined) {
       void emulationModel.setHardwareConcurrency(this.#hardwareConcurrency);
@@ -195,96 +139,3 @@ export interface EventTypes {
   [Events.RATE_CHANGED]: number;
   [Events.HARDWARE_CONCURRENCY_CHANGED]: number;
 }
-
-export enum CPUThrottlingRates {
-  NO_THROTTLING = 1,
-  MID_TIER_MOBILE = 4,
-  LOW_TIER_MOBILE = 6,
-  EXTRA_SLOW = 20,
-
-  // eslint-disable-next-line @typescript-eslint/naming-convention -- Used by web_tests.
-  MidTierMobile = MID_TIER_MOBILE,
-  // eslint-disable-next-line @typescript-eslint/naming-convention -- Used by web_tests.
-  LowEndMobile = LOW_TIER_MOBILE,
-}
-
-export type CalibratedDeviceType = 'low-tier-mobile'|'mid-tier-mobile';
-
-export interface CPUThrottlingOption {
-  title: () => string;
-  rate: () => number;
-  calibratedDeviceType?: CalibratedDeviceType;
-  jslogContext: string;
-}
-
-function makeFixedPresetThrottlingOption(rate: CPUThrottlingRates): CPUThrottlingOption {
-  return {
-    title: rate === 1 ? i18nLazyString(UIStrings.noThrottling) : i18nLazyString(UIStrings.dSlowdown, {PH1: rate}),
-    rate: () => rate,
-    jslogContext: rate === 1 ? 'cpu-no-throttling' : `cpu-throttled-${rate}`,
-  };
-}
-
-export const NoThrottlingOption = makeFixedPresetThrottlingOption(CPUThrottlingRates.NO_THROTTLING);
-export const MidTierThrottlingOption = makeFixedPresetThrottlingOption(CPUThrottlingRates.MID_TIER_MOBILE);
-export const LowTierThrottlingOption = makeFixedPresetThrottlingOption(CPUThrottlingRates.LOW_TIER_MOBILE);
-export const ExtraSlowThrottlingOption = makeFixedPresetThrottlingOption(CPUThrottlingRates.EXTRA_SLOW);
-
-function makeCalibratedThrottlingOption(calibratedDeviceType: CalibratedDeviceType): CPUThrottlingOption {
-  const getSettingValue = (): number|CalibrationError|null => {
-    const setting = Common.Settings.Settings.instance().createSetting<CalibratedCPUThrottling>(
-        'calibrated-cpu-throttling', {}, Common.Settings.SettingStorageType.GLOBAL);
-    const value = setting.get();
-    if (calibratedDeviceType === 'low-tier-mobile') {
-      return value.low ?? null;
-    }
-    if (calibratedDeviceType === 'mid-tier-mobile') {
-      return value.mid ?? null;
-    }
-    return null;
-  };
-
-  return {
-    title(): string {
-      const typeString = calibratedDeviceType === 'low-tier-mobile' ? i18nString(UIStrings.calibratedLowTierMobile) :
-                                                                      i18nString(UIStrings.calibratedMidTierMobile);
-
-      const value = getSettingValue();
-      if (typeof value === 'number') {
-        return `${typeString} – ${value.toFixed(1)}×`;
-      }
-
-      return typeString;
-    },
-    rate(): number {
-      const value = getSettingValue();
-      if (typeof value === 'number') {
-        return value;
-      }
-      return 0;
-    },
-    calibratedDeviceType,
-    jslogContext: `cpu-throttled-calibrated-${calibratedDeviceType}`,
-  };
-}
-
-export const CalibratedLowTierMobileThrottlingOption = makeCalibratedThrottlingOption('low-tier-mobile');
-export const CalibratedMidTierMobileThrottlingOption = makeCalibratedThrottlingOption('mid-tier-mobile');
-
-export interface CalibratedCPUThrottling {
-  /** Either the CPU multiplier, or an error code for why it could not be determined. */
-  low?: number|CalibrationError;
-  mid?: number|CalibrationError;
-}
-
-export enum CalibrationError {
-  DEVICE_TOO_WEAK = 'DEVICE_TOO_WEAK',
-}
-
-export function calibrationErrorToString(error: CalibrationError): string {
-  if (error === CalibrationError.DEVICE_TOO_WEAK) {
-    return i18nString(UIStrings.calibrationErrorDeviceTooWeak);
-  }
-
-  return error;
-}

package/front_end/core/sdk/ConsoleModel.ts

@@ -71,6 +71,7 @@ const str_ = i18n.i18n.registerUIStrings('core/sdk/ConsoleModel.ts', UIStrings);
 const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
 
 export class ConsoleModel extends SDKModel<EventTypes> {
+  readonly #console: Common.Console.Console;
   #messages: ConsoleMessage[] = [];
   readonly #messagesByTimestamp = new Platform.MapUtilities.Multimap<number, ConsoleMessage>();
   readonly #messageByExceptionId = new Map<RuntimeModel, Map<number, ConsoleMessage>>();
@@ -82,6 +83,7 @@ export class ConsoleModel extends SDKModel<EventTypes> {
 
   constructor(target: Target) {
     super(target);
+    this.#console = target.targetManager().getConsole();
 
     const resourceTreeModel = target.model(ResourceTreeModel);
     if (!resourceTreeModel || resourceTreeModel.cachedResourcesLoaded()) {
@@ -159,7 +161,7 @@ export class ConsoleModel extends SDKModel<EventTypes> {
     if ('error' in result) {
       return;
     }
-    await Common.Console.Console.instance().showPromise();
+    await this.#console.showPromise();
     this.dispatchEventToListeners(
         Events.CommandEvaluated,
         {result: result.object, commandMessage: originatingMessage, exceptionDetails: result.exceptionDetails});
@@ -297,9 +299,9 @@ export class ConsoleModel extends SDKModel<EventTypes> {
     if (settings.moduleSetting('preserve-console-log').get()) {
       const {frame} = event.data;
       if (frame.backForwardCacheDetails.restoredFromCache) {
-        Common.Console.Console.instance().log(i18nString(UIStrings.bfcacheNavigation, {PH1: frame.url}));
+        this.#console.log(i18nString(UIStrings.bfcacheNavigation, {PH1: frame.url}));
       } else {
-        Common.Console.Console.instance().log(i18nString(UIStrings.navigatedToS, {PH1: frame.url}));
+        this.#console.log(i18nString(UIStrings.navigatedToS, {PH1: frame.url}));
       }
     }
   }
@@ -418,6 +420,14 @@ export class ConsoleModel extends SDKModel<EventTypes> {
 
   async saveToTempVariable(currentExecutionContext: ExecutionContext|null, remoteObject: RemoteObject|null):
       Promise<void> {
+    const failedToSave = (result: RemoteObject|null): void => {
+      let message = i18nString(UIStrings.failedToSaveToTempVariable);
+      if (result) {
+        message = (message + ' ' + result.description as Common.UIString.LocalizedString);
+      }
+      this.#console.error(message);
+    };
+
     if (!remoteObject || !currentExecutionContext) {
       failedToSave(null);
       return;
@@ -456,14 +466,6 @@ export class ConsoleModel extends SDKModel<EventTypes> {
       this[name] = value;
       return name;
     }
-
-    function failedToSave(result: RemoteObject|null): void {
-      let message = i18nString(UIStrings.failedToSaveToTempVariable);
-      if (result) {
-        message = (message + ' ' + result.description as Common.UIString.LocalizedString);
-      }
-      Common.Console.Console.instance().error(message);
-    }
   }
 }
 

package/front_end/core/sdk/DOMDebuggerModel.ts

@@ -6,6 +6,7 @@ import type * as ProtocolProxyApi from '../../generated/protocol-proxy-api.js';
 import * as Protocol from '../../generated/protocol.js';
 import type * as Common from '../common/common.js';
 import * as Platform from '../platform/platform.js';
+import * as Root from '../root/root.js';
 
 import {CategorizedBreakpoint, Category} from './CategorizedBreakpoint.js';
 import type {EventListenerPausedDetailsAuxData, Location} from './DebuggerModel.js';
@@ -528,8 +529,6 @@ export class DOMEventListenerBreakpoint extends CategorizedBreakpoint {
   static readonly listener = 'listener:';
 }
 
-let domDebuggerManagerInstance: DOMDebuggerManager;
-
 export class DOMDebuggerManager implements SDKModelObserver<DOMDebuggerModel> {
   readonly #xhrBreakpointsSetting: Common.Settings.Setting<Array<{url: string, enabled: boolean}>>;
   readonly #xhrBreakpoints = new Map<string, boolean>();
@@ -671,11 +670,18 @@ export class DOMDebuggerManager implements SDKModelObserver<DOMDebuggerModel> {
     targetManager?: TargetManager,
   } = {forceNew: null}): DOMDebuggerManager {
     const {forceNew, targetManager} = opts;
-    if (!domDebuggerManagerInstance || forceNew) {
-      domDebuggerManagerInstance = new DOMDebuggerManager(targetManager);
+    if (!Root.DevToolsContext.globalInstance().has(DOMDebuggerManager) || forceNew) {
+      Root.DevToolsContext.globalInstance().set(
+          DOMDebuggerManager,
+          new DOMDebuggerManager(targetManager ?? TargetManager.instance()),
+      );
     }
 
-    return domDebuggerManagerInstance;
+    return Root.DevToolsContext.globalInstance().get(DOMDebuggerManager);
+  }
+
+  static removeInstance(): void {
+    Root.DevToolsContext.globalInstance().delete(DOMDebuggerManager);
   }
 
   cspViolationBreakpoints(): CSPViolationBreakpoint[] {

package/front_end/core/sdk/DOMModel.ts

@@ -40,14 +40,14 @@ import * as Common from '../common/common.js';
 import * as Platform from '../platform/platform.js';
 
 import {CSSModel} from './CSSModel.js';
-import {FrameManager} from './FrameManager.js';
+import type {FrameManager} from './FrameManager.js';
 import {OverlayModel} from './OverlayModel.js';
 import {RemoteObject} from './RemoteObject.js';
 import {Events as ResourceTreeModelEvents, type ResourceTreeFrame, ResourceTreeModel} from './ResourceTreeModel.js';
 import {RuntimeModel} from './RuntimeModel.js';
 import {SDKModel} from './SDKModel.js';
 import {Capability, type Target} from './Target.js';
-import {TargetManager} from './TargetManager.js';
+import type {TargetManager} from './TargetManager.js';
 
 /** Keep this list in sync with https://w3c.github.io/aria/#state_prop_def **/
 export const ARIA_ATTRIBUTES = new Set<string>([
@@ -129,6 +129,7 @@ export interface DOMNodeEventTypes {
 
 export class DOMNode extends Common.ObjectWrapper.ObjectWrapper<DOMNodeEventTypes> {
   #domModel: DOMModel;
+  readonly #frameManager: FrameManager;
   #agent: ProtocolProxyApi.DOMApi;
   ownerDocument!: DOMDocument|null;
   #isInShadowTree!: boolean;
@@ -194,6 +195,7 @@ export class DOMNode extends Common.ObjectWrapper.ObjectWrapper<DOMNodeEventType
   constructor(domModel: DOMModel) {
     super();
     this.#domModel = domModel;
+    this.#frameManager = domModel.target().targetManager().getFrameManager();
     this.#agent = this.#domModel.getAgent();
   }
 
@@ -313,7 +315,7 @@ export class DOMNode extends Common.ObjectWrapper.ObjectWrapper<DOMNodeEventType
   }
 
   private async requestChildDocument(frameId: Protocol.Page.FrameId, notInTarget: Target): Promise<DOMDocument|null> {
-    const frame = await FrameManager.instance().getOrWaitForFrame(frameId, notInTarget);
+    const frame = await this.#frameManager.getOrWaitForFrame(frameId, notInTarget);
     const childModel = frame.resourceTreeModel()?.target().model(DOMModel);
     return await (childModel?.requestDocument() || null);
   }
@@ -341,7 +343,7 @@ export class DOMNode extends Common.ObjectWrapper.ObjectWrapper<DOMNodeEventType
       return undefined;
     }
 
-    const frame = FrameManager.instance().getFrame(this.#frameOwnerFrameId);
+    const frame = this.#frameManager.getFrame(this.#frameOwnerFrameId);
     if (frame && frame.adFrameType() !== Protocol.Page.AdFrameType.None) {
       // The frame is ad-related, but provenance information is unavailable.
       return {};
@@ -1478,7 +1480,7 @@ export class DOMModel extends SDKModel<EventTypes> {
     return this.target().model(OverlayModel) as OverlayModel;
   }
 
-  static cancelSearch(targetManager: TargetManager = TargetManager.instance()): void {
+  static cancelSearch(targetManager: TargetManager): void {
     for (const domModel of targetManager.models(DOMModel)) {
       domModel.cancelSearch();
     }

package/front_end/core/sdk/EventBreakpointsModel.ts

@@ -2,6 +2,7 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
+import * as Root from '../../core/root/root.js';
 import type * as ProtocolProxyApi from '../../generated/protocol-proxy-api.js';
 
 import {CategorizedBreakpoint, Category} from './CategorizedBreakpoint.js';
@@ -83,8 +84,6 @@ class EventListenerBreakpoint extends CategorizedBreakpoint {
   static readonly instrumentationPrefix = 'instrumentation:';
 }
 
-let eventBreakpointManagerInstance: EventBreakpointsManager;
-
 export class EventBreakpointsManager implements SDKModelObserver<EventBreakpointsModel> {
   readonly #eventListenerBreakpoints: EventListenerBreakpoint[] = [];
   readonly #targetManager: TargetManager;
@@ -151,11 +150,16 @@ export class EventBreakpointsManager implements SDKModelObserver<EventBreakpoint
     targetManager?: TargetManager,
   } = {forceNew: null}): EventBreakpointsManager {
     const {forceNew, targetManager} = opts;
-    if (!eventBreakpointManagerInstance || forceNew) {
-      eventBreakpointManagerInstance = new EventBreakpointsManager(targetManager);
+    if (!Root.DevToolsContext.globalInstance().has(EventBreakpointsManager) || forceNew) {
+      Root.DevToolsContext.globalInstance().set(EventBreakpointsManager,
+                                                new EventBreakpointsManager(targetManager ?? TargetManager.instance()));
     }
 
-    return eventBreakpointManagerInstance;
+    return Root.DevToolsContext.globalInstance().get(EventBreakpointsManager);
+  }
+
+  static removeInstance(): void {
+    Root.DevToolsContext.globalInstance().delete(EventBreakpointsManager);
   }
 
   private createInstrumentationBreakpoints(category: Category, instrumentationNames: InstrumentationNames[]): void {

package/front_end/core/sdk/IsolateManager.ts

@@ -3,13 +3,12 @@
 // found in the LICENSE file.
 
 import * as Common from '../common/common.js';
+import * as Root from '../root/root.js';
 
 import type {HeapProfilerModel} from './HeapProfilerModel.js';
 import {RuntimeModel} from './RuntimeModel.js';
 import {type SDKModelObserver, TargetManager} from './TargetManager.js';
 
-let isolateManagerInstance: IsolateManager;
-
 export class IsolateManager extends Common.ObjectWrapper.ObjectWrapper<EventTypes> implements
     SDKModelObserver<RuntimeModel> {
   readonly #isolates = new Map<string, Isolate>();
@@ -28,15 +27,16 @@ export class IsolateManager extends Common.ObjectWrapper.ObjectWrapper<EventType
     this.#targetManager.observeModels(RuntimeModel, this);
   }
 
-  static instance({forceNew, targetManager}: {
+  static instance(opts: {
     forceNew: boolean,
     targetManager?: TargetManager,
   } = {forceNew: false}): IsolateManager {
-    if (!isolateManagerInstance || forceNew) {
-      isolateManagerInstance = new IsolateManager(targetManager);
+    const {forceNew, targetManager} = opts;
+    if (!Root.DevToolsContext.globalInstance().has(IsolateManager) || forceNew) {
+      Root.DevToolsContext.globalInstance().set(IsolateManager, new IsolateManager(targetManager));
     }
 
-    return isolateManagerInstance;
+    return Root.DevToolsContext.globalInstance().get(IsolateManager);
   }
 
   observeIsolates(observer: Observer): void {

package/front_end/core/sdk/ResourceTreeModel.ts

@@ -9,7 +9,7 @@ import * as i18n from '../i18n/i18n.js';
 import * as Platform from '../platform/platform.js';
 
 import {type DeferredDOMNode, DOMModel, type DOMNode} from './DOMModel.js';
-import {FrameManager} from './FrameManager.js';
+import type {FrameManager} from './FrameManager.js';
 import {Events as NetworkManagerEvents, NetworkManager, type RequestUpdateDroppedEventData} from './NetworkManager.js';
 import type {NetworkRequest} from './NetworkRequest.js';
 import {Resource} from './Resource.js';
@@ -25,6 +25,7 @@ export class ResourceTreeModel extends SDKModel<EventTypes> {
   readonly storageAgent: ProtocolProxyApi.StorageApi;
   readonly #securityOriginManager: SecurityOriginManager;
   readonly #storageKeyManager: StorageKeyManager;
+  readonly #frameManager: FrameManager;
   readonly framesInternal = new Map<string, ResourceTreeFrame>();
   #cachedResourcesProcessed = false;
   #pendingReloadOptions: {
@@ -38,6 +39,7 @@ export class ResourceTreeModel extends SDKModel<EventTypes> {
 
   constructor(target: Target) {
     super(target);
+    this.#frameManager = target.targetManager().getFrameManager();
 
     const networkManager = target.model(NetworkManager);
     if (networkManager) {
@@ -216,8 +218,8 @@ export class ResourceTreeModel extends SDKModel<EventTypes> {
     void this.updateStorageKeys();
 
     if (frame.backForwardCacheDetails.restoredFromCache) {
-      FrameManager.instance().modelRemoved(this);
-      FrameManager.instance().modelAdded(this);
+      this.#frameManager.modelRemoved(this);
+      this.#frameManager.modelAdded(this);
       void this.#buildResourceTree();
     }
   }