chrome-devtools-frontend 1.0.956881 → 1.0.958475

package/front_end/models/persistence/PersistenceImpl.ts

@@ -3,6 +3,7 @@
 // found in the LICENSE file.
 
 import * as Common from '../../core/common/common.js';
+import * as Host from '../../core/host/host.js';
 import * as Platform from '../../core/platform/platform.js';
 import * as SDK from '../../core/sdk/sdk.js';
 import * as Components from '../../ui/legacy/components/utils/utils.js';
@@ -18,7 +19,7 @@ let persistenceInstance: PersistenceImpl;
 export class PersistenceImpl extends Common.ObjectWrapper.ObjectWrapper<EventTypes> {
   private readonly workspace: Workspace.Workspace.WorkspaceImpl;
   private readonly breakpointManager: Bindings.BreakpointManager.BreakpointManager;
-  private readonly filePathPrefixesToBindingCount: Map<string, number>;
+  private readonly filePathPrefixesToBindingCount: FilePathPrefixesBindingCounts;
   private subscribedBindingEventListeners:
       Platform.MapUtilities.Multimap<Workspace.UISourceCode.UISourceCode, () => void>;
   private readonly mapping: Automapping;
@@ -28,7 +29,7 @@ export class PersistenceImpl extends Common.ObjectWrapper.ObjectWrapper<EventTyp
     super();
     this.workspace = workspace;
     this.breakpointManager = breakpointManager;
-    this.filePathPrefixesToBindingCount = new Map();
+    this.filePathPrefixesToBindingCount = new FilePathPrefixesBindingCounts();
 
     this.subscribedBindingEventListeners = new Platform.MapUtilities.Multimap();
 
@@ -92,7 +93,7 @@ export class PersistenceImpl extends Common.ObjectWrapper.ObjectWrapper<EventTyp
     binding.fileSystem.addEventListener(
         Workspace.UISourceCode.Events.WorkingCopyChanged, this.onWorkingCopyChanged, this);
 
-    this.addFilePathBindingPrefixes(binding.fileSystem.url());
+    this.filePathPrefixesToBindingCount.add(binding.fileSystem.url());
 
     await this.moveBreakpoints(binding.fileSystem, binding.network);
 
@@ -131,7 +132,7 @@ export class PersistenceImpl extends Common.ObjectWrapper.ObjectWrapper<EventTyp
     binding.fileSystem.removeEventListener(
         Workspace.UISourceCode.Events.WorkingCopyChanged, this.onWorkingCopyChanged, this);
 
-    this.removeFilePathBindingPrefixes(binding.fileSystem.url());
+    this.filePathPrefixesToBindingCount.remove(binding.fileSystem.url());
     await this.breakpointManager.copyBreakpoints(binding.network.url(), binding.fileSystem);
 
     this.notifyBindingEvent(binding.network);
@@ -307,33 +308,52 @@ export class PersistenceImpl extends Common.ObjectWrapper.ObjectWrapper<EventTyp
     return binding ? binding.network : null;
   }
 
