chrome-devtools-frontend 1.0.1656897 → 1.0.1657855

package/front_end/entrypoints/formatter_worker/FormatterWorker.ts

@@ -25,9 +25,23 @@ export interface Chunk {
 
 export type ChunkCallback = (arg0: Chunk) => void;
 
-export function createTokenizer(mimeType: string): (
-    arg0: string, arg1: (arg0: string, arg1: string|null, arg2: number, arg3: number) => (Object | undefined | void)) =>
-    void {
+export type TokenizerCallback = (value: string, style: string|null, start: number, end: number) =>
+    Object|undefined|void;
+
+/**
+ * A tokenizer function returned by {@link createTokenizer}.
+ *
+ * @param line The string content to tokenize.
+ * @param callback A callback function invoked for each token parsed.
+ * @param startOffset An optional offset pointing to where tokenization should start within
+ * the line, avoiding the need to allocate substrings when tokenizing a block inside a larger file.
+ */
+export type Tokenizer = (line: string, callback: TokenizerCallback, startOffset?: number) => void;
+
+/**
+ * Creates a tokenizer for the specified MIME type.
+ */
+export function createTokenizer(mimeType: string): Tokenizer {
   const mode = CodeMirror.getMode({indentUnit: 2}, mimeType);
   const state = CodeMirror.startState(mode);
 
@@ -40,8 +54,13 @@ export function createTokenizer(mimeType: string): (
   }
 
   return (line: string,
-          callback: (arg0: string, arg1: string|null, arg2: number, arg3: number) => void|Object|undefined) => {
+          callback: (arg0: string, arg1: string|null, arg2: number, arg3: number) => void|Object|undefined,
+          startOffset = 0) => {
     const stream = new CodeMirror.StringStream(line);
+    if (startOffset) {
+      stream.pos = startOffset;
+      stream.start = startOffset;
+    }
     while (!stream.eol()) {
       const style = mode.token(stream, state);
       const value = stream.current();

package/front_end/entrypoints/formatter_worker/HTMLFormatter.ts

@@ -252,7 +252,7 @@ export class HTMLModel {
 
   #build(text: string): void {
     const tokenizer = createTokenizer('text/html');
-    let baseOffset = 0, lastOffset = 0;
+    let lastOffset = 0;
     let pendingToken: Token|null = null;
 
     const pushToken = (token: Token): Object|undefined => {
@@ -274,8 +274,6 @@ export class HTMLModel {
         tokenStart: number,
         tokenEnd: number,
         ): Object|undefined => {
-      tokenStart += baseOffset;
-      tokenEnd += baseOffset;
       lastOffset = tokenEnd;
 
       const tokenType = type ? new Set<string>(type.split(' ')) : new Set<string>();
@@ -321,8 +319,7 @@ export class HTMLModel {
     };
 
     while (true) {
-      baseOffset = lastOffset;
-      tokenizer(text.substring(lastOffset), processToken);
+      tokenizer(text, processToken, lastOffset);
       if (pendingToken) {
         pushToken(pendingToken);
         pendingToken = null;
@@ -341,7 +338,11 @@ export class HTMLModel {
           lastOffset = text.length;
           break;
         }
-        if (text.substring(lastOffset + 2).toLowerCase().startsWith(element.name)) {
+        // Check if the tag at lastOffset matches the current element name (e.g. </script>).
+        // Slice only the length of the tag name to avoid allocating a large substring
+        // of the remainder of the document.
+        const sliced = text.slice(lastOffset + 2, lastOffset + 2 + element.name.length);
+        if (sliced.toLowerCase() === element.name) {
           break;
         }
         lastOffset += 2;

package/front_end/entrypoints/inspector_main/InspectorMain.ts

@@ -207,12 +207,11 @@ export class NodeIndicator extends UI.Widget.Widget {
   }
 }
 
-let nodeIndicatorProviderInstance: NodeIndicatorProvider;
 export class NodeIndicatorProvider implements UI.Toolbar.Provider {
   #toolbarItem: UI.Toolbar.ToolbarItem;
   #widgetElement: UI.Widget.WidgetElement<NodeIndicator>;
 
-  private constructor() {
+  constructor() {
     this.#widgetElement = document.createElement('devtools-widget') as UI.Widget.WidgetElement<NodeIndicator>;
     new NodeIndicator(this.#widgetElement);
 
@@ -223,15 +222,6 @@ export class NodeIndicatorProvider implements UI.Toolbar.Provider {
   item(): UI.Toolbar.ToolbarItem|null {
     return this.#toolbarItem;
   }
-
-  static instance(opts: {forceNew: boolean|null} = {forceNew: null}): NodeIndicatorProvider {
-    const {forceNew} = opts;
-    if (!nodeIndicatorProviderInstance || forceNew) {
-      nodeIndicatorProviderInstance = new NodeIndicatorProvider();
-    }
-
-    return nodeIndicatorProviderInstance;
-  }
 }
 
 export class SourcesPanelIndicator {

package/front_end/entrypoints/inspector_main/inspector_main-meta.ts

@@ -257,7 +257,7 @@ Common.Settings.registerSettingExtension({
 UI.Toolbar.registerToolbarItem({
   async loadItem() {
     const InspectorMain = await loadInspectorMainModule();
-    return InspectorMain.InspectorMain.NodeIndicatorProvider.instance();
+    return new InspectorMain.InspectorMain.NodeIndicatorProvider();
   },
   order: 2,
   location: UI.Toolbar.ToolbarItemLocation.MAIN_TOOLBAR_LEFT,

package/front_end/entrypoints/main/GlobalAiButton.ts

@@ -38,13 +38,12 @@ const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
 const DELAY_BEFORE_PROMOTION_COLLAPSE_IN_MS = 5000;
 const PROMOTION_END_DATE = new Date('2026-09-30');
 
-function getClickCountSetting(): Common.Settings.Setting<number> {
-  return Common.Settings.Settings.instance().createSetting<number>(
-      'global-ai-button-click-count', 0, Common.Settings.SettingStorageType.SYNCED);
+function getClickCountSetting(settings: Common.Settings.Settings): Common.Settings.Setting<number> {
+  return settings.createSetting<number>('global-ai-button-click-count', 0, Common.Settings.SettingStorageType.SYNCED);
 }
 
-function incrementClickCountSetting(): void {
-  const setting = getClickCountSetting();
+function incrementClickCountSetting(settings: Common.Settings.Settings): void {
+  const setting = getClickCountSetting(settings);
   setting.set(setting.get() + 1);
 }
 
@@ -89,10 +88,19 @@ export class GlobalAiButton extends UI.Widget.Widget {
   #buttonState: GlobalAiButtonState = GlobalAiButtonState.DEFAULT;
   #mouseOnMainToolbar = false;
   #returnToDefaultStateTimeout?: number;
-
-  constructor(element?: HTMLElement, view?: View) {
+  readonly #settings: Common.Settings.Settings;
+  readonly #inspectorView: UI.InspectorView.InspectorView;
+  readonly #viewManager: UI.ViewManager.ViewManager;
+
+  constructor(element?: HTMLElement, view?: View,
+              settings: Common.Settings.Settings = Common.Settings.Settings.instance(),
+              inspectorView: UI.InspectorView.InspectorView = UI.InspectorView.InspectorView.instance(),
+              viewManager: UI.ViewManager.ViewManager = UI.ViewManager.ViewManager.instance()) {
     super(element);
     this.#view = view ?? DEFAULT_VIEW;
+    this.#settings = settings;
+    this.#inspectorView = inspectorView;
+    this.#viewManager = viewManager;
     this.requestUpdate();
 
     if (this.#shouldTriggerPromotion()) {
@@ -118,17 +126,13 @@ export class GlobalAiButton extends UI.Widget.Widget {
   };
 
   #addHoverEventListeners(): void {
-    UI.InspectorView.InspectorView.instance().tabbedPane.headerElement().addEventListener(
-        'mouseenter', this.#handleMainToolbarMouseEnter);
-    UI.InspectorView.InspectorView.instance().tabbedPane.headerElement().addEventListener(
-        'mouseleave', this.#handleMainToolbarMouseLeave);
+    this.#inspectorView.tabbedPane.headerElement().addEventListener('mouseenter', this.#handleMainToolbarMouseEnter);
+    this.#inspectorView.tabbedPane.headerElement().addEventListener('mouseleave', this.#handleMainToolbarMouseLeave);
   }
 
   #removeHoverEventListeners(): void {
-    UI.InspectorView.InspectorView.instance().tabbedPane.headerElement().removeEventListener(
-        'mouseenter', this.#handleMainToolbarMouseEnter);
-    UI.InspectorView.InspectorView.instance().tabbedPane.headerElement().removeEventListener(
-        'mouseleave', this.#handleMainToolbarMouseLeave);
+    this.#inspectorView.tabbedPane.headerElement().removeEventListener('mouseenter', this.#handleMainToolbarMouseEnter);
+    this.#inspectorView.tabbedPane.headerElement().removeEventListener('mouseleave', this.#handleMainToolbarMouseLeave);
   }
 
   // We only want to enable promotion when:
@@ -138,7 +142,7 @@ export class GlobalAiButton extends UI.Widget.Widget {
   #shouldTriggerPromotion(): boolean {
     const isFlagEnabled = Boolean(Root.Runtime.hostConfig.devToolsGlobalAiButton?.promotionEnabled);
     const isBeforeEndDate = (new Date()) < PROMOTION_END_DATE;
-    return isFlagEnabled && isBeforeEndDate && getClickCountSetting().get() < 2;
+    return isFlagEnabled && isBeforeEndDate && getClickCountSetting(this.#settings).get() < 2;
   }
 
   #triggerPromotion(): void {
@@ -173,23 +177,21 @@ export class GlobalAiButton extends UI.Widget.Widget {
   }
 
   #onClick(): void {
-    UI.ViewManager.ViewManager.instance().showViewInLocation('freestyler', 'drawer-view');
-    incrementClickCountSetting();
+    this.#viewManager.showViewInLocation('freestyler', 'drawer-view');
+    incrementClickCountSetting(this.#settings);
 
-    const hasExplicitUserPreference =
-        UI.InspectorView.InspectorView.instance().isUserExplicitlyUpdatedDrawerOrientation();
+    const hasExplicitUserPreference = this.#inspectorView.isUserExplicitlyUpdatedDrawerOrientation();
     const isVerticalDrawerFeatureEnabled =
         Boolean(Root.Runtime.hostConfig.devToolsFlexibleLayout?.verticalDrawerEnabled);
     if (isVerticalDrawerFeatureEnabled && !hasExplicitUserPreference) {
       // This mimics what we're doing while showing the drawer via `ESC`.
       // There is a bug where opening the sidebar directly for the first time,
       // and triggering a drawer rotation without calling `showDrawer({focus: true})` makes the drawer disappear.
-      UI.InspectorView.InspectorView.instance().showDrawer({
+      this.#inspectorView.showDrawer({
         focus: true,
         hasTargetDrawer: false,
       });
-      UI.InspectorView.InspectorView.instance().toggleDrawerOrientation(
-          {force: UI.InspectorView.DrawerOrientation.VERTICAL});
+      this.#inspectorView.toggleDrawerOrientation({force: UI.InspectorView.DrawerOrientation.VERTICAL});
     }
   }
 
@@ -203,14 +205,15 @@ export class GlobalAiButton extends UI.Widget.Widget {
   }
 }
 
-let globalAiButtonToolbarProviderInstance: GlobalAiButtonToolbarProvider;
 export class GlobalAiButtonToolbarProvider implements UI.Toolbar.Provider {
   #toolbarItem: UI.Toolbar.ToolbarItemWithCompactLayout;
   #widgetElement: UI.Widget.WidgetElement<GlobalAiButton>;
 
-  private constructor() {
+  constructor(settings: Common.Settings.Settings = Common.Settings.Settings.instance(),
+              inspectorView: UI.InspectorView.InspectorView = UI.InspectorView.InspectorView.instance(),
+              viewManager: UI.ViewManager.ViewManager = UI.ViewManager.ViewManager.instance()) {
     this.#widgetElement = document.createElement('devtools-widget') as UI.Widget.WidgetElement<GlobalAiButton>;
-    new GlobalAiButton(this.#widgetElement);
+    new GlobalAiButton(this.#widgetElement, undefined, settings, inspectorView, viewManager);
 
     this.#toolbarItem = new UI.Toolbar.ToolbarItemWithCompactLayout(this.#widgetElement);
     this.#toolbarItem.setVisible(false);
@@ -219,13 +222,4 @@ export class GlobalAiButtonToolbarProvider implements UI.Toolbar.Provider {
   item(): UI.Toolbar.ToolbarItem|null {
     return this.#toolbarItem;
   }
-
-  static instance(opts: {forceNew: boolean|null} = {forceNew: null}): GlobalAiButtonToolbarProvider {
-    const {forceNew} = opts;
-    if (!globalAiButtonToolbarProviderInstance || forceNew) {
-      globalAiButtonToolbarProviderInstance = new GlobalAiButtonToolbarProvider();
-    }
-
-    return globalAiButtonToolbarProviderInstance;
-  }
 }

package/front_end/entrypoints/main/MainImpl.ts

@@ -47,7 +47,6 @@ import * as Badges from '../../models/badges/badges.js';
 import * as Bindings from '../../models/bindings/bindings.js';
 import * as CrUXManager from '../../models/crux-manager/crux-manager.js';
 import * as IssuesManager from '../../models/issues_manager/issues_manager.js';
-import * as LiveMetrics from '../../models/live-metrics/live-metrics.js';
 import * as Persistence from '../../models/persistence/persistence.js';
 import * as Workspace from '../../models/workspace/workspace.js';
 import * as PanelCommon from '../../panels/common/common.js';
@@ -158,9 +157,11 @@ export class MainImpl {
   #readyForTestPromise = Promise.withResolvers<void>();
   #veStartPromise!: Promise<void>;
   #universe!: Foundation.Universe.Universe;
+  #supportsEmulation = false;
 
-  constructor() {
+  constructor(opts?: {supportsEmulation: boolean}) {
     MainImpl.instanceForTest = this;
+    this.#supportsEmulation = opts?.supportsEmulation ?? false;
     void this.#loaded();
   }
 
@@ -209,6 +210,7 @@ export class MainImpl {
       },
       hostConfig: Root.Runtime.hostConfig,
       inspectorFrontendHost: Host.InspectorFrontendHost.InspectorFrontendHostInstance,
+      supportsEmulation: this.#supportsEmulation,
     };
     this.#universe = new Foundation.Universe.Universe(creationOptions);
     Root.DevToolsContext.setGlobalInstance(this.#universe.context as Root.DevToolsContext.WritableDevToolsContext);
@@ -469,15 +471,12 @@ export class MainImpl {
     isolatedFileSystemManager.addPlatformFileSystem(
         'snippet://' as Platform.DevToolsPath.UrlString, new Snippets.ScriptSnippetFileSystem.SnippetFileSystem());
 
-    const persistenceImpl = Persistence.Persistence.PersistenceImpl.instance();
-    const linkDecorator = new PanelCommon.PersistenceUtils.LinkDecorator(persistenceImpl);
+    const linkDecorator = new PanelCommon.PersistenceUtils.LinkDecorator(this.#universe.persistence);
     Components.Linkifier.Linkifier.setLinkDecorator(linkDecorator);
-    Persistence.NetworkPersistenceManager.NetworkPersistenceManager.instance(
-        {forceNew: true, workspace: Workspace.Workspace.WorkspaceImpl.instance()});
 
     new ExecutionContextSelector(targetManager, UI.Context.Context.instance());
 
-    LiveMetrics.LiveMetrics.instance();
+    void this.#universe.liveMetrics.enable();
     CrUXManager.CrUXManager.instance();
 
     const builtInAi = AiAssistanceModel.BuiltInAi.BuiltInAi.instance();
@@ -761,8 +760,6 @@ export class SearchActionDelegate implements UI.ActionRegistration.ActionDelegat
     return false;
   }
 }
-let mainMenuItemInstance: MainMenuItem;
-
 export class MainMenuItem implements UI.Toolbar.Provider {
   readonly #item: UI.Toolbar.ToolbarMenuButton;
   constructor() {
@@ -773,17 +770,6 @@ export class MainMenuItem implements UI.Toolbar.Provider {
     this.#item.setTitle(i18nString(UIStrings.customizeAndControlDevtools));
   }
 
-  static instance(opts: {
-    forceNew: boolean|null,
-  } = {forceNew: null}): MainMenuItem {
-    const {forceNew} = opts;
-    if (!mainMenuItemInstance || forceNew) {
-      mainMenuItemInstance = new MainMenuItem();
-    }
-
-    return mainMenuItemInstance;
-  }
-
   item(): UI.Toolbar.ToolbarItem|null {
     return this.#item;
   }
@@ -945,25 +931,12 @@ export class MainMenuItem implements UI.Toolbar.Provider {
   }
 }
 
-let settingsButtonProviderInstance: SettingsButtonProvider;
-
 export class SettingsButtonProvider implements UI.Toolbar.Provider {
   readonly #settingsButton: UI.Toolbar.ToolbarButton;
-  private constructor() {
+  constructor() {
     this.#settingsButton = UI.Toolbar.Toolbar.createActionButton('settings.show');
   }
 
-  static instance(opts: {
-    forceNew: boolean|null,
-  } = {forceNew: null}): SettingsButtonProvider {
-    const {forceNew} = opts;
-    if (!settingsButtonProviderInstance || forceNew) {
-      settingsButtonProviderInstance = new SettingsButtonProvider();
-    }
-
-    return settingsButtonProviderInstance;
-  }
-
   item(): UI.Toolbar.ToolbarItem|null {
     return this.#settingsButton;
   }

package/front_end/entrypoints/main/main-meta.ts

@@ -911,29 +911,29 @@ UI.Toolbar.registerToolbarItem({
     const isPolicyRestricted = config?.aidaAvailability?.blockedByEnterprisePolicy === true;
     return Boolean(isFlagEnabled && !isGeoRestricted && !isPolicyRestricted);
   },
-  async loadItem() {
+  loadItem: Common.Lazy.lazy(async () => {
     const Main = await loadMainModule();
-    return Main.GlobalAiButton.GlobalAiButtonToolbarProvider.instance();
-  },
+    return new Main.GlobalAiButton.GlobalAiButtonToolbarProvider();
+  }) as () => Promise<UI.Toolbar.Provider>,
   order: 98,
   location: UI.Toolbar.ToolbarItemLocation.MAIN_TOOLBAR_RIGHT,
 });
 
 UI.Toolbar.registerToolbarItem({
-  async loadItem() {
+  loadItem: Common.Lazy.lazy(async () => {
     const Main = await loadMainModule();
-    return Main.MainImpl.SettingsButtonProvider.instance();
-  },
+    return new Main.MainImpl.SettingsButtonProvider();
+  }) as () => Promise<UI.Toolbar.Provider>,
   order: 99,
   location: UI.Toolbar.ToolbarItemLocation.MAIN_TOOLBAR_RIGHT,
 });
 
 UI.Toolbar.registerToolbarItem({
   condition: () => !Root.Runtime.Runtime.isTraceApp(),
-  async loadItem() {
+  loadItem: Common.Lazy.lazy(async () => {
     const Main = await loadMainModule();
-    return Main.MainImpl.MainMenuItem.instance();
-  },
+    return new Main.MainImpl.MainMenuItem();
+  }) as () => Promise<UI.Toolbar.Provider>,
   order: 100,
   location: UI.Toolbar.ToolbarItemLocation.MAIN_TOOLBAR_RIGHT,
 });

package/front_end/entrypoints/node_app/app/NodeConnectionsPanel.ts

@@ -15,25 +15,25 @@ import nodeConnectionsPanelStyles from './nodeConnectionsPanel.css.js';
 
 const UIStrings = {
   /**
-   * @description Text in Node Connections Panel of the Sources panel when debugging a Node.js app
+   * @description Text in Node connections panel of the Sources panel when debugging a Node.js app.
    */
   nodejsDebuggingGuide: 'Node.js debugging guide',
   /**
-   * @description Text in Node Connections Panel of the Sources panel when debugging a Node.js app
+   * @description Text in Node connections panel of the Sources panel when debugging a Node.js app.
    * @example {Node.js debugging guide} PH1
    */
   specifyNetworkEndpointAnd:
       'Specify network endpoint and DevTools will connect to it automatically. Read {PH1} to learn more.',
   /**
-   * @description Placeholder text content in Node Connections Panel of the Sources panel when debugging a Node.js app
+   * @description Placeholder text content in Node connections panel of the Sources panel when debugging a Node.js app.
    */
   noConnectionsSpecified: 'No connections specified',
   /**
-   * @description Text of add network target button in Node Connections Panel of the Sources panel when debugging a Node.js app
+   * @description Text of add network target button in Node connections panel of the Sources panel when debugging a Node.js app.
    */
   addConnection: 'Add connection',
   /**
-   * @description Text in Node Connections Panel of the Sources panel when debugging a Node.js app
+   * @description Text in Node connections panel of the Sources panel when debugging a Node.js app.
    */
   networkAddressEgLocalhost: 'Network address (e.g. localhost:9229)',
 } as const;
@@ -95,9 +95,8 @@ export class NodeConnectionsView extends UI.Widget.VBox implements UI.ListWidget
     this.element.classList.add('network-discovery-view');
 
     const networkDiscoveryFooter = this.element.createChild('div', 'network-discovery-footer');
-    const documentationLink = Link.create(
-        'https://nodejs.org/en/docs/inspector/', i18nString(UIStrings.nodejsDebuggingGuide), undefined,
-        'node-js-debugging');
+    const documentationLink = Link.create('https://nodejs.org/learn/getting-started/debugging',
+                                          i18nString(UIStrings.nodejsDebuggingGuide), undefined, 'node-js-debugging');
     networkDiscoveryFooter.appendChild(
         uiI18n.getFormatLocalizedString(str_, UIStrings.specifyNetworkEndpointAnd, {PH1: documentationLink}));
 

package/front_end/entrypoints/node_app/app/NodeMain.ts

@@ -14,16 +14,16 @@ import * as Components from '../../../ui/legacy/components/utils/utils.js';
 
 const UIStrings = {
   /**
-   * @description Text that refers to the main target
+   * @description Text that refers to the main target.
    */
   main: 'Main',
   /**
-   * @description Text in Node Main of the Sources panel when debugging a Node.js app
+   * @description Text in Node main of the Sources panel when debugging a Node.js app.
    * @example {example.com} PH1
    */
   nodejsS: 'Node.js: {PH1}',
   /**
-   * @description Text in DevTools window title when debugging a Node.js app
+   * @description Text in DevTools window title when debugging a Node.js app.
    * @example {example.com} PH1
    */
   NodejsTitleS: 'DevTools - Node.js: {PH1}',

package/front_end/entrypoints/node_app/node_app.ts

@@ -21,31 +21,31 @@ const {NodeMainImpl} = App.NodeMain;
 
 const UIStrings = {
   /**
-   * @description Text that refers to the network connection
+   * @description Text that refers to the network connection.
    */
   connection: 'Connection',
   /**
-   * @description A tag of Node.js Connection Panel that can be searched in the command menu
+   * @description A tag of Node.js connection panel that can be searched in the command menu.
    */
   node: 'node',
   /**
-   * @description Command for showing the Connection tool
+   * @description Command for showing the Connection tool.
    */
   showConnection: 'Show Connection',
   /**
-   * @description Title of the 'Node' tool in the Network Navigator View, which is part of the Sources tool
+   * @description Title of the 'Node' tool in the Network navigator view, which is part of the Sources tool.
    */
   networkTitle: 'Node',
   /**
-   * @description Command for showing the 'Node' tool in the Network Navigator View, which is part of the Sources tool
+   * @description Command for showing the 'Node' tool in the Network navigator view, which is part of the Sources tool.
    */
   showNode: 'Show Node',
   /**
-   * @description Text in Application Panel Sidebar of the Application panel
+   * @description Text in Application panel sidebar of the Application panel.
    */
   application: 'Application',
   /**
-   * @description Command for showing the 'Application' tool
+   * @description Command for showing the Application tool.
    */
   showApplication: 'Show Application',
 } as const;

package/front_end/foundation/Universe.ts

@@ -10,17 +10,21 @@ import * as AutofillManager from '../models/autofill_manager/autofill_manager.js
 import * as Bindings from '../models/bindings/bindings.js';
 import * as Breakpoints from '../models/breakpoints/breakpoints.js';
 import * as CrUXManager from '../models/crux-manager/crux-manager.js';
+import * as Emulation from '../models/emulation/emulation.js';
 import * as JavaScriptMetadata from '../models/javascript_metadata/javascript_metadata.js';
+import * as LiveMetrics from '../models/live-metrics/live-metrics.js';
 import * as Logs from '../models/logs/logs.js';
 import * as Persistence from '../models/persistence/persistence.js';
 import * as ProjectSettings from '../models/project_settings/project_settings.js';
 import * as Workspace from '../models/workspace/workspace.js';
+import * as WorkspaceDiff from '../models/workspace_diff/workspace_diff.js';
 
 export interface CreationOptions {
   settingsCreationOptions: Omit<Common.Settings.SettingsCreationOptions, 'console'>;
   overrideAutoStartModels?: Set<SDK.SDKModel.SDKModelConstructor>;
   hostConfig: Root.Runtime.HostConfig;
   inspectorFrontendHost: Host.InspectorFrontendHostAPI.InspectorFrontendHostAPI;
+  supportsEmulation: boolean;
 }
 
 export class Universe {
@@ -29,6 +33,7 @@ export class Universe {
   //                            directly on the `Universe`.
   readonly context: Root.DevToolsContext.DevToolsContext;
   readonly autofillManager: AutofillManager.AutofillManager.AutofillManager;
+  readonly supportsEmulation: boolean;
 
   constructor(options: CreationOptions) {
     const context = new Root.DevToolsContext.WritableDevToolsContext();
@@ -60,6 +65,14 @@ export class Universe {
     const multitargetNetworkManager = new SDK.NetworkManager.MultitargetNetworkManager(targetManager);
     context.set(SDK.NetworkManager.MultitargetNetworkManager, multitargetNetworkManager);
 
+    this.supportsEmulation = options.supportsEmulation;
+    let deviceModeModel = null;
+    if (options.supportsEmulation) {
+      deviceModeModel =
+          new Emulation.DeviceModeModel.DeviceModeModel(targetManager, settings, multitargetNetworkManager);
+      context.set(Emulation.DeviceModeModel.DeviceModeModel, deviceModeModel);
+    }
+
     const pageResourceLoader =
         new SDK.PageResourceLoader.PageResourceLoader(targetManager, settings, multitargetNetworkManager, null);
     context.set(SDK.PageResourceLoader.PageResourceLoader, pageResourceLoader);
@@ -84,6 +97,14 @@ export class Universe {
     const cruxManager = new CrUXManager.CrUXManager(targetManager, settings);
     context.set(CrUXManager.CrUXManager, cruxManager);
 
+    const isolateManager = new SDK.IsolateManager.IsolateManager(targetManager);
+    context.set(SDK.IsolateManager.IsolateManager, isolateManager);
+    const eventBreakpointsManager = new SDK.EventBreakpointsModel.EventBreakpointsManager(targetManager);
+    context.set(SDK.EventBreakpointsModel.EventBreakpointsManager, eventBreakpointsManager);
+
+    const domModelUndoStack = new SDK.DOMModel.DOMModelUndoStack();
+    context.set(SDK.DOMModel.DOMModelUndoStack, domModelUndoStack);
+
     const workspace = new Workspace.Workspace.WorkspaceImpl();
     context.set(Workspace.Workspace.WorkspaceImpl, workspace);
 
@@ -127,6 +148,13 @@ export class Universe {
     );
     context.set(Persistence.NetworkPersistenceManager.NetworkPersistenceManager, networkPersistenceManager);
 
+    const workspaceDiff = new WorkspaceDiff.WorkspaceDiff.WorkspaceDiffImpl(
+        workspace,
+        persistence,
+        networkPersistenceManager,
+    );
+    context.set(WorkspaceDiff.WorkspaceDiff.WorkspaceDiffImpl, workspaceDiff);
+
     const networkLog = new Logs.NetworkLog.NetworkLog(targetManager, settings);
     context.set(Logs.NetworkLog.NetworkLog, networkLog);
 
@@ -136,6 +164,9 @@ export class Universe {
     const javaScriptMetadata = new JavaScriptMetadata.JavaScriptMetadata.JavaScriptMetadataImpl();
     context.set(JavaScriptMetadata.JavaScriptMetadata.JavaScriptMetadataImpl, javaScriptMetadata);
 
+    const liveMetrics = new LiveMetrics.LiveMetrics(targetManager, deviceModeModel);
+    context.set(LiveMetrics.LiveMetrics, liveMetrics);
+
     this.autofillManager = new AutofillManager.AutofillManager.AutofillManager(targetManager, frameManager);
   }
 
@@ -155,23 +186,43 @@ export class Universe {
   get cpuThrottlingManager(): SDK.CPUThrottlingManager.CPUThrottlingManager {
     return this.context.get(SDK.CPUThrottlingManager.CPUThrottlingManager);
   }
-
   get cruxManager(): CrUXManager.CrUXManager {
     return this.context.get(CrUXManager.CrUXManager);
   }
 
+  // The DeviceModeModel may not be present, as emulation is only present for the `devtools_app` entrypoint, but not for the others.
+  get deviceModeModel(): Emulation.DeviceModeModel.DeviceModeModel|null {
+    return this.supportsEmulation ? this.context.get(Emulation.DeviceModeModel.DeviceModeModel) : null;
+  }
+
   get domDebuggerManager(): SDK.DOMDebuggerModel.DOMDebuggerManager {
     return this.context.get(SDK.DOMDebuggerModel.DOMDebuggerManager);
   }
 
+  get domModelUndoStack(): SDK.DOMModel.DOMModelUndoStack {
+    return this.context.get(SDK.DOMModel.DOMModelUndoStack);
+  }
+
+  get eventBreakpointsManager(): SDK.EventBreakpointsModel.EventBreakpointsManager {
+    return this.context.get(SDK.EventBreakpointsModel.EventBreakpointsManager);
+  }
+
   get isolatedFileSystemManager(): Persistence.IsolatedFileSystemManager.IsolatedFileSystemManager {
     return this.context.get(Persistence.IsolatedFileSystemManager.IsolatedFileSystemManager);
   }
 
+  get isolateManager(): SDK.IsolateManager.IsolateManager {
+    return this.context.get(SDK.IsolateManager.IsolateManager);
+  }
+
   get networkPersistenceManager(): Persistence.NetworkPersistenceManager.NetworkPersistenceManager {
     return this.context.get(Persistence.NetworkPersistenceManager.NetworkPersistenceManager);
   }
 
+  get liveMetrics(): LiveMetrics.LiveMetrics {
+    return this.context.get(LiveMetrics.LiveMetrics);
+  }
+
   get pageResourceLoader(): SDK.PageResourceLoader.PageResourceLoader {
     return this.context.get(SDK.PageResourceLoader.PageResourceLoader);
   }
@@ -191,4 +242,12 @@ export class Universe {
   get targetManager(): SDK.TargetManager.TargetManager {
     return this.context.get(SDK.TargetManager.TargetManager);
   }
+
+  get workspace(): Workspace.Workspace.WorkspaceImpl {
+    return this.context.get(Workspace.Workspace.WorkspaceImpl);
+  }
+
+  get workspaceDiff(): WorkspaceDiff.WorkspaceDiff.WorkspaceDiffImpl {
+    return this.context.get(WorkspaceDiff.WorkspaceDiff.WorkspaceDiffImpl);
+  }
 }

package/front_end/generated/InspectorBackendCommands.ts

@@ -511,7 +511,7 @@ inspectorBackend.registerCommand("DeviceOrientation.setDeviceOrientationOverride
 
 // DigitalCredentials.
 inspectorBackend.registerEnum("DigitalCredentials.VirtualWalletAction", {Respond: "respond", Decline: "decline", Wait: "wait", Clear: "clear"});
-inspectorBackend.registerCommand("DigitalCredentials.setVirtualWalletBehavior", [{"name": "action", "type": "string", "optional": false, "description": "The action of the virtual wallet.", "typeRef": "DigitalCredentials.VirtualWalletAction"}, {"name": "protocol", "type": "string", "optional": true, "description": "The protocol identifier (e.g. \\\"openid4vp\\\"). Required when |action| is \\\"respond\\\", forbidden otherwise.", "typeRef": null}, {"name": "response", "type": "object", "optional": true, "description": "The response data object returned by the wallet. Required when |action| is \\\"respond\\\", forbidden otherwise.", "typeRef": null}], [], "Sets the behavior of the virtual wallet for digital credential requests issued from this frame.");
+inspectorBackend.registerCommand("DigitalCredentials.setVirtualWalletBehavior", [{"name": "action", "type": "string", "optional": false, "description": "The action of the virtual wallet.", "typeRef": "DigitalCredentials.VirtualWalletAction"}, {"name": "protocol", "type": "string", "optional": true, "description": "The protocol identifier (e.g. \\\"openid4vp\\\"). Required when |action| is \\\"respond\\\", forbidden otherwise.", "typeRef": null}, {"name": "response", "type": "object", "optional": true, "description": "The response data object returned by the wallet. Required when |action| is \\\"respond\\\", forbidden otherwise.", "typeRef": null}, {"name": "frameId", "type": "string", "optional": true, "description": "The frame to scope the virtual wallet behavior to.", "typeRef": "Page.FrameId"}], [], "Sets the behavior of the virtual wallet for digital credential requests issued from this frame.");
 
 // Emulation.
 inspectorBackend.registerEnum("Emulation.ScreenOrientationType", {PortraitPrimary: "portraitPrimary", PortraitSecondary: "portraitSecondary", LandscapePrimary: "landscapePrimary", LandscapeSecondary: "landscapeSecondary"});