chrome-devtools-frontend 1.0.944427 → 1.0.945677

package/front_end/models/bindings/BreakpointManager.ts

@@ -32,7 +32,6 @@
 
 import * as Common from '../../core/common/common.js';
 import * as SDK from '../../core/sdk/sdk.js';
-import type * as Platform from '../../core/platform/platform.js';
 import type * as Protocol from '../../generated/protocol.js';
 import type * as TextUtils from '../text_utils/text_utils.js';
 import * as Workspace from '../workspace/workspace.js';
@@ -630,7 +629,7 @@ export class ModelBreakpoint {
         const positions = debuggerLocations.map(loc => {
           const script = loc.script() as SDK.Script.Script;
           return {
-            url: script.sourceURL as Platform.DevToolsPath.RawPathString,
+            url: script.sourceURL,
             scriptId: script.scriptId,
             scriptHash: script.hash,
             lineNumber: loc.lineNumber,
@@ -645,7 +644,7 @@ export class ModelBreakpoint {
         // at least signal a warning to the developer that this #breakpoint wasn't
         // really resolved.
         const position = {
-          url: this.#breakpoint.url() as Platform.DevToolsPath.RawPathString,
+          url: this.#breakpoint.url(),
           scriptId: '' as Protocol.Runtime.ScriptId,
           scriptHash: '',
           lineNumber,
@@ -794,7 +793,7 @@ export class ModelBreakpoint {
 }
 
 interface Position {
-  url: Platform.DevToolsPath.RawPathString;
+  url: string;
   scriptId: Protocol.Runtime.ScriptId;
   scriptHash: string;
   lineNumber: number;

package/front_end/models/bindings/ResourceMapping.ts

@@ -3,7 +3,6 @@
 // found in the LICENSE file.
 
 import * as Common from '../../core/common/common.js';
-import type * as Platform from '../../core/platform/platform.js';
 import * as SDK from '../../core/sdk/sdk.js';
 import * as TextUtils from '../text_utils/text_utils.js';
 import * as Workspace from '../workspace/workspace.js';
@@ -421,7 +420,7 @@ class Binding implements TextUtils.ContentProvider.ContentProvider {
     return this.resources.values().next().value;
   }
 
-  contentURL(): Platform.DevToolsPath.RawPathString {
+  contentURL(): string {
     return this.firstResource().contentURL();
   }
 

package/front_end/models/bindings/StylesSourceMapping.ts

@@ -29,7 +29,6 @@
  */
 
 import * as Common from '../../core/common/common.js';
-import type * as Platform from '../../core/platform/platform.js';
 import * as SDK from '../../core/sdk/sdk.js';
 import type * as TextUtils from '../text_utils/text_utils.js';
 import * as Workspace from '../workspace/workspace.js';
@@ -298,7 +297,7 @@ export class StyleFile implements TextUtils.ContentProvider.ContentProvider {
     Common.EventTarget.removeEventListeners(this.#eventListeners);
   }
 
-  contentURL(): Platform.DevToolsPath.RawPathString {
+  contentURL(): string {
     console.assert(this.headers.size > 0);
     return this.headers.values().next().value.originalContentProvider().contentURL();
   }

package/front_end/models/emulation/EmulatedDevices.ts

@@ -502,14 +502,12 @@ export class EmulatedDevicesList extends Common.ObjectWrapper.ObjectWrapper<Even
   constructor() {
     super();
 
-    this.#standardSetting = Common.Settings.Settings.instance().createSetting(
-        'standardEmulatedDeviceList', [], Common.Settings.SettingStorageType.Synced);
+    this.#standardSetting = Common.Settings.Settings.instance().createSetting('standardEmulatedDeviceList', []);
     this.#standardInternal = new Set();
     this.listFromJSONV1(this.#standardSetting.get(), this.#standardInternal);
     this.updateStandardDevices();
 
-    this.#customSetting = Common.Settings.Settings.instance().createSetting(
-        'customEmulatedDeviceList', [], Common.Settings.SettingStorageType.Synced);
+    this.#customSetting = Common.Settings.Settings.instance().createSetting('customEmulatedDeviceList', []);
     this.#customInternal = new Set();
     if (!this.listFromJSONV1(this.#customSetting.get(), this.#customInternal)) {
       this.saveCustomDevices();

package/front_end/models/persistence/IsolatedFileSystem.ts

@@ -28,6 +28,8 @@
  * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  */
 
+// TODO(crbug.com/1253323): All casts to UrlString will be removed from this file when migration to branded types is complete.
+
 import * as Common from '../../core/common/common.js';
 import * as Host from '../../core/host/host.js';
 import * as i18n from '../../core/i18n/i18n.js';
@@ -82,7 +84,7 @@ export class IsolatedFileSystem extends PlatformFileSystem {
   constructor(
       manager: IsolatedFileSystemManager, path: string, embedderPath: string, domFileSystem: FileSystem, type: string) {
     // TODO(crbug.com/1253323): Cast to UrlString will be removed when migration to branded types is complete.
-    super(path as Platform.DevToolsPath.UrlString, type);
+    super(path, type);
     this.manager = manager;
     this.embedderPathInternal = embedderPath;
     this.domFileSystem = domFileSystem;
@@ -174,9 +176,8 @@ export class IsolatedFileSystem extends PlatformFileSystem {
               this.initialGitFoldersInternal.add(parentFolder);
             }
             if (this.isFileExcluded(entry.fullPath + '/')) {
-              // TODO(crbug.com/1253323): Cast to RawPathString will be removed when migration to branded types is complete.
               this.excludedEmbedderFolders.push(Common.ParsedURL.ParsedURL.capFilePrefix(
-                  this.path() + entry.fullPath as Platform.DevToolsPath.RawPathString, Host.Platform.isWin()));
+                  this.path() + entry.fullPath as Platform.DevToolsPath.UrlString, Host.Platform.isWin()));
               continue;
             }
             ++pendingRequests;
@@ -552,9 +553,9 @@ export class IsolatedFileSystem extends PlatformFileSystem {
                                              Common.ResourceType.resourceTypes.Document;
   }
 
-  tooltipForURL(url: Platform.DevToolsPath.RawPathString): string {
-    const path =
-        Platform.StringUtilities.trimMiddle(Common.ParsedURL.ParsedURL.capFilePrefix(url, Host.Platform.isWin()), 150);
+  tooltipForURL(url: string): string {
+    const path = Platform.StringUtilities.trimMiddle(
+        Common.ParsedURL.ParsedURL.capFilePrefix(url as Platform.DevToolsPath.UrlString, Host.Platform.isWin()), 150);
     return i18nString(UIStrings.linkedToS, {PH1: path});
   }
 

package/front_end/models/persistence/PersistenceActions.ts

@@ -5,6 +5,7 @@
 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 type * as Platform from '../../core/platform/platform.js';
 import * as SDK from '../../core/sdk/sdk.js';
 
 import type * as TextUtils from '../text_utils/text_utils.js';
@@ -92,7 +93,9 @@ export class ContextMenuProvider implements UI.ContextMenu.Provider {
     const binding = uiSourceCode && PersistenceImpl.instance().binding(uiSourceCode);
     const fileURL = binding ? binding.fileSystem.contentURL() : contentProvider.contentURL();
     if (fileURL.startsWith('file://')) {
-      const path = Common.ParsedURL.ParsedURL.capFilePrefix(fileURL, Host.Platform.isWin());
+      // TODO(crbug.com/1253323): Cast to UrlString will be removed when migration to branded types is complete.
+      const path =
+          Common.ParsedURL.ParsedURL.capFilePrefix(fileURL as Platform.DevToolsPath.UrlString, Host.Platform.isWin());
       contextMenu.revealSection().appendItem(
           i18nString(UIStrings.openInContainingFolder),
           () => Host.InspectorFrontendHost.InspectorFrontendHostInstance.showItemInFolder(path));

package/front_end/models/persistence/PlatformFileSystem.ts

@@ -3,7 +3,6 @@
 // found in the LICENSE file.
 
 import type * as Common from '../../core/common/common.js';
-import type * as Platform from '../../core/platform/platform.js';
 import * as i18n from '../../core/i18n/i18n.js';
 import type * as TextUtils from '../text_utils/text_utils.js';
 
@@ -16,9 +15,9 @@ const UIStrings = {
 const str_ = i18n.i18n.registerUIStrings('models/persistence/PlatformFileSystem.ts', UIStrings);
 const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
 export class PlatformFileSystem {
-  private readonly pathInternal: Platform.DevToolsPath.UrlString;
+  private readonly pathInternal: string;
   private readonly typeInternal: string;
-  constructor(path: Platform.DevToolsPath.UrlString, type: string) {
+  constructor(path: string, type: string) {
     this.pathInternal = path;
     this.typeInternal = type;
   }
@@ -35,7 +34,7 @@ export class PlatformFileSystem {
     return [];
   }
 
-  path(): Platform.DevToolsPath.UrlString {
+  path(): string {
     return this.pathInternal;
   }
 

package/front_end/models/text_utils/ContentProvider.ts

@@ -29,10 +29,9 @@
  */
 
 import type * as Common from '../../core/common/common.js';
-import type * as Platform from '../../core/platform/platform.js';
 
 export abstract class ContentProvider {
-  abstract contentURL(): Platform.DevToolsPath.RawPathString;
+  abstract contentURL(): string;
   abstract contentType(): Common.ResourceType.ResourceType;
   abstract contentEncoded(): Promise<boolean>;
   abstract requestContent(): Promise<DeferredContent>;

package/front_end/models/text_utils/StaticContentProvider.ts

@@ -3,7 +3,6 @@
 // found in the LICENSE file.
 
 import type * as Common from '../../core/common/common.js';
-import type * as Platform from '../../core/platform/platform.js';
 
 import type {ContentProvider, DeferredContent, SearchMatch} from './ContentProvider.js';
 import {performSearchInContent} from './TextUtils.js';
@@ -30,8 +29,8 @@ export class StaticContentProvider implements ContentProvider {
   }
 
   // TODO(crbug.com/1253323): Cast to PawPathString will be removed when migration to branded types is complete.
-  contentURL(): Platform.DevToolsPath.RawPathString {
-    return this.contentURLInternal as Platform.DevToolsPath.RawPathString;
+  contentURL(): string {
+    return this.contentURLInternal;
   }
 
   contentType(): Common.ResourceType.ResourceType {

package/front_end/models/timeline_model/TimelineJSProfile.ts

@@ -59,6 +59,7 @@ export class TimelineJSProfileProcessor {
 
   static generateJSFrameEvents(events: SDK.TracingModel.Event[], config: {
     showAllEvents: boolean,
+    showRuntimeCallStats: boolean,
     showNativeFunctions: boolean,
   }): SDK.TracingModel.Event[] {
     function equalFrames(frame1: Protocol.Runtime.CallFrame, frame2: Protocol.Runtime.CallFrame): boolean {
@@ -84,7 +85,7 @@ export class TimelineJSProfileProcessor {
     const lockedJsStackDepth: number[] = [];
     let ordinal = 0;
     let fakeJSInvocation = false;
-    const {showAllEvents, showNativeFunctions} = config;
+    const {showAllEvents, showRuntimeCallStats, showNativeFunctions} = config;
 
     function onStartEvent(e: SDK.TracingModel.Event): void {
       if (fakeJSInvocation) {
@@ -134,10 +135,15 @@ export class TimelineJSProfileProcessor {
       jsFramesStack.length = depth;
     }
 
+    function showNativeName(name: string): boolean {
+      return showRuntimeCallStats && Boolean(TimelineJSProfileProcessor.nativeGroup(name));
+    }
+
     function filterStackFrames(stack: Protocol.Runtime.CallFrame[]): void {
       if (showAllEvents) {
         return;
       }
+      let previousNativeFrameName: (string|null)|null = null;
       let j = 0;
       for (let i = 0; i < stack.length; ++i) {
         const frame = stack[i];
@@ -147,9 +153,16 @@ export class TimelineJSProfileProcessor {
           continue;
         }
         const isNativeRuntimeFrame = TimelineJSProfileProcessor.isNativeRuntimeFrame(frame);
-        if (!isNativeRuntimeFrame) {
-          stack[j++] = frame;
+        if (isNativeRuntimeFrame && !showNativeName(frame.functionName)) {
+          continue;
+        }
+        const nativeFrameName =
+            isNativeRuntimeFrame ? TimelineJSProfileProcessor.nativeGroup(frame.functionName) : null;
+        if (previousNativeFrameName && previousNativeFrameName === nativeFrameName) {
+          continue;
         }
+        previousNativeFrameName = nativeFrameName;
+        stack[j++] = frame;
       }
       stack.length = j;
     }

package/front_end/models/timeline_model/TimelineModel.ts

@@ -678,6 +678,7 @@ export class TimelineModelImpl {
     if (jsSamples || events.some(e => e.name === RecordType.JSSample)) {
       const jsFrameEvents = TimelineJSProfileProcessor.generateJSFrameEvents(events, {
         showAllEvents: Root.Runtime.experiments.isEnabled('timelineShowAllEvents'),
+        showRuntimeCallStats: Root.Runtime.experiments.isEnabled('timelineV8RuntimeCallStats'),
         showNativeFunctions: Common.Settings.Settings.instance().moduleSetting('showNativeFunctionsInJSProfile').get(),
       });
       if (jsFrameEvents && jsFrameEvents.length) {

package/front_end/models/workspace/UISourceCode.ts

@@ -192,8 +192,8 @@ export class UISourceCode extends Common.ObjectWrapper.ObjectWrapper<EventTypes>
   }
 
   // TODO(crbug.com/1253323): Cast to RawPathString will be removed when migration to branded types is complete.
-  contentURL(): Platform.DevToolsPath.RawPathString {
-    return this.url() as Platform.DevToolsPath.RawPathString;
+  contentURL(): string {
+    return this.url();
   }
 
   contentType(): Common.ResourceType.ResourceType {

package/front_end/models/workspace_diff/WorkspaceDiff.ts

@@ -5,9 +5,14 @@
 import * as Common from '../../core/common/common.js';
 import * as Host from '../../core/host/host.js';
 import * as Diff from '../../third_party/diff/diff.js';
+import * as FormatterModule from '../formatter/formatter.js';
 import * as Persistence from '../persistence/persistence.js';
 import * as Workspace from '../workspace/workspace.js';
 
+interface DiffRequestOptions {
+  shouldFormatDiff: boolean;
+}
+
 export class WorkspaceDiffImpl extends Common.ObjectWrapper.ObjectWrapper<EventTypes> {
   private readonly uiSourceCodeDiffs: WeakMap<Workspace.UISourceCode.UISourceCode, UISourceCodeDiff>;
   private readonly loadingUISourceCodes:
@@ -29,8 +34,9 @@ export class WorkspaceDiffImpl extends Common.ObjectWrapper.ObjectWrapper<EventT
     workspace.uiSourceCodes().forEach(this.updateModifiedState.bind(this));
   }
 
-  requestDiff(uiSourceCode: Workspace.UISourceCode.UISourceCode): Promise<Diff.Diff.DiffArray|null> {
-    return this.uiSourceCodeDiff(uiSourceCode).requestDiff();
+  requestDiff(uiSourceCode: Workspace.UISourceCode.UISourceCode, diffRequestOptions: DiffRequestOptions):
+      Promise<Diff.Diff.DiffArray|null> {
+    return this.uiSourceCodeDiff(uiSourceCode).requestDiff(diffRequestOptions);
   }
 
   subscribeToDiffChange(uiSourceCode: Workspace.UISourceCode.UISourceCode, callback: () => void, thisObj?: Object):
@@ -212,9 +218,9 @@ export class UISourceCodeDiff extends Common.ObjectWrapper.ObjectWrapper<UISourc
     }
   }
 
-  requestDiff(): Promise<Diff.Diff.DiffArray|null> {
+  requestDiff(diffRequestOptions: DiffRequestOptions): Promise<Diff.Diff.DiffArray|null> {
     if (!this.requestDiffPromise) {
-      this.requestDiffPromise = this.innerRequestDiff();
+      this.requestDiffPromise = this.innerRequestDiff(diffRequestOptions);
     }
     return this.requestDiffPromise;
   }
@@ -231,12 +237,12 @@ export class UISourceCodeDiff extends Common.ObjectWrapper.ObjectWrapper<UISourc
     return content.content || ('error' in content && content.error) || '';
   }
 
-  private async innerRequestDiff(): Promise<Diff.Diff.DiffArray|null> {
+  private async innerRequestDiff({shouldFormatDiff}: DiffRequestOptions): Promise<Diff.Diff.DiffArray|null> {
     if (this.dispose) {
       return null;
     }
 
-    const baseline = await this.originalContent();
+    let baseline = await this.originalContent();
     if (baseline === null) {
       return null;
     }
@@ -264,6 +270,14 @@ export class UISourceCodeDiff extends Common.ObjectWrapper.ObjectWrapper<UISourc
     if (current === null || baseline === null) {
       return null;
     }
+    if (shouldFormatDiff) {
+      baseline = (await FormatterModule.ScriptFormatter.format(
+                      this.uiSourceCode.contentType(), this.uiSourceCode.mimeType(), baseline))
+                     .formattedContent;
+      current = (await FormatterModule.ScriptFormatter.format(
+                     this.uiSourceCode.contentType(), this.uiSourceCode.mimeType(), current))
+                    .formattedContent;
+    }
     return Diff.Diff.DiffWrapper.lineDiff(baseline.split(/\r\n|\n|\r/), current.split(/\r\n|\n|\r/));
   }
 }

package/front_end/panels/animation/AnimationTimeline.ts

@@ -332,7 +332,7 @@ export class AnimationTimeline extends UI.Widget.VBox implements SDK.TargetManag
       show: (popover: UI.GlassPane.GlassPane): Promise<boolean> => {
         let animGroup;
         for (const [group, previewUI] of this.#previewMap) {
-          if (previewUI.element === element.parentElement) {
+          if (previewUI.element === element || previewUI.element === element.parentElement) {
             animGroup = group;
           }
         }

package/front_end/panels/animation/animationTimeline.css

@@ -24,6 +24,8 @@
   margin-bottom: -1px;
   background-color: var(--color-background-elevation-1);
   display: flex;
+  flex-direction: column;
+  justify-content: space-around;
   align-items: center;
   flex: 0 0 150px;
 }

package/front_end/panels/application/BackForwardCacheStrings.ts

@@ -424,66 +424,6 @@ const UIStrings = {
       * @description Description text for not restored reason ContentMediaPlay.
       */
   contentMediaPlay: 'A media player was playing upon navigating away.',
-  /**
-      * @description Description text for not restored reason EmbedderPopupBlockerTabHelper.
-      */
-  embedderPopupBlockerTabHelper: 'EmbedderPopupBlockerTabHelper',
-  /**
-      * @description Description text for not restored reason EmbedderSafeBrowsingTriggeredPopupBlocker.
-      */
-  embedderSafeBrowsingTriggeredPopupBlocker: 'EmbedderSafeBrowsingTriggeredPopupBlocker',
-  /**
-      * @description Description text for not restored reason EmbedderSafeBrowsingThreatDetails.
-      */
-  embedderSafeBrowsingThreatDetails: 'EmbedderSafeBrowsingThreatDetails',
-  /**
-      * @description Description text for not restored reason EmbedderAppBannerManager.
-      */
-  embedderAppBannerManager: 'EmbedderAppBannerManager',
-  /**
-      * @description Description text for not restored reason EmbedderDomDistillerViewerSource.
-      */
-  embedderDomDistillerViewerSource: 'EmbedderDomDistillerViewerSource',
-  /**
-      * @description Description text for not restored reason EmbedderDomDistillerSelfDeletingRequestDelegate.
-      */
-  embedderDomDistillerSelfDeletingRequestDelegate: 'EmbedderDomDistillerSelfDeletingRequestDelegate',
-  /**
-      * @description Description text for not restored reason EmbedderOomInterventionTabHelper.
-      */
-  embedderOomInterventionTabHelper: 'EmbedderOomInterventionTabHelper',
-  /**
-      * @description Description text for not restored reason EmbedderOfflinePage.
-      */
-  embedderOfflinePage: 'EmbedderOfflinePage',
-  /**
-      * @description Description text for not restored reason EmbedderChromePasswordManagerClientBindCredentialManager.
-      */
-  embedderChromePasswordManagerClientBindCredentialManager: 'EmbedderChromePasswordManagerClientBindCredentialManager',
-  /**
-      * @description Description text for not restored reason EmbedderPermissionRequestManager.
-      */
-  embedderPermissionRequestManager: 'EmbedderPermissionRequestManager',
-  /**
-      * @description Description text for not restored reason EmbedderModalDialog.
-      */
-  embedderModalDialog: 'EmbedderModalDialog',
-  /**
-      * @description Description text for not restored reason EmbedderExtensions.
-      */
-  embedderExtensions: 'EmbedderExtensions',
-  /**
-      * @description Description text for not restored reason EmbedderExtensionMessaging.
-      */
-  embedderExtensionMessaging: 'EmbedderExtensionMessaging',
-  /**
-      * @description Description text for not restored reason EmbedderExtensionMessagingForOpenPort.
-      */
-  embedderExtensionMessagingForOpenPort: 'EmbedderExtensionMessagingForOpenPort',
-  /**
-      * @description Description text for not restored reason EmbedderExtensionSentMessageToCachedFrame.
-      */
-  embedderExtensionSentMessageToCachedFrame: 'EmbedderExtensionSentMessageToCachedFrame',
 };
 
 const str_ = i18n.i18n.registerUIStrings('panels/application/BackForwardCacheStrings.ts', UIStrings);
@@ -601,23 +541,23 @@ export const NotRestoredReasonDescription = {
   'ContentMediaSession': {name: i18nLazyString(UIStrings.contentMediaSession)},
   'ContentMediaSessionService': {name: i18nLazyString(UIStrings.contentMediaSessionService)},
   'ContentMediaPlay': {name: i18nLazyString(UIStrings.contentMediaPlay)},
-  'EmbedderPopupBlockerTabHelper': {name: i18nLazyString(UIStrings.embedderPopupBlockerTabHelper)},
+  'EmbedderPopupBlockerTabHelper': {name: i18n.i18n.lockedLazyString('EmbedderPopupBlockerTabHelper')},
   'EmbedderSafeBrowsingTriggeredPopupBlocker':
-      {name: i18nLazyString(UIStrings.embedderSafeBrowsingTriggeredPopupBlocker)},
-  'EmbedderSafeBrowsingThreatDetails': {name: i18nLazyString(UIStrings.embedderSafeBrowsingThreatDetails)},
-  'EmbedderAppBannerManager': {name: i18nLazyString(UIStrings.embedderAppBannerManager)},
-  'EmbedderDomDistillerViewerSource': {name: i18nLazyString(UIStrings.embedderDomDistillerViewerSource)},
+      {name: i18n.i18n.lockedLazyString('EmbedderSafeBrowsingTriggeredPopupBlocker')},
+  'EmbedderSafeBrowsingThreatDetails': {name: i18n.i18n.lockedLazyString('EmbedderSafeBrowsingThreatDetails')},
+  'EmbedderAppBannerManager': {name: i18n.i18n.lockedLazyString('EmbedderAppBannerManager')},
+  'EmbedderDomDistillerViewerSource': {name: i18n.i18n.lockedLazyString('EmbedderDomDistillerViewerSource')},
   'EmbedderDomDistillerSelfDeletingRequestDelegate':
-      {name: i18nLazyString(UIStrings.embedderDomDistillerSelfDeletingRequestDelegate)},
-  'EmbedderOomInterventionTabHelper': {name: i18nLazyString(UIStrings.embedderOomInterventionTabHelper)},
-  'EmbedderOfflinePage': {name: i18nLazyString(UIStrings.embedderOfflinePage)},
+      {name: i18n.i18n.lockedLazyString('EmbedderDomDistillerSelfDeletingRequestDelegate')},
+  'EmbedderOomInterventionTabHelper': {name: i18n.i18n.lockedLazyString('EmbedderOomInterventionTabHelper')},
+  'EmbedderOfflinePage': {name: i18n.i18n.lockedLazyString('EmbedderOfflinePage')},
   'EmbedderChromePasswordManagerClientBindCredentialManager':
-      {name: i18nLazyString(UIStrings.embedderChromePasswordManagerClientBindCredentialManager)},
-  'EmbedderPermissionRequestManager': {name: i18nLazyString(UIStrings.embedderPermissionRequestManager)},
-  'EmbedderModalDialog': {name: i18nLazyString(UIStrings.embedderModalDialog)},
-  'EmbedderExtensions': {name: i18nLazyString(UIStrings.embedderExtensions)},
-  'EmbedderExtensionMessaging': {name: i18nLazyString(UIStrings.embedderExtensionMessaging)},
-  'EmbedderExtensionMessagingForOpenPort': {name: i18nLazyString(UIStrings.embedderExtensionMessagingForOpenPort)},
+      {name: i18n.i18n.lockedLazyString('EmbedderChromePasswordManagerClientBindCredentialManager')},
+  'EmbedderPermissionRequestManager': {name: i18n.i18n.lockedLazyString('EmbedderPermissionRequestManager')},
+  'EmbedderModalDialog': {name: i18n.i18n.lockedLazyString('EmbedderModalDialog')},
+  'EmbedderExtensions': {name: i18n.i18n.lockedLazyString('EmbedderExtensions')},
+  'EmbedderExtensionMessaging': {name: i18n.i18n.lockedLazyString('EmbedderExtensionMessaging')},
+  'EmbedderExtensionMessagingForOpenPort': {name: i18n.i18n.lockedLazyString('EmbedderExtensionMessagingForOpenPort')},
   'EmbedderExtensionSentMessageToCachedFrame':
-      {name: i18nLazyString(UIStrings.embedderExtensionSentMessageToCachedFrame)},
+      {name: i18n.i18n.lockedLazyString('EmbedderExtensionSentMessageToCachedFrame')},
 };

package/front_end/panels/application/BackForwardCacheView.ts

@@ -262,7 +262,14 @@ export class BackForwardCacheView extends UI.ThrottledWidget.ThrottledWidget {
 
   private renderReason(explanation: Protocol.Page.BackForwardCacheNotRestoredExplanation): LitHtml.TemplateResult {
     return LitHtml.html`
-      <li>${explanation.reason} : ${
+      <li>
+      <${IconButton.Icon.Icon.litTagName} class="inline-icon" .data=${{
+      iconName: 'circled_exclamation_icon',
+      color: 'orange',
+      width: '16px',
+      height: '16px',
+    } as IconButton.Icon.IconData}></${IconButton.Icon.Icon.litTagName}>
+        ${explanation.reason} : ${
         (explanation.reason in NotRestoredReasonDescription) ?
             LitHtml.html`${NotRestoredReasonDescription[explanation.reason].name()}` :
             LitHtml.nothing} </li>

package/front_end/panels/application/ReportingApiView.ts

@@ -5,22 +5,36 @@
 import * as SDK from '../../core/sdk/sdk.js';
 import * as UI from '../../ui/legacy/legacy.js';
 import * as ApplicationComponents from './components/components.js';
+import type * as Protocol from '../../generated/protocol.js';
 
 import {ReportingApiReportsView} from './ReportingApiReportsView.js';
 
 export class ReportingApiView extends UI.SplitWidget.SplitWidget {
+  private readonly endpointsGrid = new ApplicationComponents.EndpointsGrid.EndpointsGrid();
+  private endpoints: Map<string, Protocol.Network.ReportingApiEndpoint[]>;
+
   constructor() {
     super(/* isVertical: */ false, /* secondIsSidebar: */ true);
+    this.endpoints = new Map();
     const mainTarget = SDK.TargetManager.TargetManager.instance().mainTarget();
     const networkManager = mainTarget && mainTarget.model(SDK.NetworkManager.NetworkManager);
     if (networkManager) {
+      networkManager.addEventListener(
+          SDK.NetworkManager.Events.ReportingApiEndpointsChangedForOrigin,
+          event => this.onEndpointsChangedForOrigin(event.data), this);
+
       const reportingApiReportsView = new ReportingApiReportsView(networkManager);
       const reportingApiEndpointsView = new UI.Widget.VBox();
       reportingApiEndpointsView.setMinimumSize(0, 40);
-      reportingApiEndpointsView.contentElement.appendChild(new ApplicationComponents.EndpointsGrid.EndpointsGrid());
+      reportingApiEndpointsView.contentElement.appendChild(this.endpointsGrid);
       this.setMainWidget(reportingApiReportsView);
       this.setSidebarWidget(reportingApiEndpointsView);
       networkManager.enableReportingApi();
     }
   }
+
+  private onEndpointsChangedForOrigin(data: Protocol.Network.ReportingApiEndpointsChangedForOriginEvent): void {
+    this.endpoints.set(data.origin, data.endpoints);
+    this.endpointsGrid.data = {endpoints: this.endpoints};
+  }
 }

package/front_end/panels/application/components/EndpointsGrid.ts

@@ -3,9 +3,12 @@
 // found in the LICENSE file.
 
 import * as i18n from '../../../core/i18n/i18n.js';
+import * as DataGrid from '../../../ui/components/data_grid/data_grid.js';
 import * as ComponentHelpers from '../../../ui/components/helpers/helpers.js';
 import * as LitHtml from '../../../ui/lit-html/lit-html.js';
 
+import type * as Protocol from '../../../generated/protocol.js';
+
 import reportingApiGridStyles from './reportingApiGrid.css.js';
 
 const UIStrings = {
@@ -20,30 +23,86 @@ export const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
 
 const {render, html} = LitHtml;
 
+export interface EndpointsGridData {
+  endpoints: Map<string, Protocol.Network.ReportingApiEndpoint[]>;
+}
+
 export class EndpointsGrid extends HTMLElement {
   static readonly litTagName = LitHtml.literal`devtools-resources-endpoints-grid`;
 
   private readonly shadow = this.attachShadow({mode: 'open'});
+  private endpoints: Map<string, Protocol.Network.ReportingApiEndpoint[]> = new Map();
 
   connectedCallback(): void {
     this.shadow.adoptedStyleSheets = [reportingApiGridStyles];
     this.render();
   }
 
-  // TODO(crbug.com/1200732): Display info about currently configured endpoints
+  set data(data: EndpointsGridData) {
+    this.endpoints = data.endpoints;
+    this.render();
+  }
+
   private render(): void {
+    const endpointsGridData: DataGrid.DataGridController.DataGridControllerData = {
+      columns: [
+        {
+          id: 'origin',
+          title: i18n.i18n.lockedString('Origin'),
+          widthWeighting: 30,
+          hideable: false,
+          visible: true,
+        },
+        {
+          id: 'name',
+          title: i18n.i18n.lockedString('Name'),
+          widthWeighting: 20,
+          hideable: false,
+          visible: true,
+        },
+        {
+          id: 'url',
+          title: i18n.i18n.lockedString('URL'),
+          widthWeighting: 30,
+          hideable: false,
+          visible: true,
+        },
+      ],
+      rows: this.buildReportRows(),
+    };
+
     // Disabled until https://crbug.com/1079231 is fixed.
     // clang-format off
     render(html`
       <div class="reporting-container">
         <div class="reporting-header">${i18n.i18n.lockedString('Endpoints')}</div>
-        <div class="reporting-placeholder">
-          <div>${i18nString(UIStrings.noEndpointsToDisplay)}</div>
-        </div>
+        ${this.endpoints.size > 0 ? html`
+          <${DataGrid.DataGridController.DataGridController.litTagName} .data=${
+              endpointsGridData as DataGrid.DataGridController.DataGridControllerData}>
+          </${DataGrid.DataGridController.DataGridController.litTagName}>
+        ` : html`
+          <div class="reporting-placeholder">
+            <div>${i18nString(UIStrings.noEndpointsToDisplay)}</div>
+          </div>
+        `}
       </div>
     `, this.shadow);
     // clang-format on
   }
+
+  private buildReportRows(): DataGrid.DataGridUtils.Row[] {
+    return Array.from(this.endpoints)
+        .map(([origin, endpointArray]) => endpointArray.map(endpoint => {
+          return {
+            cells: [
+              {columnId: 'origin', value: origin},
+              {columnId: 'name', value: endpoint.groupName},
+              {columnId: 'url', value: endpoint.url},
+            ],
+          };
+        }))
+        .flat();
+  }
 }
 
 ComponentHelpers.CustomElements.defineComponent('devtools-resources-endpoints-grid', EndpointsGrid);