-  private addFilePathBindingPrefixes(filePath: string): void {
+  filePathHasBindings(filePath: string): boolean {
+    return this.filePathPrefixesToBindingCount.hasBindingPrefix(filePath);
+  }
+}
+
+class FilePathPrefixesBindingCounts {
+  private prefixCounts: Map<string, number>;
+
+  constructor() {
+    this.prefixCounts = new Map();
+  }
+
+  private getPlatformCanonicalFilePath(path: string): string {
+    return Host.Platform.isWin() ? path.toLowerCase() : path;
+  }
+
+  add(filePath: string): void {
+    filePath = this.getPlatformCanonicalFilePath(filePath);
     let relative = '';
     for (const token of filePath.split('/')) {
       relative += token + '/';
-      const count = this.filePathPrefixesToBindingCount.get(relative) || 0;
-      this.filePathPrefixesToBindingCount.set(relative, count + 1);
+      const count = this.prefixCounts.get(relative) || 0;
+      this.prefixCounts.set(relative, count + 1);
     }
   }
 
-  private removeFilePathBindingPrefixes(filePath: string): void {
+  remove(filePath: string): void {
+    filePath = this.getPlatformCanonicalFilePath(filePath);
     let relative = '';
     for (const token of filePath.split('/')) {
       relative += token + '/';
-      const count = this.filePathPrefixesToBindingCount.get(relative);
+      const count = this.prefixCounts.get(relative);
       if (count === 1) {
-        this.filePathPrefixesToBindingCount.delete(relative);
+        this.prefixCounts.delete(relative);
       } else if (count !== undefined) {
-        this.filePathPrefixesToBindingCount.set(relative, count - 1);
+        this.prefixCounts.set(relative, count - 1);
       }
     }
   }
 
-  filePathHasBindings(filePath: string): boolean {
+  hasBindingPrefix(filePath: string): boolean {
+    filePath = this.getPlatformCanonicalFilePath(filePath);
     if (!filePath.endsWith('/')) {
       filePath += '/';
     }
-    return this.filePathPrefixesToBindingCount.has(filePath);
+    return this.prefixCounts.has(filePath);
   }
 }
 

package/front_end/models/workspace/UISourceCode.ts

@@ -277,7 +277,7 @@ export class UISourceCode extends Common.ObjectWrapper.ObjectWrapper<EventTypes>
     await Common.Revealer.reveal(this);
 
     // Make sure we are in the next frame before stopping the world with confirm
-    await new Promise(resolve => setTimeout(resolve, 0));
+    await new Promise(resolve => window.setTimeout(resolve, 0));
 
     const shouldUpdate = window.confirm(i18nString(UIStrings.thisFileWasChangedExternally));
     if (shouldUpdate) {

package/front_end/panels/application/AppManifestView.ts

@@ -102,6 +102,14 @@ const UIStrings = {
   */
   backgroundColor: 'Background color',
   /**
+  *@description Text in App Manifest View of the Application panel
+  */
+  darkThemeColor: 'Dark theme color',
+  /**
+  *@description Text in App Manifest View of the Application panel
+  */
+  darkBackgroundColor: 'Dark background color',
+  /**
   *@description Text for the orientation of something
   */
   orientation: 'Orientation',
@@ -403,6 +411,10 @@ export class AppManifestView extends UI.Widget.VBox implements SDK.TargetManager
   private readonly startURLField: HTMLElement;
   private readonly themeColorSwatch: InlineEditor.ColorSwatch.ColorSwatch;
   private readonly backgroundColorSwatch: InlineEditor.ColorSwatch.ColorSwatch;
+  private readonly darkThemeColorField: HTMLElement;
+  private readonly darkThemeColorSwatch: InlineEditor.ColorSwatch.ColorSwatch;
+  private readonly darkBackgroundColorField: HTMLElement;
+  private readonly darkBackgroundColorSwatch: InlineEditor.ColorSwatch.ColorSwatch;
   private orientationField: HTMLElement;
   private displayField: HTMLElement;
   private readonly newNoteUrlField: HTMLElement;
@@ -456,6 +468,14 @@ export class AppManifestView extends UI.Widget.VBox implements SDK.TargetManager
     this.backgroundColorSwatch = new InlineEditor.ColorSwatch.ColorSwatch();
     backgroundColorField.appendChild(this.backgroundColorSwatch);
 
+    this.darkThemeColorField = this.presentationSection.appendField(i18nString(UIStrings.darkThemeColor));
+    this.darkThemeColorSwatch = new InlineEditor.ColorSwatch.ColorSwatch();
+    this.darkThemeColorField.appendChild(this.darkThemeColorSwatch);
+
+    this.darkBackgroundColorField = this.presentationSection.appendField(i18nString(UIStrings.darkBackgroundColor));
+    this.darkBackgroundColorSwatch = new InlineEditor.ColorSwatch.ColorSwatch();
+    this.darkBackgroundColorField.appendChild(this.darkBackgroundColorSwatch);
+
     this.orientationField = this.presentationSection.appendField(i18nString(UIStrings.orientation));
     this.displayField = this.presentationSection.appendField(i18nString(UIStrings.display));
 
@@ -634,6 +654,27 @@ export class AppManifestView extends UI.Widget.VBox implements SDK.TargetManager
       this.backgroundColorSwatch.renderColor(backgroundColor, true);
     }
 
+    const userPreferences = parsedManifest['user_preferences'] || {};
+    const colorSchemeDark = userPreferences['color_scheme_dark'] || {};
+    const darkThemeColorString = colorSchemeDark['theme_color'];
+    const hasDarkThemeColor = typeof darkThemeColorString === 'string';
+    this.darkThemeColorField.parentElement?.classList.toggle('hidden', !hasDarkThemeColor);
+    if (hasDarkThemeColor) {
+      const darkThemeColor = Common.Color.Color.parse(darkThemeColorString);
+      if (darkThemeColor) {
+        this.darkThemeColorSwatch.renderColor(darkThemeColor, true);
+      }
+    }
+    const darkBackgroundColorString = colorSchemeDark['background_color'];
+    const hasDarkBackgroundColor = typeof darkBackgroundColorString === 'string';
+    this.darkBackgroundColorField.parentElement?.classList.toggle('hidden', !hasDarkBackgroundColor);
+    if (hasDarkBackgroundColor) {
+      const darkBackgroundColor = Common.Color.Color.parse(darkBackgroundColorString);
+      if (darkBackgroundColor) {
+        this.darkBackgroundColorSwatch.renderColor(darkBackgroundColor, true);
+      }
+    }
+
     this.orientationField.textContent = stringProperty('orientation');
     const displayType = stringProperty('display');
     this.displayField.textContent = displayType;

package/front_end/panels/application/StorageView.ts

@@ -381,7 +381,7 @@ export class StorageView extends UI.ThrottledWidget.ThrottledWidget {
     this.clearButton.disabled = true;
     const label = this.clearButton.textContent;
     this.clearButton.textContent = i18nString(UIStrings.clearing);
-    setTimeout(() => {
+    window.setTimeout(() => {
       this.clearButton.disabled = false;
       this.clearButton.textContent = label;
       this.clearButton.focus();

package/front_end/panels/console/ConsoleView.ts

@@ -1390,7 +1390,7 @@ export class ConsoleView extends UI.Widget.VBox implements UI.SearchableView.Sea
 
     if (index === this.visibleViewMessages.length) {
       this.cleanupAfterSearch();
-      setTimeout(this.searchFinishedForTests.bind(this), 0);
+      window.setTimeout(this.searchFinishedForTests.bind(this), 0);
       return;
     }
 

package/front_end/panels/elements/AccessibilityTreeView.ts

@@ -12,11 +12,11 @@ import {ElementsPanel} from './ElementsPanel.js';
 export class AccessibilityTreeView extends UI.Widget.VBox implements
     SDK.TargetManager.SDKModelObserver<SDK.AccessibilityModel.AccessibilityModel> {
   private accessibilityTreeComponent = new TreeOutline.TreeOutline.TreeOutline<AccessibilityTreeUtils.AXTreeNodeData>();
-  private readonly toggleButton: HTMLButtonElement;
+  private readonly toggleButton: HTMLElement;
   private inspectedDOMNode: SDK.DOMModel.DOMNode|null = null;
   private root: SDK.AccessibilityModel.AccessibilityNode|null = null;
 
-  constructor(toggleButton: HTMLButtonElement) {
+  constructor(toggleButton: HTMLElement) {
     super();
     // toggleButton is bound to a click handler on ElementsPanel to switch between the DOM tree
     // and accessibility tree views.

package/front_end/panels/elements/ComputedStyleModel.ts

@@ -83,7 +83,7 @@ export class ComputedStyleModel extends Common.ObjectWrapper.ObjectWrapper<Event
       clearTimeout(this.frameResizedTimer);
     }
 
-    this.frameResizedTimer = setTimeout(refreshContents.bind(this), 100);
+    this.frameResizedTimer = window.setTimeout(refreshContents.bind(this), 100);
   }
 
   private elementNode(): SDK.DOMModel.DOMNode|null {

package/front_end/panels/elements/ElementsPanel.ts

@@ -42,7 +42,7 @@ import * as Extensions from '../../models/extensions/extensions.js';
 import elementsPanelStyles from './elementsPanel.css.js';
 
 import type * as Adorners from '../../ui/components/adorners/adorners.js';
-import * as IconButton from '../../ui/components/icon_button/icon_button.js';
+import * as Buttons from '../../ui/components/buttons/buttons.js';
 import * as Components from '../../ui/legacy/components/utils/utils.js';
 import * as UI from '../../ui/legacy/legacy.js';
 
@@ -142,20 +142,21 @@ const UIStrings = {
 const str_ = i18n.i18n.registerUIStrings('panels/elements/ElementsPanel.ts', UIStrings);
 const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
 
-const createAccessibilityTreeToggleButton = (isActive: boolean): HTMLButtonElement => {
-  const button = document.createElement('button');
+const createAccessibilityTreeToggleButton = (isActive: boolean): HTMLElement => {
+  const button = new Buttons.Button.Button();
+  const title =
+      isActive ? i18nString(UIStrings.switchToDomTreeView) : i18nString(UIStrings.switchToAccessibilityTreeView);
+  button.data = {
+    active: isActive,
+    variant: Buttons.Button.Variant.TOOLBAR,
+    iconUrl: new URL('../../Images/accessibility-icon.svg', import.meta.url).toString(),
+    title,
+  };
+  button.tabIndex = 0;
+  button.classList.add('axtree-button');
   if (isActive) {
-    button.classList.add('axtree-button', 'axtree-button-active');
-  } else {
-    button.classList.add('axtree-button');
+    button.classList.add('active');
   }
-  button.tabIndex = 0;
-  button.title =
-      isActive ? i18nString(UIStrings.switchToDomTreeView) : i18nString(UIStrings.switchToAccessibilityTreeView);
-  const icon = new IconButton.Icon.Icon();
-  const bgColor = isActive ? 'var(--color-primary)' : 'var(--color-text-secondary)';
-  icon.data = {iconName: 'accessibility-icon', color: bgColor, width: '16px', height: '16px'};
-  button.appendChild(icon);
   return button;
 };
 
@@ -185,8 +186,8 @@ export class ElementsPanel extends UI.Panel.Panel implements UI.SearchableView.S
   private readonly adornerManager: ElementsComponents.AdornerManager.AdornerManager;
   private adornerSettingsPane: ElementsComponents.AdornerSettingsPane.AdornerSettingsPane|null;
   private readonly adornersByName: Map<string, Set<Adorners.Adorner.Adorner>>;
-  accessibilityTreeButton?: HTMLButtonElement;
-  domTreeButton?: HTMLButtonElement;
+  accessibilityTreeButton?: HTMLElement;
+  domTreeButton?: HTMLElement;
   private selectedNodeOnReset?: SDK.DOMModel.DOMNode;
   private hasNonDefaultSelectedNode?: boolean;
   private searchConfig?: UI.SearchableView.SearchConfig;

package/front_end/panels/elements/StylesSidebarPane.ts

@@ -590,7 +590,7 @@ export class StylesSidebarPane extends Common.ObjectWrapper.eventMixin<EventType
 
   async doUpdate(): Promise<void> {
     if (!this.initialUpdateCompleted) {
-      setTimeout(() => {
+      window.setTimeout(() => {
         if (!this.initialUpdateCompleted) {
           // the spinner will get automatically removed when innerRebuildUpdate is called
           this.sectionsContainer.createChild('span', 'spinner');
@@ -1650,7 +1650,7 @@ export class StylePropertiesSection {
     if (this.hoverTimer) {
       clearTimeout(this.hoverTimer);
     }
-    this.hoverTimer = setTimeout(this.highlight.bind(this), 300);
+    this.hoverTimer = window.setTimeout(this.highlight.bind(this), 300);
   }
 
   highlight(mode: string|undefined = 'all'): void {

package/front_end/panels/elements/elementsPanel.css

@@ -82,11 +82,13 @@ devtools-tree-outline {
 
 .axtree-button {
   position: absolute;
-  padding: 4px;
   top: 16px;
-  right: 16px;
+  right: 20px;
+  background-color: var(--color-background-elevation-1);
   display: flex;
   justify-content: center;
   align-items: center;
   z-index: 1;
+  border: 1px solid var(--color-details-hairline);
+  border-radius: 3px;
 }

package/front_end/panels/network/NetworkItemView.ts

@@ -275,7 +275,7 @@ export class NetworkItemView extends UI.TabbedPane.TabbedPane {
     if (!this.selectTab(tabId)) {
       // maybeAppendPayloadPanel might cause payload tab to appear asynchronously, so
       // it makes sense to retry on the next tick
-      setTimeout(() => {
+      window.setTimeout(() => {
         if (!this.selectTab(tabId)) {
           this.selectTab('headers');
         }

package/front_end/panels/network/NetworkLogViewColumns.ts

@@ -8,6 +8,7 @@ import type * as SDK from '../../core/sdk/sdk.js';
 import * as DataGrid from '../../ui/legacy/components/data_grid/data_grid.js';
 import * as Components from '../../ui/legacy/components/utils/utils.js';
 import * as UI from '../../ui/legacy/legacy.js';
+import * as ThemeSupport from '../../ui/legacy/theme_support/theme_support.js';
 
 import type {NetworkNode} from './NetworkDataGridNode.js';
 import {NetworkRequestNode} from './NetworkDataGridNode.js';
@@ -205,6 +206,10 @@ export class NetworkLogViewColumns {
 
     this.setupDataGrid();
     this.setupWaterfall();
+
+    ThemeSupport.ThemeSupport.instance().addEventListener(ThemeSupport.ThemeChangeEvent.eventName, () => {
+      this.scheduleRefresh();
+    });
   }
 
   private static convertToDataGridDescriptor(columnConfig: Descriptor): DataGrid.DataGrid.ColumnDescriptor {

package/front_end/panels/profiler/HeapTimelineOverview.ts

@@ -196,7 +196,7 @@ export class HeapTimelineOverview extends Common.ObjectWrapper.eventMixin<EventT
 
   onWindowChanged(): void {
     if (!this.updateGridTimerId) {
-      this.updateGridTimerId = setTimeout(this.updateGrid.bind(this), 10);
+      this.updateGridTimerId = window.setTimeout(this.updateGrid.bind(this), 10);
     }
   }
 
@@ -204,7 +204,7 @@ export class HeapTimelineOverview extends Common.ObjectWrapper.eventMixin<EventT
     if (this.updateTimerId) {
       return;
     }
-    this.updateTimerId = setTimeout(this.update.bind(this), 10);
+    this.updateTimerId = window.setTimeout(this.update.bind(this), 10);
   }
 
   updateBoundaries(): void {

package/front_end/panels/profiler/LiveHeapProfileView.ts

@@ -203,7 +203,7 @@ export class LiveHeapProfileView extends UI.Widget.VBox {
         return;
       }
       this.update(isolates, profiles);
-      await new Promise(r => setTimeout(r, 3000));
+      await new Promise(r => window.setTimeout(r, 3000));
     } while (this.currentPollId === pollId);
   }
 

package/front_end/panels/screencast/ScreencastView.ts

@@ -796,7 +796,7 @@ export class ProgressTracker {
   private onLoad(): void {
     this.requestIds = null;
     this.updateProgress(1);  // Display 100% progress on load, hide it in 0.5s.
-    setTimeout(() => {
+    window.setTimeout(() => {
       if (!this.navigationProgressVisible()) {
         this.displayProgress(0);
       }
@@ -831,7 +831,7 @@ export class ProgressTracker {
       return;
     }
     ++this.finishedRequests;
-    setTimeout(() => {
+    window.setTimeout(() => {
       this.updateProgress(
           this.finishedRequests / this.startedRequests * 0.9);  // Finished requests drive the progress up to 90%.
     }, 500);  // Delay to give the new requests time to start. This makes the progress smoother.

package/front_end/panels/settings/SettingsScreen.ts

@@ -392,7 +392,7 @@ export class ExperimentsSettingsTab extends SettingsTab {
   constructor() {
     super(i18nString(UIStrings.experiments), 'experiments-tab-content');
     const filterSection = this.appendSection();
-    filterSection.style.paddingTop = '1px';
+    filterSection.classList.add('experiments-filter');
 
     const labelElement = filterSection.createChild('label');
     labelElement.textContent = i18nString(UIStrings.filterExperimentsLabel);

package/front_end/panels/settings/settingsScreen.css

@@ -74,9 +74,14 @@ fieldset {
   border: none;
 }
 
-.settings-tab label {
-  padding-right: 4px;
-  display: inline-flex;
+.experiments-filter {
+  padding-top: 1px;
+  display: flex;
+  align-items: center;
+}
+
+.experiments-filter label {
+  padding-right: 8px;
   flex-shrink: 0;
 }
 

package/front_end/panels/sources/DebuggerPlugin.ts

@@ -603,7 +603,7 @@ export class DebuggerPlugin extends Plugin {
     } else if (/^text\/(javascript|typescript|jsx)/.test(this.uiSourceCode.mimeType())) {
       let node: CodeMirror.SyntaxNode|null = CodeMirror.syntaxTree(editor.state).resolveInner(textPosition, 1);
       // Only do something if the cursor is over a leaf node.
-      if (node.firstChild) {
+      if (node?.firstChild) {
         return null;
       }
       while (

package/front_end/panels/sources/NavigatorView.ts

@@ -1137,7 +1137,7 @@ export class NavigatorSourceTreeElement extends UI.TreeOutline.TreeElement {
       super.selectOnMouseDown(event);
       return;
     }
-    setTimeout(rename.bind(this), 300);
+    window.setTimeout(rename.bind(this), 300);
 
     function rename(this: NavigatorSourceTreeElement): void {
       if (this.shouldRenameOnMouseDown()) {

package/front_end/panels/sources/SourcesSearchScope.ts

@@ -240,7 +240,7 @@ export class SourcesSearchScope implements Search.SearchConfig.SearchScope {
 
       ++callbacksLeft;
       const uiSourceCode = files[fileIndex++];
-      setTimeout(searchInNextFile.bind(this, uiSourceCode), 0);
+      window.setTimeout(searchInNextFile.bind(this, uiSourceCode), 0);
     }
 
     function contentLoaded(

package/front_end/panels/sources/sources-meta.ts

@@ -3,6 +3,7 @@
 // found in the LICENSE file.
 
 import * as Common from '../../core/common/common.js';
+import * as Host from '../../core/host/host.js';
 import * as i18n from '../../core/i18n/i18n.js';
 import * as Root from '../../core/root/root.js';
 import * as SDK from '../../core/sdk/sdk.js';
@@ -1097,17 +1098,19 @@ UI.ActionRegistration.registerActionExtension({
   title: i18nLazyString(UIStrings.createNewSnippet),
 });
 
-UI.ActionRegistration.registerActionExtension({
-  category: UI.ActionRegistration.ActionCategory.SOURCES,
-  actionId: 'sources.add-folder-to-workspace',
-  async loadActionDelegate() {
-    const Sources = await loadSourcesModule();
-    return Sources.SourcesNavigator.ActionDelegate.instance();
-  },
-  iconClass: UI.ActionRegistration.IconClass.LARGE_ICON_ADD,
-  title: i18nLazyString(UIStrings.addFolderToWorkspace),
-  condition: Root.Runtime.ConditionName.NOT_SOURCES_HIDE_ADD_FOLDER,
-});
+if (!Host.InspectorFrontendHost.InspectorFrontendHostInstance.isHostedMode()) {
+  UI.ActionRegistration.registerActionExtension({
+    category: UI.ActionRegistration.ActionCategory.SOURCES,
+    actionId: 'sources.add-folder-to-workspace',
+    async loadActionDelegate() {
+      const Sources = await loadSourcesModule();
+      return Sources.SourcesNavigator.ActionDelegate.instance();
+    },
+    iconClass: UI.ActionRegistration.IconClass.LARGE_ICON_ADD,
+    title: i18nLazyString(UIStrings.addFolderToWorkspace),
+    condition: Root.Runtime.ConditionName.NOT_SOURCES_HIDE_ADD_FOLDER,
+  });
+}
 
 UI.ActionRegistration.registerActionExtension({
   category: UI.ActionRegistration.ActionCategory.DEBUGGER,

package/front_end/panels/timeline/TimelineController.ts

@@ -146,7 +146,7 @@ export class TimelineController implements SDK.TargetManager.SDKModelObserver<SD
     const extensionCompletionPromises = this.extensionSessions.map(session => session.stop());
     if (extensionCompletionPromises.length) {
       tracingStoppedPromises.push(
-          Promise.race([Promise.all(extensionCompletionPromises), new Promise(r => setTimeout(r, 5000))]));
+          Promise.race([Promise.all(extensionCompletionPromises), new Promise(r => window.setTimeout(r, 5000))]));
     }
     await Promise.all(tracingStoppedPromises);
   }
@@ -222,7 +222,7 @@ export class TimelineController implements SDK.TargetManager.SDKModelObserver<SD
 
   private allSourcesFinished(): void {
     this.client.processingStarted();
-    setTimeout(() => this.finalizeTrace(), 0);
+    window.setTimeout(() => this.finalizeTrace(), 0);
   }
 
   private async finalizeTrace(): Promise<void> {

package/front_end/panels/timeline/TimelineLoader.ts

@@ -80,14 +80,14 @@ export class TimelineLoader implements Common.StringOutputStream.OutputStream {
   static loadFromEvents(events: SDK.TracingManager.EventPayload[], client: Client): TimelineLoader {
     const loader = new TimelineLoader(client);
 
-    setTimeout(async () => {
+    window.setTimeout(async () => {
       const eventsPerChunk = 5000;
       client.loadingStarted();
       for (let i = 0; i < events.length; i += eventsPerChunk) {
         const chunk = events.slice(i, i + eventsPerChunk);
         (loader.tracingModel as SDK.TracingModel.TracingModel).addEvents(chunk);
         client.loadingProgress((i + chunk.length) / events.length);
-        await new Promise(r => setTimeout(r));  // Yield event loop to paint.
+        await new Promise(r => window.setTimeout(r));  // Yield event loop to paint.
       }
       void loader.close();
     });
@@ -228,7 +228,7 @@ export class TimelineLoader implements Common.StringOutputStream.OutputStream {
       return;
     }
     this.client.processingStarted();
-    setTimeout(() => this.finalizeTrace(), 0);
+    window.setTimeout(() => this.finalizeTrace(), 0);
   }
 
   private finalizeTrace(): void {

package/front_end/panels/timeline/TimelinePanel.ts

@@ -1148,7 +1148,7 @@ export class TimelinePanel extends UI.Panel.Panel implements Client, TimelineMod
       return;
     }
     const controller = this.controller;
-    await new Promise(r => setTimeout(r, this.millisecondsToRecordAfterLoadEvent));
+    await new Promise(r => window.setTimeout(r, this.millisecondsToRecordAfterLoadEvent));
 
     // Check if we're still in the same recording session.
     if (controller !== this.controller || this.state !== State.Recording) {

package/front_end/panels/webauthn/WebauthnPane.ts

@@ -404,7 +404,7 @@ export class WebauthnPaneImpl extends UI.Widget.VBox implements
     }
 
     // TODO(crbug.com/1112528): Add back-end events for credential creation and removal to avoid polling.
-    setTimeout(this.#updateCredentials.bind(this, authenticatorId), TIMEOUT);
+    window.setTimeout(this.#updateCredentials.bind(this, authenticatorId), TIMEOUT);
   }
 
   #maybeAddEmptyNode(dataGrid: DataGrid.DataGrid.DataGridImpl<DataGridNode>): void {