chrome-devtools-frontend 1.0.957495 → 1.0.957983

package/extension-api/ExtensionAPI.d.ts

@@ -69,6 +69,13 @@ export namespace Chrome {
 
       create(title: string, iconPath: string, pagePath: string, callback?: (panel: ExtensionPanel) => unknown): void;
       openResource(url: string, lineNumber: number, columnNumber?: number, callback?: () => unknown): void;
+
+      /**
+       * Fired when the theme changes in DevTools.
+       *
+       * @param callback The handler callback to register and be invoked on theme changes.
+       */
+      setThemeChangeHandler(callback?: (themeName: string) => unknown): void;
     }
 
     export interface Request {

package/front_end/Tests.js

@@ -1572,6 +1572,20 @@
         `console.log(1) //# sourceMappingURL=chrome-extension://${extensionId}/source.map`, () => {});
   };
 
+  TestSuite.prototype.testSourceMapsFromDevtools = function() {
+    this.takeControl();
+    const debuggerModel = self.SDK.targetManager.mainTarget().model(SDK.DebuggerModel);
+    debuggerModel.sourceMapManager().addEventListener(
+        SDK.SourceMapManager.Events.SourceMapWillAttach, this.releaseControl.bind(this));
+
+    this.evaluateInConsole_(
+        'console.log(1) //# sourceMappingURL=devtools://devtools/bundled/devtools_compatibility.js', () => {});
+  };
+
+  TestSuite.prototype.testDoesNotCrashOnSourceMapsFromUnknownScheme = function() {
+    this.evaluateInConsole_('console.log(1) //# sourceMappingURL=invalid-scheme://source.map', () => {});
+  };
+
   /**
    * Returns all loaded non anonymous uiSourceCodes.
    * @return {!Array.<!Workspace.UISourceCode>}

package/front_end/core/common/Debouncer.ts

@@ -9,7 +9,7 @@ export const debounce = function(func: Function, delay: number): Function {
   let timer = 0;
   const debounced = (): void => {
     clearTimeout(timer);
-    timer = setTimeout(() => func(), delay);
+    timer = window.setTimeout(() => func(), delay);
   };
   return debounced;
 };

package/front_end/core/common/Settings.ts

@@ -197,6 +197,7 @@ export class Settings {
 
 export interface SettingsBackingStore {
   register(setting: string): void;
+  get(setting: string): Promise<string>;
   set(setting: string, value: string): void;
   remove(setting: string): void;
   clear(): void;
@@ -205,6 +206,7 @@ export interface SettingsBackingStore {
 export const NOOP_STORAGE: SettingsBackingStore = {
   register: () => {},
   set: () => {},
+  get: () => Promise.resolve(''),
   remove: () => {},
   clear: () => {},
 };
@@ -236,6 +238,17 @@ export class SettingsStorage {
     return this.object[name];
   }
 
+  async forceGet(originalName: string): Promise<string> {
+    const name = this.storagePrefix + originalName;
+    const value = await this.backingStore.get(name);
+    if (value && value !== this.object[name]) {
+      this.set(originalName, value);
+    } else if (!value) {
+      this.remove(originalName);
+    }
+    return value;
+  }
+
   remove(name: string): void {
     name = this.storagePrefix + name;
     delete this.object[name];
@@ -363,6 +376,26 @@ export class Setting<V> {
     return this.#value;
   }
 
+  async forceGet(): Promise<V> {
+    const name = this.name;
+    const oldValue = this.storage.get(name);
+    const value = await this.storage.forceGet(name);
+    this.#value = this.defaultValue;
+    if (value) {
+      try {
+        this.#value = this.#serializer.parse(value);
+      } catch (e) {
+        this.storage.remove(this.name);
+      }
+    }
+
+    if (oldValue !== value) {
+      this.eventSupport.dispatchEventToListeners(this.name, this.#value);
+    }
+
+    return this.#value;
+  }
+
   set(value: V): void {
     this.#hadUserAction = true;
     this.#value = value;

package/front_end/core/host/InspectorFrontendHost.ts

@@ -94,15 +94,15 @@ export class InspectorFrontendHostStub implements InspectorFrontendHostAPI {
   }
 
   setIsDocked(isDocked: boolean, callback: () => void): void {
-    setTimeout(callback, 0);
+    window.setTimeout(callback, 0);
   }
 
   showSurvey(trigger: string, callback: (arg0: ShowSurveyResult) => void): void {
-    setTimeout(() => callback({surveyShown: false}), 0);
+    window.setTimeout(() => callback({surveyShown: false}), 0);
   }
 
   canShowSurvey(trigger: string, callback: (arg0: CanShowSurveyResult) => void): void {
-    setTimeout(() => callback({canShowSurvey: false}), 0);
+    window.setTimeout(() => callback({canShowSurvey: false}), 0);
   }
 
   /**
@@ -260,6 +260,10 @@ export class InspectorFrontendHostStub implements InspectorFrontendHostAPI {
     callback(prefs);
   }
 
+  getPreference(name: string, callback: (arg0: string) => void): void {
+    callback(window.localStorage[name]);
+  }
+
   setPreference(name: string, value: string): void {
     window.localStorage[name] = value;
   }

package/front_end/core/host/InspectorFrontendHostAPI.ts

@@ -234,6 +234,8 @@ export interface InspectorFrontendHostAPI {
                    [x: string]: string,
                  }) => void): void;
 
+  getPreference(name: string, callback: (arg0: string) => void): void;
+
   setPreference(name: string, value: string): void;
 
   removePreference(name: string): void;

package/front_end/core/host/UserMetrics.ts

@@ -78,10 +78,10 @@ export class UserMetrics {
     }
 
     this.#firedLaunchHistogram = true;
-    // Use rAF and setTimeout to ensure the marker is fired after layout and rendering.
+    // Use rAF and window.setTimeout to ensure the marker is fired after layout and rendering.
     // This will give the most accurate representation of the tool being ready for a user.
     requestAnimationFrame(() => {
-      setTimeout(() => {
+      window.setTimeout(() => {
         // Mark the load time so that we can pinpoint it more easily in a trace.
         performance.mark(histogramName);
         // If the user has switched panel before we finished loading, ignore the histogram,

package/front_end/core/i18n/i18nImpl.ts

@@ -58,7 +58,7 @@ function getLocaleFetchUrl(locale: Intl.UnicodeBCP47LocaleIdentifier): string {
 export async function fetchAndRegisterLocaleData(locale: Intl.UnicodeBCP47LocaleIdentifier): Promise<void> {
   const localeDataTextPromise = fetch(getLocaleFetchUrl(locale)).then(result => result.json());
   const timeoutPromise =
-      new Promise((resolve, reject) => setTimeout(() => reject(new Error('timed out fetching locale')), 5000));
+      new Promise((resolve, reject) => window.setTimeout(() => reject(new Error('timed out fetching locale')), 5000));
   const localeData = await Promise.race([timeoutPromise, localeDataTextPromise]);
   i18nInstance.registerLocaleData(locale, localeData);
 }

package/front_end/core/protocol_client/InspectorBackend.ts

@@ -442,7 +442,7 @@ export class SessionRouter {
     }
 
     // Execute all promises.
-    setTimeout(() => {
+    window.setTimeout(() => {
       if (!this.hasOutstandingNonLongPollingRequests()) {
         this.executeAfterPendingDispatches();
       } else {
@@ -467,7 +467,7 @@ export class SessionRouter {
       code: ConnectionClosedErrorCode,
       data: null,
     };
-    setTimeout(() => callback(error, null), 0);
+    window.setTimeout(() => callback(error, null), 0);
   }
 
   static dispatchUnregisterSessionError({callback, method}: CallbackWithDebugInfo): void {
@@ -476,7 +476,7 @@ export class SessionRouter {
       code: ConnectionClosedErrorCode,
       data: null,
     };
-    setTimeout(() => callback(error, null), 0);
+    window.setTimeout(() => callback(error, null), 0);
   }
 }
 

package/front_end/core/sdk/Connections.ts

@@ -189,7 +189,7 @@ export class StubConnection implements ProtocolClient.InspectorBackend.Connectio
   }
 
   sendRawMessage(message: string): void {
-    setTimeout(this.respondWithError.bind(this, message), 0);
+    window.setTimeout(this.respondWithError.bind(this, message), 0);
   }
 
   private respondWithError(message: string): void {

package/front_end/core/sdk/IsolateManager.ts

@@ -126,7 +126,7 @@ export class IsolateManager extends Common.ObjectWrapper.ObjectWrapper<EventType
     const pollId = this.#pollId;
     while (pollId === this.#pollId) {
       await Promise.all(Array.from(this.isolates(), isolate => isolate.update()));
-      await new Promise(r => setTimeout(r, PollIntervalMs));
+      await new Promise(r => window.setTimeout(r, PollIntervalMs));
     }
   }
 }

package/front_end/core/sdk/PageResourceLoader.ts

@@ -163,7 +163,8 @@ export class PageResourceLoader extends Common.ObjectWrapper.ObjectWrapper<Event
 
   static async withTimeout<T>(promise: Promise<T>, timeout: number): Promise<T> {
     const timeoutPromise = new Promise<T>(
-        (_, reject) => setTimeout(reject, timeout, new Error(i18nString(UIStrings.loadCanceledDueToLoadTimeout))));
+        (_, reject) =>
+            window.setTimeout(reject, timeout, new Error(i18nString(UIStrings.loadCanceledDueToLoadTimeout))));
     return Promise.race([promise, timeoutPromise]);
   }
 
@@ -219,7 +220,8 @@ export class PageResourceLoader extends Common.ObjectWrapper.ObjectWrapper<Event
       return this.#loadOverride(url);
     }
     const parsedURL = new Common.ParsedURL.ParsedURL(url);
-    const eligibleForLoadFromTarget = getLoadThroughTargetSetting().get() && parsedURL && parsedURL.isHttpOrHttps();
+    const eligibleForLoadFromTarget = getLoadThroughTargetSetting().get() && parsedURL && parsedURL.scheme !== 'file' &&
+        parsedURL.scheme !== 'data' && parsedURL.scheme !== 'devtools';
     Host.userMetrics.developerResourceScheme(this.getDeveloperResourceScheme(parsedURL));
     if (eligibleForLoadFromTarget) {
       try {

package/front_end/devtools_compatibility.js

@@ -542,6 +542,15 @@
       DevToolsAPI.sendMessageToEmbedder('getPreferences', [], /** @type {function(?Object)} */ (callback));
     }
 
