chrome-devtools-frontend 1.0.982087 → 1.0.995227

package/front_end/models/text_utils/CodeMirrorUtils.ts

@@ -0,0 +1,53 @@
+/*
+ * Copyright (C) 2022 Google Inc. All rights reserved.
+ *
+ * Redistribution and use in source and binary forms, with or without
+ * modification, are permitted provided that the following conditions are
+ * met:
+ *
+ *     * Redistributions of source code must retain the above copyright
+ * notice, this list of conditions and the following disclaimer.
+ *     * Redistributions in binary form must reproduce the above
+ * copyright notice, this list of conditions and the following disclaimer
+ * in the documentation and/or other materials provided with the
+ * distribution.
+ *     * Neither the name of Google Inc. nor the names of its
+ * contributors may be used to endorse or promote products derived from
+ * this software without specific prior written permission.
+ *
+ * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+ * "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+ * LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+ * A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+ * OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+ * SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+ * LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+ * DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+ * THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+ * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+ * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+ */
+
+import * as CodeMirror from '../../third_party/codemirror.next/codemirror.next.js';
+type Tokenizer =
+    (line: string, callback: (value: string, style: string|null) => void) => void;
+
+export function createCssTokenizer(): Tokenizer {
+    async function tokenize(
+        line: string, callback: (value: string, style: string|null) => void): Promise<void> {
+        const streamParser = await CodeMirror.cssStreamParser();
+        const stream = new CodeMirror.StringStream();
+        stream.string = line;
+
+        const startState = streamParser.startState();
+        let lastPos = stream.pos;
+        while (!stream.eol()) {
+            const token = streamParser.token(stream, startState);
+            const segment = stream.current().substring(lastPos, stream.pos);
+            callback(segment, token);
+            lastPos = stream.pos;
+        }
+    }
+    return tokenize;
+}
+

package/front_end/models/text_utils/text_utils.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 CodeMirrorUtils from './CodeMirrorUtils.js';
 import * as ContentProvider from './ContentProvider.js';
 import * as StaticContentProvider from './StaticContentProvider.js';
 import * as Text from './Text.js';