+    /**
+     * @override
+     * @param {string} name
+     * @param {function(string)} callback
+     */
+    getPreference(name, callback) {
+      DevToolsAPI.sendMessageToEmbedder('getPreference', [name], /** @type {function(string)} */ (callback));
+    }
+
     /**
      * @override
      * @param {string} name

package/front_end/entrypoints/main/MainImpl.ts

@@ -233,6 +233,11 @@ export class MainImpl {
       register: (name: string) =>
           Host.InspectorFrontendHost.InspectorFrontendHostInstance.registerPreference(name, {synced: false}),
       set: Host.InspectorFrontendHost.InspectorFrontendHostInstance.setPreference,
+      get: (name: string) => {
+        return new Promise(resolve => {
+          Host.InspectorFrontendHost.InspectorFrontendHostInstance.getPreference(name, resolve);
+        });
+      },
       remove: Host.InspectorFrontendHost.InspectorFrontendHostInstance.removePreference,
       clear: Host.InspectorFrontendHost.InspectorFrontendHostInstance.clearPreferences,
     };
@@ -571,7 +576,7 @@ export class MainImpl {
     UI.ARIAUtils.alertElementInstance();
 
     // Allow UI cycles to repaint prior to creating connection.
-    setTimeout(this.#initializeTarget.bind(this), 0);
+    window.setTimeout(this.#initializeTarget.bind(this), 0);
     MainImpl.timeEnd('Main._showAppUI');
   }
 
@@ -587,7 +592,7 @@ export class MainImpl {
     // Used for browser tests.
     Host.InspectorFrontendHost.InspectorFrontendHostInstance.readyForTest();
     // Asynchronously run the extensions.
-    setTimeout(this.#lateInitialization.bind(this), 100);
+    window.setTimeout(this.#lateInitialization.bind(this), 100);
     MainImpl.timeEnd('Main._initializeTarget');
   }
 

package/front_end/models/extensions/ExtensionAPI.ts

@@ -55,6 +55,7 @@ export namespace PrivateAPI {
     ResourceContentCommitted = 'resource-content-committed',
     ViewShown = 'view-shown-',
     ViewHidden = 'view-hidden,',
+    ThemeChange = 'host-theme-change',
   }
 
   export const enum Commands {
@@ -75,6 +76,7 @@ export namespace PrivateAPI {
     Reload = 'Reload',
     Subscribe = 'subscribe',
     SetOpenResourceHandler = 'setOpenResourceHandler',
+    SetThemeChangeHandler = 'setThemeChangeHandler',
     SetResourceContent = 'setResourceContent',
     SetSidebarContent = 'setSidebarContent',
     SetSidebarHeight = 'setSidebarHeight',
@@ -151,6 +153,7 @@ export namespace PrivateAPI {
   type SetSidebarPageRequest = {command: Commands.SetSidebarPage, id: string, page: string};
   type OpenResourceRequest = {command: Commands.OpenResource, url: string, lineNumber: number, columnNumber: number};
   type SetOpenResourceHandlerRequest = {command: Commands.SetOpenResourceHandler, handlerPresent: boolean};
+  type SetThemeChangeHandlerRequest = {command: Commands.SetThemeChangeHandler, handlerPresent: boolean};
   type ReloadRequest = {
     command: Commands.Reload,
     options: null|{
@@ -180,9 +183,10 @@ export namespace PrivateAPI {
   export type ServerRequests = RegisterLanguageExtensionPluginRequest|SubscribeRequest|UnsubscribeRequest|
       AddRequestHeadersRequest|ApplyStyleSheetRequest|CreatePanelRequest|ShowPanelRequest|CreateToolbarButtonRequest|
       UpdateButtonRequest|CompleteTraceSessionRequest|CreateSidebarPaneRequest|SetSidebarHeightRequest|
-      SetSidebarContentRequest|SetSidebarPageRequest|OpenResourceRequest|SetOpenResourceHandlerRequest|ReloadRequest|
-      EvaluateOnInspectedPageRequest|GetRequestContentRequest|GetResourceContentRequest|SetResourceContentRequest|
-      AddTraceProviderRequest|ForwardKeyboardEventRequest|GetHARRequest|GetPageResourcesRequest;
+      SetSidebarContentRequest|SetSidebarPageRequest|OpenResourceRequest|SetOpenResourceHandlerRequest|
+      SetThemeChangeHandlerRequest|ReloadRequest|EvaluateOnInspectedPageRequest|GetRequestContentRequest|
+      GetResourceContentRequest|SetResourceContentRequest|AddTraceProviderRequest|ForwardKeyboardEventRequest|
+      GetHARRequest|GetPageResourcesRequest;
   export type ExtensionServerRequestMessage = PrivateAPI.ServerRequests&{requestId?: number};
 
   type AddRawModuleRequest = {
@@ -330,6 +334,7 @@ namespace APIImpl {
     applyStyleSheet(styleSheet: string): void;
     setOpenResourceHandler(callback?: (resource: PublicAPI.Chrome.DevTools.Resource, lineNumber: number) => unknown):
         void;
+    setThemeChangeHandler(callback?: (themeName: string) => unknown): void;
   }
 
   export interface ExtensionView extends PublicAPI.Chrome.DevTools.ExtensionView {
@@ -539,7 +544,8 @@ self.injectedExtensionAPI = function(
     };
   }
 
-  (Panels.prototype as Pick<APIImpl.Panels, 'create'|'setOpenResourceHandler'|'openResource'|'SearchAction'>) = {
+  (Panels.prototype as
+   Pick<APIImpl.Panels, 'create'|'setOpenResourceHandler'|'openResource'|'SearchAction'|'setThemeChangeHandler'>) = {
     create: function(
         title: string, icon: string, page: string,
         callback: (panel: PublicAPI.Chrome.DevTools.ExtensionPanel) => unknown): void {
@@ -577,6 +583,28 @@ self.injectedExtensionAPI = function(
       }
     },
 
+    setThemeChangeHandler: function(callback: (themeName: string) => unknown): void {
+      const hadHandler = extensionServer.hasHandler(PrivateAPI.Events.ThemeChange);
+
+      function callbackWrapper(message: unknown): void {
+        const {themeName} = message as {themeName: string};
+        chrome.devtools.panels.themeName = themeName;
+        callback.call(null, themeName);
+      }
+
+      if (!callback) {
+        extensionServer.unregisterHandler(PrivateAPI.Events.ThemeChange);
+      } else {
+        extensionServer.registerHandler(PrivateAPI.Events.ThemeChange, callbackWrapper);
+      }
+
+      // Only send command if we either removed an existing handler or added handler and had none before.
+      if (hadHandler === !callback) {
+        extensionServer.sendRequest(
+            {command: PrivateAPI.Commands.SetThemeChangeHandler, 'handlerPresent': Boolean(callback)});
+      }
+    },
+
     openResource: function(
         url: string, lineNumber: number, columnNumber?: number, _callback?: (response: unknown) => unknown): void {
       const callbackArg = extractCallbackArgument(arguments);
@@ -1084,7 +1112,7 @@ self.injectedExtensionAPI = function(
     };
     keyboardEventRequestQueue.push(requestPayload);
     if (!forwardTimer) {
-      forwardTimer = setTimeout(forwardEventQueue, 0);
+      forwardTimer = window.setTimeout(forwardEventQueue, 0);
     }
   }
 

package/front_end/models/extensions/ExtensionServer.ts

@@ -89,6 +89,7 @@ export class ExtensionServer extends Common.ObjectWrapper.ObjectWrapper<EventTyp
   private extensionsEnabled: boolean;
   private inspectedTabId?: string;
   private readonly extensionAPITestHook?: (server: unknown, api: unknown) => unknown;
+  private themeChangeHandlers: Map<string, MessagePort> = new Map();
 
   private constructor() {
     super();
@@ -124,6 +125,7 @@ export class ExtensionServer extends Common.ObjectWrapper.ObjectWrapper<EventTyp
     this.registerHandler(PrivateAPI.Commands.GetResourceContent, this.onGetResourceContent.bind(this));
     this.registerHandler(PrivateAPI.Commands.Reload, this.onReload.bind(this));
     this.registerHandler(PrivateAPI.Commands.SetOpenResourceHandler, this.onSetOpenResourceHandler.bind(this));
+    this.registerHandler(PrivateAPI.Commands.SetThemeChangeHandler, this.onSetThemeChangeHandler.bind(this));
     this.registerHandler(PrivateAPI.Commands.SetResourceContent, this.onSetResourceContent.bind(this));
     this.registerHandler(PrivateAPI.Commands.SetSidebarHeight, this.onSetSidebarHeight.bind(this));
     this.registerHandler(PrivateAPI.Commands.SetSidebarContent, this.onSetSidebarContent.bind(this));
@@ -147,6 +149,13 @@ export class ExtensionServer extends Common.ObjectWrapper.ObjectWrapper<EventTyp
         Host.InspectorFrontendHostAPI.Events.SetInspectedTabId, this.setInspectedTabId, this);
 
     this.initExtensions();
+
+    ThemeSupport.ThemeSupport.instance().addEventListener(ThemeSupport.ThemeChangeEvent.eventName, () => {
+      const themeName = ThemeSupport.ThemeSupport.instance().themeName();
+      for (const port of this.themeChangeHandlers.values()) {
+        port.postMessage({command: PrivateAPI.Events.ThemeChange, themeName});
+      }
+    });
   }
 
   static instance(opts: {
@@ -530,6 +539,25 @@ export class ExtensionServer extends Common.ObjectWrapper.ObjectWrapper<EventTyp
     return undefined;
   }
 
+  private onSetThemeChangeHandler(message: PrivateAPI.ExtensionServerRequestMessage, port: MessagePort): Record
+      |undefined {
+    if (message.command !== PrivateAPI.Commands.SetThemeChangeHandler) {
+      return this.status.E_BADARG('command', `expected ${PrivateAPI.Commands.SetThemeChangeHandler}`);
+    }
+    const extensionOrigin = this.getExtensionOrigin(port);
+    const extension = this.registeredExtensions.get(extensionOrigin);
+    if (!extension) {
+      throw new Error('Received a message from an unregistered extension');
+    }
+
+    if (message.handlerPresent) {
+      this.themeChangeHandlers.set(extensionOrigin, port);
+    } else {
+      this.themeChangeHandlers.delete(extensionOrigin);
+    }
+    return undefined;
+  }
+
   private handleOpenURL(
       port: MessagePort, contentProvider: TextUtils.ContentProvider.ContentProvider, lineNumber: number): void {
     port.postMessage(

package/front_end/models/logs/LogManager.ts

@@ -67,7 +67,7 @@ export class LogManager implements SDK.TargetManager.SDKModelObserver<SDK.LogMod
       if (SDK.TargetManager.TargetManager.instance().targetById(workerId)) {
         return;
       }
-      setTimeout(() => {
+      window.setTimeout(() => {
         if (!SDK.TargetManager.TargetManager.instance().targetById(workerId)) {
           SDK.ConsoleModel.ConsoleModel.instance().addMessage(consoleMessage);
         }

package/front_end/models/persistence/FileSystemWorkspaceBinding.ts

@@ -331,7 +331,7 @@ export class FileSystem extends Workspace.Workspace.ProjectStore implements Work
         this.addFile(filePaths[i]);
       }
       if (to < filePaths.length) {
-        setTimeout(reportFileChunk.bind(this, to), 100);
+        window.setTimeout(reportFileChunk.bind(this, to), 100);
       }
     }
   }

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/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/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/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/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/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/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> {