@@ -10,6 +11,7 @@ import * as TextRange from './TextRange.js';
 import * as TextUtils from './TextUtils.js';
 
 export {
+  CodeMirrorUtils,
   ContentProvider,
   StaticContentProvider,
   Text,

package/front_end/models/timeline_model/TimelineModel.ts

@@ -341,7 +341,7 @@ export class TimelineModelImpl {
       }
       this.legacyCurrentPage = metaEvent.args['data'] && metaEvent.args['data']['page'];
       for (const thread of process.sortedThreads()) {
-        let workerUrl: null = null;
+        let workerUrl: Platform.DevToolsPath.UrlString|null = null;
         if (thread.name() === TimelineModelImpl.WorkerThreadName ||
             thread.name() === TimelineModelImpl.WorkerThreadNameLegacy) {
           const workerMetaEvent = metadataEvents.workers.find(e => {
@@ -362,7 +362,7 @@ export class TimelineModelImpl {
           if (workerId) {
             this.workerIdByThread.set(thread, workerId);
           }
-          workerUrl = workerMetaEvent.args['data']['url'] || '';
+          workerUrl = workerMetaEvent.args['data']['url'] || Platform.DevToolsPath.EmptyUrlString;
         }
         this.processThreadEvents(
             tracingModel, [{from: startTime, to: endTime}], thread, thread === metaEvent.thread, Boolean(workerUrl),
@@ -377,7 +377,7 @@ export class TimelineModelImpl {
       from: number,
       to: number,
       main: boolean,
-      url: string,
+      url: Platform.DevToolsPath.UrlString,
     }[]>();
     for (const frame of this.pageFrames.values()) {
       for (let i = 0; i < frame.processes.length; i++) {
@@ -399,8 +399,8 @@ export class TimelineModelImpl {
       }
       data.sort((a, b) => a.from - b.from || a.to - b.to);
       const ranges = [];
-      let lastUrl: string|null = null;
-      let lastMainUrl: string|null = null;
+      let lastUrl: Platform.DevToolsPath.UrlString|null = null;
+      let lastMainUrl: Platform.DevToolsPath.UrlString|null = null;
       let hasMain = false;
       for (const item of data) {
         const last = ranges[ranges.length - 1];
@@ -447,7 +447,7 @@ export class TimelineModelImpl {
           this.workerIdByThread.set(thread, workerMetaEvent.args['data']['workerId'] || '');
           this.processThreadEvents(
               tracingModel, ranges, thread, false /* isMainThread */, true /* isWorker */, false /* forMainFrame */,
-              workerMetaEvent.args['data']['url'] || '');
+              workerMetaEvent.args['data']['url'] || Platform.DevToolsPath.EmptyUrlString);
         } else {
           this.processThreadEvents(
               tracingModel, ranges, thread, false /* isMainThread */, false /* isWorker */, false /* forMainFrame */,
@@ -695,18 +695,18 @@ export class TimelineModelImpl {
         to: number,
       }[],
       thread: SDK.TracingModel.Thread, isMainThread: boolean, isWorker: boolean, forMainFrame: boolean,
-      url: string|null): void {
+      url: Platform.DevToolsPath.UrlString|null): void {
     const track = new Track();
     track.name = thread.name() || i18nString(UIStrings.threadS, {PH1: thread.id()});
     track.type = TrackType.Other;
     track.thread = thread;
     if (isMainThread) {
       track.type = TrackType.MainThread;
-      track.url = url || '';
+      track.url = url || Platform.DevToolsPath.EmptyUrlString;
       track.forMainFrame = forMainFrame;
     } else if (isWorker) {
       track.type = TrackType.Worker;
-      track.url = url || '';
+      track.url = url || Platform.DevToolsPath.EmptyUrlString;
       track.name = track.url ? i18nString(UIStrings.workerS, {PH1: track.url}) : i18nString(UIStrings.dedicatedWorker);
     } else if (thread.name().startsWith('CompositorTileWorker')) {
       track.type = TrackType.Raster;
@@ -840,26 +840,30 @@ export class TimelineModelImpl {
           if (!lastStep) {
             throw new Error('AsyncEvent.steps access is out of bounds.');
           }
-          // FIXME: fix event termination on the back-end instead.
-          if (lastStep.phase !== SDK.TracingModel.Phase.AsyncEnd) {
+          if (lastStep.phase !== SDK.TracingModel.Phase.NestableAsyncEnd) {
             continue;
           }
-          const data = lastStep.args['data'];
-          asyncEvent.causedFrame = Boolean(data && data['INPUT_EVENT_LATENCY_RENDERER_SWAP_COMPONENT']);
+          const chromeLatencyInfo = asyncEvent.args['chrome_latency_info'];
+
+          const data = chromeLatencyInfo?.['component_info'];
+          asyncEvent.causedFrame =
+              Boolean(data?.some((c: any) => c['component_type'] === 'COMPONENT_INPUT_EVENT_LATENCY_RENDERER_SWAP'));
           if (asyncEvent.hasCategory(TimelineModelImpl.Category.LatencyInfo)) {
-            if (lastStep.id && !this.knownInputEvents.has(lastStep.id)) {
+            if (lastStep.id && !this.knownInputEvents.has(chromeLatencyInfo.trace_id)) {
               continue;
             }
             if (asyncEvent.name === RecordType.InputLatencyMouseMove && !asyncEvent.causedFrame) {
               continue;
             }
             // Coalesced events are not really been processed, no need to track them.
-            if (data['is_coalesced']) {
+            if (!data || data['is_coalesced']) {
               continue;
             }
-            const rendererMain = data['INPUT_EVENT_LATENCY_RENDERER_MAIN_COMPONENT'];
+
+            const rendererMain =
+                data?.find((c: any) => c['component_type'] === 'COMPONENT_INPUT_EVENT_LATENCY_RENDERER_MAIN');
             if (rendererMain) {
-              const time = rendererMain['time'] / 1000;
+              const time = rendererMain['time_us'] / 1000;
               TimelineData.forEvent(asyncEvent.steps[0]).timeWaitingForMainThread =
                   time - asyncEvent.steps[0].startTime;
             }
@@ -1207,9 +1211,8 @@ export class TimelineModelImpl {
 
   private processBrowserEvent(event: SDK.TracingModel.Event): void {
     if (event.name === RecordType.LatencyInfoFlow) {
-      const frameId = event.args['frameTreeNodeId'];
-      if (typeof frameId === 'number' && frameId === this.mainFrameNodeId && event.bind_id) {
-        this.knownInputEvents.add(event.bind_id);
+      if (event.args.chrome_latency_info.trace_id) {
+        this.knownInputEvents.add(event.args.chrome_latency_info.trace_id);
       }
       return;
     }
@@ -1376,8 +1379,8 @@ export class TimelineModelImpl {
     return Array.from(this.pageFrames.values()).filter(frame => !frame.parent);
   }
 
-  pageURL(): string {
-    return this.mainFrame && this.mainFrame.url || '';
+  pageURL(): Platform.DevToolsPath.UrlString {
+    return this.mainFrame && this.mainFrame.url || Platform.DevToolsPath.EmptyUrlString;
   }
 
   pageFrameById(frameId: Protocol.Page.FrameId): PageFrame|null {
@@ -1640,7 +1643,7 @@ export class Track {
   name: string;
   type: TrackType;
   forMainFrame: boolean;
-  url: string;
+  url: Platform.DevToolsPath.UrlString;
   events: SDK.TracingModel.Event[];
   asyncEvents: SDK.TracingModel.AsyncEvent[];
   tasks: SDK.TracingModel.Event[];
@@ -1651,7 +1654,7 @@ export class Track {
     this.type = TrackType.Other;
     // TODO(dgozman): replace forMainFrame with a list of frames, urls and time ranges.
     this.forMainFrame = false;
-    this.url = '';
+    this.url = Platform.DevToolsPath.EmptyUrlString;
     // TODO(dgozman): do not distinguish between sync and async events.
     this.events = [];
     this.asyncEvents = [];
@@ -1732,13 +1735,13 @@ export class PageFrame {
     time: number,
     processId: number,
     processPseudoId: string|null,
-    url: string,
+    url: Platform.DevToolsPath.UrlString,
   }[];
   deletedTime: number|null;
   ownerNode: SDK.DOMModel.DeferredDOMNode|null;
   constructor(payload: any) {
     this.frameId = payload['frame'];
-    this.url = payload['url'] || '';
+    this.url = payload['url'] || Platform.DevToolsPath.EmptyUrlString;
     this.name = payload['name'];
     this.children = [];
     this.parent = null;
@@ -1789,7 +1792,7 @@ export class NetworkRequest {
     receiveHeadersEnd: number,
   };
   mimeType!: string;
-  url!: string;
+  url!: Platform.DevToolsPath.UrlString;
   requestMethod!: string;
   private transferSize: number;
   private maybeDiskCached: boolean;
@@ -2123,7 +2126,6 @@ export class InvalidationTracker {
         lastScheduleStyleRecalculation = invalidation;
       }
       if (!lastScheduleStyleRecalculation) {
-        console.error('Failed to lookup the event that scheduled a style invalidator invalidation.');
         continue;
       }
       this.addSyntheticStyleRecalcInvalidation(
@@ -2143,7 +2145,6 @@ export class InvalidationTracker {
       invalidation.selectorPart = styleInvalidatorInvalidation.selectorPart;
     }
 
-    this.addInvalidation(invalidation);
     if (!invalidation.linkedRecalcStyleEvent) {
       this.associateWithLastRecalcStyleEvent(invalidation);
     }
@@ -2302,7 +2303,7 @@ export class TimelineAsyncEventTracker {
 export class TimelineData {
   warning: string|null;
   previewElement: Element|null;
-  url: string|null;
+  url: Platform.DevToolsPath.UrlString|null;
   backendNodeIds: Protocol.DOM.BackendNodeId[];
   stackTrace: Protocol.Runtime.CallFrame[]|null;
   picture: SDK.TracingModel.ObjectSnapshot|null;

package/front_end/models/timeline_model/TimelineProfileTree.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 type * as Platform from '../../core/platform/platform.js';
 import type * as SDK from '../../core/sdk/sdk.js';
 import type * as Protocol from '../../generated/protocol.js';
 
@@ -494,14 +495,14 @@ export class BottomUpNode extends Node {
   }
 }
 
-export function eventURL(event: SDK.TracingModel.Event): string|null {
+export function eventURL(event: SDK.TracingModel.Event): Platform.DevToolsPath.UrlString|null {
   const data = event.args['data'] || event.args['beginData'];
   if (data && data['url']) {
     return data['url'];
   }
   let frame = eventStackFrame(event);
   while (frame) {
-    const url = frame['url'];
+    const url = frame['url'] as Platform.DevToolsPath.UrlString;
     if (url) {
       return url;
     }

package/front_end/models/workspace/UISourceCode.ts

@@ -51,13 +51,11 @@ const UIStrings = {
 const str_ = i18n.i18n.registerUIStrings('models/workspace/UISourceCode.ts', UIStrings);
 const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
 
-// TODO(crbug.com/1297535): Casts to UrlString and RawPathString will be removed from this file when migration to branded types is complete.
-
 export class UISourceCode extends Common.ObjectWrapper.ObjectWrapper<EventTypes> implements
     TextUtils.ContentProvider.ContentProvider {
   private projectInternal: Project;
-  private urlInternal: string;
-  private readonly originInternal: string;
+  private urlInternal: Platform.DevToolsPath.UrlString;
+  private readonly originInternal: Platform.DevToolsPath.UrlString;
   private readonly parentURLInternal: Platform.DevToolsPath.UrlString;
   private nameInternal: string;
   private contentTypeInternal: Common.ResourceType.ResourceType;
@@ -75,7 +73,7 @@ export class UISourceCode extends Common.ObjectWrapper.ObjectWrapper<EventTypes>
   private disableEditInternal: boolean;
   private contentEncodedInternal?: boolean;
 
-  constructor(project: Project, url: string, contentType: Common.ResourceType.ResourceType) {
+  constructor(project: Project, url: Platform.DevToolsPath.UrlString, contentType: Common.ResourceType.ResourceType) {
     super();
     this.projectInternal = project;
     this.urlInternal = url;
@@ -83,7 +81,8 @@ export class UISourceCode extends Common.ObjectWrapper.ObjectWrapper<EventTypes>
     const parsedURL = Common.ParsedURL.ParsedURL.fromString(url);
     if (parsedURL) {
       this.originInternal = parsedURL.securityOrigin();
-      this.parentURLInternal = this.originInternal + parsedURL.folderPathComponents as Platform.DevToolsPath.UrlString;
+      this.parentURLInternal =
+          Common.ParsedURL.ParsedURL.concatenate(this.originInternal, parsedURL.folderPathComponents);
       if (parsedURL.queryParams) {
         // in case file name contains query params, it doesn't look like a normal file name anymore
         // so it can as well remain encoded
@@ -93,7 +92,7 @@ export class UISourceCode extends Common.ObjectWrapper.ObjectWrapper<EventTypes>
         this.nameInternal = decodeURIComponent(parsedURL.lastPathComponent);
       }
     } else {
-      this.originInternal = '';
+      this.originInternal = Platform.DevToolsPath.EmptyUrlString;
       this.parentURLInternal = Platform.DevToolsPath.EmptyUrlString;
       this.nameInternal = url;
     }
@@ -125,14 +124,14 @@ export class UISourceCode extends Common.ObjectWrapper.ObjectWrapper<EventTypes>
   }
 
   url(): Platform.DevToolsPath.UrlString {
-    return this.urlInternal as Platform.DevToolsPath.UrlString;
+    return this.urlInternal;
   }
 
   parentURL(): Platform.DevToolsPath.UrlString {
     return this.parentURLInternal;
   }
 
-  origin(): string {
+  origin(): Platform.DevToolsPath.UrlString {
     return this.originInternal;
   }
 
@@ -161,10 +160,12 @@ export class UISourceCode extends Common.ObjectWrapper.ObjectWrapper<EventTypes>
     return promise;
 
     function innerCallback(
-        this: UISourceCode, success: boolean, newName?: string, newURL?: string,
+        this: UISourceCode, success: boolean, newName?: string, newURL?: Platform.DevToolsPath.UrlString,
         newContentType?: Common.ResourceType.ResourceType): void {
       if (success) {
-        this.updateName(newName as string, newURL as string, newContentType as Common.ResourceType.ResourceType);
+        this.updateName(
+            newName as Platform.DevToolsPath.RawPathString, newURL as Platform.DevToolsPath.UrlString,
+            newContentType as Common.ResourceType.ResourceType);
       }
       fulfill(success);
     }
@@ -174,14 +175,15 @@ export class UISourceCode extends Common.ObjectWrapper.ObjectWrapper<EventTypes>
     this.projectInternal.deleteFile(this);
   }
 
-  private updateName(name: string, url: string, contentType?: Common.ResourceType.ResourceType): void {
+  private updateName(
+      name: Platform.DevToolsPath.RawPathString, url: Platform.DevToolsPath.UrlString,
+      contentType?: Common.ResourceType.ResourceType): void {
     const oldURL = this.urlInternal;
     this.nameInternal = name;
     if (url) {
       this.urlInternal = url;
     } else {
-      this.urlInternal = Common.ParsedURL.ParsedURL.relativePathToUrlString(
-          name as Platform.DevToolsPath.RawPathString, oldURL as Platform.DevToolsPath.UrlString);
+      this.urlInternal = Common.ParsedURL.ParsedURL.relativePathToUrlString(name, oldURL);
     }
     if (contentType) {
       this.contentTypeInternal = contentType;

package/front_end/models/workspace/WorkspaceImpl.ts

@@ -40,7 +40,8 @@ export interface ProjectSearchConfig {
   ignoreCase(): boolean;
   isRegex(): boolean;
   queries(): string[];
-  filePathMatchesFileQuery(filePath: string): boolean;
+  filePathMatchesFileQuery(filePath: Platform.DevToolsPath.RawPathString|
+                           Platform.DevToolsPath.EncodedPathString|Platform.DevToolsPath.UrlString): boolean;
 }
 
 export interface Project {
@@ -58,8 +59,10 @@ export interface Project {
   canRename(): boolean;
   rename(
       uiSourceCode: UISourceCode, newName: Platform.DevToolsPath.RawPathString,
-      callback: (arg0: boolean, arg1?: string, arg2?: string, arg3?: Common.ResourceType.ResourceType) => void): void;
-  excludeFolder(path: string): void;
+      callback:
+          (arg0: boolean, arg1?: string, arg2?: Platform.DevToolsPath.UrlString,
+           arg3?: Common.ResourceType.ResourceType) => void): void;
+  excludeFolder(path: Platform.DevToolsPath.UrlString): void;
   canExcludeFolder(path: Platform.DevToolsPath.EncodedPathString): boolean;
   createFile(path: Platform.DevToolsPath.EncodedPathString, name: string|null, content: string, isBase64?: boolean):
       Promise<UISourceCode|null>;
@@ -69,10 +72,10 @@ export interface Project {
   searchInFileContent(uiSourceCode: UISourceCode, query: string, caseSensitive: boolean, isRegex: boolean):
       Promise<TextUtils.ContentProvider.SearchMatch[]>;
   findFilesMatchingSearchRequest(
-      searchConfig: ProjectSearchConfig, filesMathingFileQuery: string[],
+      searchConfig: ProjectSearchConfig, filesMatchingFileQuery: Platform.DevToolsPath.UrlString[],
       progress: Common.Progress.Progress): Promise<string[]>;
   indexContent(progress: Common.Progress.Progress): void;
-  uiSourceCodeForURL(url: string): UISourceCode|null;
+  uiSourceCodeForURL(url: Platform.DevToolsPath.UrlString): UISourceCode|null;
   uiSourceCodes(): UISourceCode[];
 }
 
@@ -92,7 +95,7 @@ export abstract class ProjectStore implements Project {
   private readonly idInternal: string;
   private readonly typeInternal: projectTypes;
   private readonly displayNameInternal: string;
-  private uiSourceCodesMap: Map<string, {
+  private uiSourceCodesMap: Map<Platform.DevToolsPath.UrlString, {
     uiSourceCode: UISourceCode,
     index: number,
   }>;
@@ -124,7 +127,8 @@ export abstract class ProjectStore implements Project {
     return this.workspaceInternal;
   }
 
-  createUISourceCode(url: string, contentType: Common.ResourceType.ResourceType): UISourceCode {
+  createUISourceCode(url: Platform.DevToolsPath.UrlString, contentType: Common.ResourceType.ResourceType):
+      UISourceCode {
     return new UISourceCode(this, url, contentType);
   }
 
@@ -139,7 +143,7 @@ export abstract class ProjectStore implements Project {
     return true;
   }
 
-  removeUISourceCode(url: string): void {
+  removeUISourceCode(url: Platform.DevToolsPath.UrlString): void {
     const uiSourceCode = this.uiSourceCodeForURL(url);
     if (!uiSourceCode) {
       return;
@@ -166,7 +170,7 @@ export abstract class ProjectStore implements Project {
     this.uiSourceCodesList = [];
   }
 
-  uiSourceCodeForURL(url: string): UISourceCode|null {
+  uiSourceCodeForURL(url: Platform.DevToolsPath.UrlString): UISourceCode|null {
     const entry = this.uiSourceCodesMap.get(url);
     return entry ? entry.uiSourceCode : null;
   }
@@ -179,7 +183,7 @@ export abstract class ProjectStore implements Project {
     const oldPath = uiSourceCode.url();
     const newPath = uiSourceCode.parentURL() ?
         Common.ParsedURL.ParsedURL.urlFromParentUrlAndName(uiSourceCode.parentURL(), newName) :
-        encodeURIComponent(newName);
+        encodeURIComponent(newName) as Platform.DevToolsPath.UrlString;
     const value = this.uiSourceCodesMap.get(oldPath) as {
       uiSourceCode: UISourceCode,
       index: number,
@@ -192,9 +196,11 @@ export abstract class ProjectStore implements Project {
 
   rename(
       _uiSourceCode: UISourceCode, _newName: string,
-      _callback: (arg0: boolean, arg1?: string, arg2?: string, arg3?: Common.ResourceType.ResourceType) => void): void {
+      _callback:
+          (arg0: boolean, arg1?: string, arg2?: Platform.DevToolsPath.UrlString,
+           arg3?: Common.ResourceType.ResourceType) => void): void {
   }
-  excludeFolder(_path: string): void {
+  excludeFolder(_path: Platform.DevToolsPath.UrlString): void {
   }
   deleteFile(_uiSourceCode: UISourceCode): void {
   }
@@ -219,7 +225,7 @@ export abstract class ProjectStore implements Project {
   abstract searchInFileContent(uiSourceCode: UISourceCode, query: string, caseSensitive: boolean, isRegex: boolean):
       Promise<TextUtils.ContentProvider.SearchMatch[]>;
   abstract findFilesMatchingSearchRequest(
-      searchConfig: ProjectSearchConfig, filesMathingFileQuery: string[],
+      searchConfig: ProjectSearchConfig, filesMatchingFileQuery: Platform.DevToolsPath.UrlString[],
       progress: Common.Progress.Progress): Promise<string[]>;
 }
 
@@ -248,12 +254,30 @@ export class WorkspaceImpl extends Common.ObjectWrapper.ObjectWrapper<EventTypes
     workspaceInstance = undefined;
   }
 
-  uiSourceCode(projectId: string, url: string): UISourceCode|null {
+  uiSourceCode(projectId: string, url: Platform.DevToolsPath.UrlString): UISourceCode|null {
     const project = this.projectsInternal.get(projectId);
     return project ? project.uiSourceCodeForURL(url) : null;
   }
 
-  uiSourceCodeForURL(url: string): UISourceCode|null {
+  // This method explicitly awaits the UISourceCode if not yet
+  // available.
+  uiSourceCodeForURLPromise(url: Platform.DevToolsPath.UrlString): Promise<UISourceCode> {
+    const uiSourceCode = this.uiSourceCodeForURL(url);
+    if (uiSourceCode) {
+      return Promise.resolve(uiSourceCode);
+    }
+    return new Promise(resolve => {
+      const descriptor = this.addEventListener(Events.UISourceCodeAdded, event => {
+        const uiSourceCode = event.data;
+        if (uiSourceCode.url() === url) {
+          this.removeEventListener(Events.UISourceCodeAdded, descriptor.listener);
+          resolve(uiSourceCode);
+        }
+      });
+    });
+  }
+
+  uiSourceCodeForURL(url: Platform.DevToolsPath.UrlString): UISourceCode|null {
     for (const project of this.projectsInternal.values()) {
       const uiSourceCode = project.uiSourceCodeForURL(url);
       if (uiSourceCode) {
@@ -330,7 +354,7 @@ export enum Events {
 }
 
 export interface UISourceCodeRenamedEvent {
-  oldURL: string;
+  oldURL: Platform.DevToolsPath.UrlString;
   uiSourceCode: UISourceCode;
 }
 

package/front_end/panels/accessibility/AccessibilitySubPane.ts

@@ -3,6 +3,7 @@
 // found in the LICENSE file.
 
 import accessibilityPropertiesStyles from './accessibilityProperties.css.js';
+import type * as Platform from '../../core/platform/platform.js';
 import type * as SDK from '../../core/sdk/sdk.js';
 import * as UI from '../../ui/legacy/legacy.js';
 import accessibilityNodeStyles from './accessibilityNode.css.js';
@@ -12,7 +13,7 @@ import objectValueStyles from '../../ui/legacy/components/object_ui/objectValue.
 export class AccessibilitySubPane extends UI.View.SimpleView {
   axNode: SDK.AccessibilityModel.AccessibilityNode|null;
   protected nodeInternal?: SDK.DOMModel.DOMNode|null;
-  constructor(name: string) {
+  constructor(name: Platform.UIString.LocalizedString) {
     super(name);
 
     this.axNode = null;

package/front_end/panels/application/AppManifestView.ts

@@ -925,7 +925,7 @@ export class AppManifestView extends UI.Widget.VBox implements SDK.TargetManager
     return errorMessages;
   }
 
-  private async loadImage(url: string): Promise<{
+  private async loadImage(url: Platform.DevToolsPath.UrlString): Promise<{
     image: HTMLImageElement,
     wrapper: Element,
   }|null> {

package/front_end/panels/application/ApplicationPanelCacheSection.ts

@@ -4,6 +4,7 @@
 
 import type * as Common from '../../core/common/common.js';
 import * as i18n from '../../core/i18n/i18n.js';
+import type * as Platform from '../../core/platform/platform.js';
 import * as SDK from '../../core/sdk/sdk.js';
 import * as UI from '../../ui/legacy/legacy.js';
 import * as ApplicationComponents from './components/components.js';
@@ -131,9 +132,9 @@ export class SWCacheTreeElement extends ApplicationPanelTreeElement {
     this.setLeadingIcons([icon]);
   }
 
-  get itemURL(): string {
+  get itemURL(): Platform.DevToolsPath.UrlString {
     // I don't think this will work at all.
-    return 'cache://' + this.cache.cacheId;
+    return 'cache://' + this.cache.cacheId as Platform.DevToolsPath.UrlString;
   }
 
   onattach(): void {
@@ -184,8 +185,8 @@ export class BackForwardCacheTreeElement extends ApplicationPanelTreeElement {
     this.setLeadingIcons([icon]);
   }
 
-  get itemURL(): string {
-    return 'bfcache://';
+  get itemURL(): Platform.DevToolsPath.UrlString {
+    return 'bfcache://' as Platform.DevToolsPath.UrlString;
   }
 
   onselect(selectedByUser?: boolean): boolean {