chrome-devtools-frontend 1.0.1001476 → 1.0.1002543

package/front_end/panels/elements/StylePropertyTreeElement.ts

@@ -848,45 +848,46 @@ export class StylePropertyTreeElement extends UI.TreeOutline.TreeElement {
       return;
     }
 
+    const contextMenu = this.createCopyContextMenu(event);
+    void contextMenu.show();
+  }
+
+  createCopyContextMenu(event: Event): UI.ContextMenu.ContextMenu {
     const contextMenu = new UI.ContextMenu.ContextMenu(event);
-    contextMenu.clipboardSection().appendItem(i18nString(UIStrings.copyDeclaration), () => {
+    contextMenu.headerSection().appendItem(i18nString(UIStrings.copyDeclaration), () => {
       const propertyText = `${this.property.name}: ${this.property.value};`;
       Host.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(propertyText);
       Host.userMetrics.styleTextCopied(Host.UserMetrics.StyleTextCopied.DeclarationViaContextMenu);
     });
 
-    contextMenu.clipboardSection().appendItem(i18nString(UIStrings.copyProperty), () => {
+    contextMenu.headerSection().appendItem(i18nString(UIStrings.copyProperty), () => {
       Host.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(this.property.name);
       Host.userMetrics.styleTextCopied(Host.UserMetrics.StyleTextCopied.PropertyViaContextMenu);
     });
 
-    contextMenu.clipboardSection().appendItem(i18nString(UIStrings.copyValue), () => {
+    contextMenu.headerSection().appendItem(i18nString(UIStrings.copyValue), () => {
       Host.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(this.property.value);
       Host.userMetrics.styleTextCopied(Host.UserMetrics.StyleTextCopied.ValueViaContextMenu);
     });
 
-    contextMenu.defaultSection().appendItem(i18nString(UIStrings.copyRule), () => {
+    contextMenu.headerSection().appendItem(i18nString(UIStrings.copyRule), () => {
       const section = (this.section() as StylePropertiesSection);
       const ruleText = StylesSidebarPane.formatLeadingProperties(section).ruleText;
       Host.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(ruleText);
       Host.userMetrics.styleTextCopied(Host.UserMetrics.StyleTextCopied.RuleViaContextMenu);
     });
 
-    contextMenu.defaultSection().appendItem(i18nString(UIStrings.copyAllDeclarations), () => {
+    contextMenu.headerSection().appendItem(
+        i18nString(UIStrings.copyCssDeclarationAsJs), this.copyCssDeclarationAsJs.bind(this));
+
+    contextMenu.clipboardSection().appendItem(i18nString(UIStrings.copyAllDeclarations), () => {
       const section = (this.section() as StylePropertiesSection);
       const allDeclarationText = StylesSidebarPane.formatLeadingProperties(section).allDeclarationText;
       Host.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(allDeclarationText);
       Host.userMetrics.styleTextCopied(Host.UserMetrics.StyleTextCopied.AllDeclarationsViaContextMenu);
     });
 
-    contextMenu.defaultSection().appendItem(i18nString(UIStrings.viewComputedValue), () => {
-      void this.viewComputedValue();
-    });
-
     contextMenu.clipboardSection().appendItem(
-        i18nString(UIStrings.copyCssDeclarationAsJs), this.copyCssDeclarationAsJs.bind(this));
-
-    contextMenu.defaultSection().appendItem(
         i18nString(UIStrings.copyAllCssDeclarationsAsJs), this.copyAllCssDeclarationAsJs.bind(this));
 
     // TODO(changhaohan): conditionally add this item only when there are changes to copy
@@ -896,7 +897,11 @@ export class StylePropertyTreeElement extends UI.TreeOutline.TreeElement {
       Host.userMetrics.styleTextCopied(Host.UserMetrics.StyleTextCopied.AllChangesViaStylesPane);
     });
 
-    void contextMenu.show();
+    contextMenu.footerSection().appendItem(i18nString(UIStrings.viewComputedValue), () => {
+      void this.viewComputedValue();
+    });
+
+    return contextMenu;
   }
 
   private async viewComputedValue(): Promise<void> {
@@ -1513,6 +1518,7 @@ export class StylePropertyTreeElement extends UI.TreeOutline.TreeElement {
     }
     if (updatedProperty) {
       this.listItemElement.classList.toggle('changed', this.isPropertyChanged(updatedProperty));
+      this.parentPane().updateChangeStatus();
     }
 
     this.matchedStylesInternal.resetActiveProperties();

package/front_end/panels/elements/StylesSidebarPane.ts

@@ -147,6 +147,14 @@ const UIStrings = {
   */
   automaticDarkMode: 'Automatic dark mode',
   /**
+  *@description Tooltip text that appears when hovering over the css changes button in the Styles Sidebar Pane of the Elements panel
+  */
+  copyAllCSSChanges: 'Copy all the CSS changes',
+  /**
+  *@description Tooltip text that appears after clicking on the copy CSS changes button
+  */
+  copiedToClipboard: 'Copied to clipboard',
+  /**
   *@description Text displayed on layer separators in the styles sidebar pane.
   */
   layer: 'Layer',
@@ -207,6 +215,7 @@ export class StylesSidebarPane extends Common.ObjectWrapper.eventMixin<EventType
   private readonly imagePreviewPopover: ImagePreviewPopover;
   activeCSSAngle: InlineEditor.CSSAngle.CSSAngle|null;
   #urlToChangeTracker: Map<Platform.DevToolsPath.UrlString, ChangeTracker> = new Map();
+  #copyChangesButton?: UI.Toolbar.ToolbarButton;
 
   static instance(): StylesSidebarPane {
     if (!stylesSidebarPaneInstance) {
@@ -579,6 +588,11 @@ export class StylesSidebarPane extends Common.ObjectWrapper.eventMixin<EventType
     if (!this.initialUpdateCompleted) {
       this.initialUpdateCompleted = true;
       this.appendToolbarItem(this.createRenderingShortcuts());
+      if (Root.Runtime.experiments.isEnabled(Root.Runtime.ExperimentName.STYLES_PANE_CSS_CHANGES)) {
+        this.#copyChangesButton = this.createCopyAllChangesButton();
+        this.appendToolbarItem(this.#copyChangesButton);
+        this.#copyChangesButton.element.classList.add('hidden');
+      }
       this.dispatchEventToListeners(Events.InitialUpdateCompleted);
     }
 
@@ -1109,6 +1123,22 @@ export class StylesSidebarPane extends Common.ObjectWrapper.eventMixin<EventType
     return changedLines.has(formattedLineNumber + 1);
   }
 
+  updateChangeStatus(): void {
+    if (!this.#copyChangesButton) {
+      return;
+    }
+
+    let hasChangedStyles = false;
+    for (const changeTracker of this.#urlToChangeTracker.values()) {
+      if (changeTracker.changedLines.size > 0) {
+        hasChangedStyles = true;
+        break;
+      }
+    }
+
+    this.#copyChangesButton.element.classList.toggle('hidden', !hasChangedStyles);
+  }
+
   private async refreshChangedLines(uiSourceCode: Workspace.UISourceCode.UISourceCode): Promise<void> {
     const changeTracker = this.#urlToChangeTracker.get(uiSourceCode.url());
     if (!changeTracker) {
@@ -1290,6 +1320,29 @@ export class StylesSidebarPane extends Common.ObjectWrapper.eventMixin<EventType
 
     return button;
   }
+
+  private createCopyAllChangesButton(): UI.Toolbar.ToolbarButton {
+    const copyAllChangesButton =
+        new UI.Toolbar.ToolbarButton(i18nString(UIStrings.copyAllCSSChanges), 'largeicon-copy');
+    // TODO(1296947): implement a dedicated component to share between all copy buttons
+    copyAllChangesButton.element.setAttribute('data-content', i18nString(UIStrings.copiedToClipboard));
+    let timeout: number|undefined;
+    copyAllChangesButton.addEventListener(UI.Toolbar.ToolbarButton.Events.Click, async () => {
+      const allChanges = await this.getFormattedChanges();
+      Host.InspectorFrontendHost.InspectorFrontendHostInstance.copyText(allChanges);
+      Host.userMetrics.styleTextCopied(Host.UserMetrics.StyleTextCopied.AllChangesViaStylesPane);
+      if (timeout) {
+        clearTimeout(timeout);
+        timeout = undefined;
+      }
+      copyAllChangesButton.element.classList.add('copied-to-clipboard');
+      timeout = window.setTimeout(() => {
+        copyAllChangesButton.element.classList.remove('copied-to-clipboard');
+        timeout = undefined;
+      }, 2000);
+    });
+    return copyAllChangesButton;
+  }
 }
 
 export const enum Events {

package/front_end/panels/issues/AffectedResourcesView.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 IssuesManager from '../../models/issues_manager/issues_manager.js';
 import * as Logs from '../../models/logs/logs.js';
@@ -44,7 +45,7 @@ export const enum AffectedItem {
   Source = 'Source',
 }
 
-export const extractShortPath = (path: string): string => {
+export const extractShortPath = (path: Platform.DevToolsPath.UrlString): string => {
   // 1st regex matches everything after last '/'
   // if path ends with '/', 2nd regex returns everything between the last two '/'
   return (/[^/]+$/.exec(path) || /[^/]+\/$/.exec(path) || [''])[0];
@@ -255,8 +256,8 @@ export abstract class AffectedResourcesView extends UI.TreeOutline.TreeElement {
       // TODO(crbug.com/1108503): Add some mechanism to be able to add telemetry to this element.
       const linkifier = new Components.Linkifier.Linkifier(maxLengthForDisplayedURLs);
       const sourceAnchor = linkifier.linkifyScriptLocation(
-          target || null, sourceLocation.scriptId || null, sourceLocation.url, sourceLocation.lineNumber,
-          {columnNumber: sourceLocation.columnNumber, inlineFrameIndex: 0});
+          target || null, sourceLocation.scriptId || null, sourceLocation.url as Platform.DevToolsPath.UrlString,
+          sourceLocation.lineNumber, {columnNumber: sourceLocation.columnNumber, inlineFrameIndex: 0});
       sourceCodeLocation.appendChild(sourceAnchor);
     }
     element.appendChild(sourceCodeLocation);

package/front_end/panels/issues/AffectedSourcesView.ts

@@ -42,7 +42,8 @@ export class AffectedSourcesView extends AffectedResourcesView {
     // Also, this element has a context menu, so we should be able to
     // track when the user use the context menu too.
     // TODO(crbug.com/1108503): Add some mechanism to be able to add telemetry to this element.
-    const anchorElement = Components.Linkifier.Linkifier.linkifyURL(url, linkifierURLOptions);
+    const anchorElement =
+        Components.Linkifier.Linkifier.linkifyURL(url as Platform.DevToolsPath.UrlString, linkifierURLOptions);
     cellElement.appendChild(anchorElement);
     const rowElement = document.createElement('tr');
     rowElement.classList.add('affected-resource-source');

package/front_end/panels/issues/AttributionReportingIssueDetailsView.ts

@@ -27,21 +27,6 @@ const UIStrings = {
    * @description Noun, label for the column showing the associated network request in the issue details table.
    */
   request: 'Request',
-  /**
-   * @description Label for the column showing the invalid value used as the 'attributionsourceeventid' attribute
-   * on an anchor HTML element ("a link").
-   */
-  invalidSourceEventId: 'Invalid `attributionsourceeventid`',
-  /**
-   * @description Label for the column showing the invalid value used as the 'attributionexpiry' attribute
-   * on an anchor HTML element ("a link").
-   */
-  invalidSourceExpiry: 'Invalid `attributionexpiry`',
-  /**
-   * @description Label for the column showing the invalid value used as the 'attributionpriority' attribute
-   * on an anchor HTML element ("a link").
-   */
-  invalidSourcePriority: 'Invalid `attributionsourcepriority`',
   /**
    * @description Label for the column showing the invalid URL used in an HTML anchor element ("a link").
    * A origin is (roughly said) the front part of a URL.
@@ -89,21 +74,6 @@ export class AttributionReportingIssueDetailsView extends AffectedResourcesView
         this.appendColumnTitle(header, i18nString(UIStrings.element));
         this.appendColumnTitle(header, i18nString(UIStrings.untrustworthyOrigin));
         break;
-      case IssuesManager.AttributionReportingIssue.IssueCode.InvalidAttributionSourceEventId:
-        this.appendColumnTitle(header, i18nString(UIStrings.frame));
-        this.appendColumnTitle(header, i18nString(UIStrings.element));
-        this.appendColumnTitle(header, i18nString(UIStrings.invalidSourceEventId));
-        break;
-      case IssuesManager.AttributionReportingIssue.IssueCode.InvalidAttributionSourceExpiry:
-        this.appendColumnTitle(header, i18nString(UIStrings.frame));
-        this.appendColumnTitle(header, i18nString(UIStrings.element));
-        this.appendColumnTitle(header, i18nString(UIStrings.invalidSourceExpiry));
-        break;
-      case IssuesManager.AttributionReportingIssue.IssueCode.InvalidAttributionSourcePriority:
-        this.appendColumnTitle(header, i18nString(UIStrings.frame));
-        this.appendColumnTitle(header, i18nString(UIStrings.element));
-        this.appendColumnTitle(header, i18nString(UIStrings.invalidSourcePriority));
-        break;
       case IssuesManager.AttributionReportingIssue.IssueCode.PermissionPolicyDisabled:
         this.appendColumnTitle(header, i18nString(UIStrings.frame));
         this.appendColumnTitle(header, i18nString(UIStrings.element));
@@ -129,11 +99,6 @@ export class AttributionReportingIssueDetailsView extends AffectedResourcesView
     const details = issue.issueDetails;
 
     switch (issueCode) {
-      case IssuesManager.AttributionReportingIssue.IssueCode.AttributionUntrustworthyFrameOrigin:
-        this.#appendFrameOrEmptyCell(element, issue);
-        this.#appendRequestOrEmptyCell(element, details.request);
-        this.appendIssueDetailCell(element, details.invalidParameter || '');
-        break;
       case IssuesManager.AttributionReportingIssue.IssueCode.AttributionSourceUntrustworthyOrigin:
         await this.#appendElementOrEmptyCell(element, issue);
         this.appendIssueDetailCell(element, details.invalidParameter || '');
@@ -142,14 +107,6 @@ export class AttributionReportingIssueDetailsView extends AffectedResourcesView
         this.#appendRequestOrEmptyCell(element, details.request);
         this.appendIssueDetailCell(element, details.invalidParameter || '');
         break;
-      case IssuesManager.AttributionReportingIssue.IssueCode.AttributionSourceUntrustworthyFrameOrigin:
-      case IssuesManager.AttributionReportingIssue.IssueCode.InvalidAttributionSourceEventId:
-      case IssuesManager.AttributionReportingIssue.IssueCode.InvalidAttributionSourceExpiry:
-      case IssuesManager.AttributionReportingIssue.IssueCode.InvalidAttributionSourcePriority:
-        this.#appendFrameOrEmptyCell(element, issue);
-        await this.#appendElementOrEmptyCell(element, issue);
-        this.appendIssueDetailCell(element, details.invalidParameter || '');
-        break;
       case IssuesManager.AttributionReportingIssue.IssueCode.PermissionPolicyDisabled:
         this.#appendFrameOrEmptyCell(element, issue);
         await this.#appendElementOrEmptyCell(element, issue);

package/front_end/panels/issues/IssueView.ts

@@ -181,7 +181,7 @@ class AffectedMixedContentView extends AffectedResourcesView {
         },
       }));
     } else {
-      const filename = extractShortPath(mixedContent.insecureURL);
+      const filename = extractShortPath(mixedContent.insecureURL as Platform.DevToolsPath.UrlString);
       const cell = this.appendIssueDetailCell(element, filename, 'affected-resource-mixed-content-info');
       cell.title = mixedContent.insecureURL;
     }

package/front_end/panels/lighthouse/LighthouseController.ts

@@ -4,6 +4,7 @@
 
 import * 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 Protocol from '../../generated/protocol.js';
 
@@ -508,7 +509,7 @@ export const RuntimeSettings: RuntimeSetting[] = [
         value: 'snapshot',
       },
     ],
-    learnMore: 'https://web.dev/lighthouse-user-flows/',
+    learnMore: 'https://web.dev/lighthouse-user-flows/' as Platform.DevToolsPath.UrlString,
   },
   {
     // This setting is disabled, but we keep it around to show in the UI.
@@ -517,7 +518,8 @@ export const RuntimeSettings: RuntimeSetting[] = [
     title: i18nLazyString(UIStrings.simulatedThrottling),
     // We will disable this when we have a Lantern trace viewer within DevTools.
     learnMore:
-        'https://github.com/GoogleChrome/lighthouse/blob/master/docs/throttling.md#devtools-lighthouse-panel-throttling',
+        'https://github.com/GoogleChrome/lighthouse/blob/master/docs/throttling.md#devtools-lighthouse-panel-throttling' as
+        Platform.DevToolsPath.UrlString,
     description: i18nLazyString(UIStrings.simulateASlowerPageLoadBasedOn),
     setFlags: (flags: Flags, value: string|boolean): void => {
       flags.throttlingMethod = value ? 'simulate' : 'devtools';
@@ -600,5 +602,5 @@ export interface RuntimeSetting {
     tooltip?: () => Common.UIString.LocalizedString,
   }[];
   title?: () => Common.UIString.LocalizedString;
-  learnMore?: string;
+  learnMore?: Platform.DevToolsPath.UrlString;
 }

package/front_end/panels/lighthouse/LighthouseReporterTypes.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';
 
 export class LighthouseReportGenerator {
@@ -80,7 +81,7 @@ export interface NodeDetailsJSON {
   snippet?: string;
 }
 export interface SourceLocationDetailsJSON {
-  sourceUrl?: string;
+  sourceUrl?: Platform.DevToolsPath.UrlString;
   sourceLine?: string;
   sourceColumn?: string;
 }

package/front_end/panels/lighthouse/lighthousePanel.css

@@ -50,3 +50,7 @@ button.view-trace {
 .lighthouse-toolbar-container > :first-child {
   flex: 1 1 auto;
 }
+
+.lh-devtools .lh-element-screenshot__overlay {
+  position: absolute;
+}

package/front_end/panels/profiler/HeapSnapshotGridNodes.ts

@@ -1299,8 +1299,8 @@ export class AllocationGridNode extends HeapSnapshotGridNode {
       const linkifier = (this.dataGridInternal as AllocationDataGrid).linkifier;
       const urlElement = linkifier.linkifyScriptLocation(
           heapProfilerModel ? heapProfilerModel.target() : null,
-          String(allocationNode.scriptId) as Protocol.Runtime.ScriptId, allocationNode.scriptName,
-          allocationNode.line - 1, {
+          String(allocationNode.scriptId) as Protocol.Runtime.ScriptId,
+          allocationNode.scriptName as Platform.DevToolsPath.UrlString, allocationNode.line - 1, {
             columnNumber: allocationNode.column - 1,
             inlineFrameIndex: 0,
             className: 'profile-node-file',

package/front_end/panels/profiler/HeapSnapshotView.ts

@@ -1904,7 +1904,8 @@ export class HeapAllocationStackView extends UI.Widget.Widget {
       const target = this.heapProfilerModel ? this.heapProfilerModel.target() : null;
       const options = {columnNumber: frame.column - 1, inlineFrameIndex: 0};
       const urlElement = this.linkifier.linkifyScriptLocation(
-          target, String(frame.scriptId) as Protocol.Runtime.ScriptId, frame.scriptName, frame.line - 1, options);
+          target, String(frame.scriptId) as Protocol.Runtime.ScriptId,
+          frame.scriptName as Platform.DevToolsPath.UrlString, frame.line - 1, options);
       frameDiv.appendChild(urlElement);
       stackFrameToURLElement.set(frameDiv, urlElement);
       frameDiv.addEventListener('contextmenu', this.onContextMenu.bind(this, urlElement));

package/front_end/panels/profiler/ProfileDataGrid.ts

@@ -65,7 +65,7 @@ export class ProfileDataGridNode extends DataGrid.DataGrid.DataGridNode<unknown>
   total: number;
   functionName: string;
   readonly deoptReason: string;
-  url: string;
+  url: Platform.DevToolsPath.UrlString;
   linkElement: Element|null;
   populated: boolean;
   savedSelf?: number;

package/front_end/panels/security/SecurityPanel.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 * as Protocol from '../../generated/protocol.js';
 import * as NetworkForward from '../../panels/network/forward/forward.js';
@@ -513,7 +514,7 @@ export class SecurityPanel extends UI.Panel.PanelWithSidebar implements
     return certificateButton;
   }
 
-  static createHighlightedUrl(url: string, securityState: string): Element {
+  static createHighlightedUrl(url: Platform.DevToolsPath.UrlString, securityState: string): Element {
     const schemeSeparator = '://';
     const index = url.indexOf(schemeSeparator);
 
@@ -548,7 +549,7 @@ export class SecurityPanel extends UI.Panel.PanelWithSidebar implements
     // The sidebar element will trigger displaying the main view. Rather than making a redundant call to display the main view, we rely on this.
     this.sidebarMainViewElement.select(true);
   }
-  showOrigin(origin: string): void {
+  showOrigin(origin: Platform.DevToolsPath.UrlString): void {
     const originState = this.origins.get(origin);
     if (!originState) {
       return;
@@ -820,7 +821,7 @@ export class SecurityPanelSidebarTree extends UI.TreeOutline.TreeOutlineInShadow
     }
   }
 
-  addOrigin(origin: string, securityState: Protocol.Security.SecurityState): void {
+  addOrigin(origin: Platform.DevToolsPath.UrlString, securityState: Protocol.Security.SecurityState): void {
     const originElement = new SecurityPanelSidebarTreeElement(
         SecurityPanel.createHighlightedUrl(origin, securityState), this.showOriginInPanel.bind(this, origin),
         'security-sidebar-tree-item', 'security-property');
@@ -1394,7 +1395,7 @@ export class SecurityMainView extends UI.Widget.VBox {
 export class SecurityOriginView extends UI.Widget.VBox {
   private readonly panel: SecurityPanel;
   private readonly originLockIcon: HTMLElement;
-  constructor(panel: SecurityPanel, origin: string, originState: OriginState) {
+  constructor(panel: SecurityPanel, origin: Platform.DevToolsPath.UrlString, originState: OriginState) {
     super();
     this.panel = panel;
     this.setMinimumSize(200, 100);
@@ -1657,4 +1658,4 @@ export interface OriginState {
   originView?: SecurityOriginView|null;
 }
 
-export type Origin = string;
+export type Origin = Platform.DevToolsPath.UrlString;

package/front_end/panels/settings/SettingsScreen.ts

@@ -511,9 +511,8 @@ export class ActionDelegate implements UI.ActionRegistration.ActionDelegate {
         return true;
       // TODO(crbug.com/1253323): Cast to UrlString will be removed when migration to branded types is complete.
       case 'settings.documentation':
-        Host.InspectorFrontendHost.InspectorFrontendHostInstance.openInNewTab(
-            UI.UIUtils.addReferrerToURL('https://developer.chrome.com/docs/devtools/') as
-            Platform.DevToolsPath.UrlString);
+        Host.InspectorFrontendHost.InspectorFrontendHostInstance.openInNewTab(UI.UIUtils.addReferrerToURL(
+            'https://developer.chrome.com/docs/devtools/' as Platform.DevToolsPath.UrlString));
         return true;
       case 'settings.shortcuts':
         void SettingsScreen.showSettingsScreen({name: 'keybinds', focusTabHeader: true});

package/front_end/panels/timeline/PerformanceModel.ts

@@ -75,18 +75,14 @@ export class PerformanceModel extends Common.ObjectWrapper.ObjectWrapper<EventTy
     this.tracingModelInternal = model;
     this.timelineModelInternal.setEvents(model);
 
-    let inputEvents: SDK.TracingModel.AsyncEvent[]|null = null;
     let animationEvents: SDK.TracingModel.AsyncEvent[]|null = null;
     for (const track of this.timelineModelInternal.tracks()) {
-      if (track.type === TimelineModel.TimelineModel.TrackType.Input) {
-        inputEvents = track.asyncEvents;
-      }
       if (track.type === TimelineModel.TimelineModel.TrackType.Animation) {
         animationEvents = track.asyncEvents;
       }
     }
-    if (inputEvents || animationEvents) {
-      this.irModel.populate(inputEvents || [], animationEvents || []);
+    if (animationEvents) {
+      this.irModel.populate([], animationEvents || []);
     }
 
     const mainTracks = this.timelineModelInternal.tracks().filter(

package/front_end/panels/timeline/TimelineFlameChartDataProvider.ts

@@ -54,10 +54,6 @@ const UIStrings = {
   */
   onIgnoreList: 'On ignore list',
   /**
-  *@description Text in Timeline Flame Chart Data Provider of the Performance panel
-  */
-  input: 'Input',
-  /**
   *@description Text that refers to the animation of the web page
   */
   animation: 'Animation',
@@ -428,10 +424,8 @@ export class TimelineFlameChartDataProvider extends Common.ObjectWrapper.ObjectW
 
     const eventEntryType = EntryType.Event;
 
-    const weight = (track: TimelineModel.TimelineModel.Track): 0|1|2|3|4|5|6|7|8|9|10|- 1 => {
+    const weight = (track: TimelineModel.TimelineModel.Track): 1|2|3|4|5|6|7|8|9|10|- 1 => {
       switch (track.type) {
-        case TimelineModel.TimelineModel.TrackType.Input:
-          return 0;
         case TimelineModel.TimelineModel.TrackType.Animation:
           return 1;
         case TimelineModel.TimelineModel.TrackType.Timings:
@@ -464,13 +458,6 @@ export class TimelineFlameChartDataProvider extends Common.ObjectWrapper.ObjectW
     let rasterCount = 0;
     for (const track of tracks) {
       switch (track.type) {
-        case TimelineModel.TimelineModel.TrackType.Input: {
-          this.appendAsyncEventsGroup(
-              track, i18nString(UIStrings.input), track.asyncEvents, this.interactionsHeaderLevel2, eventEntryType,
-              false /* selectable */);
-          break;
-        }
-
         case TimelineModel.TimelineModel.TrackType.Animation: {
           this.appendAsyncEventsGroup(
               track, i18nString(UIStrings.animation), track.asyncEvents, this.interactionsHeaderLevel2, eventEntryType,

package/front_end/panels/timeline/TimelineUIUtils.ts

@@ -1918,7 +1918,8 @@ export class TimelineUIUtils {
         null {
       const options =
           {columnNumber, showColumnNumber: true, inlineFrameIndex: 0, className: 'timeline-details', tabStop: true};
-      return linkifier.linkifyScriptLocation(target, scriptId, url, lineNumber, options);
+      return linkifier.linkifyScriptLocation(
+          target, scriptId, url as Platform.DevToolsPath.UrlString, lineNumber, options);
     }
 
     function linkifyTopCallFrame(): Element|null {
@@ -1931,7 +1932,7 @@ export class TimelineUIUtils {
   }
 
   static buildDetailsNodeForPerformanceEvent(event: SDK.TracingModel.Event): Element {
-    let link: string = 'https://web.dev/user-centric-performance-metrics/';
+    let link = 'https://web.dev/user-centric-performance-metrics/';
     let name = 'page performance metrics';
     const recordType = TimelineModel.TimelineModel.RecordType;
     switch (event.name) {
@@ -2029,7 +2030,7 @@ export class TimelineUIUtils {
     const eventData = event.args['data'];
     const timelineData = TimelineModel.TimelineModel.TimelineData.forEvent(event);
     const initiator = timelineData.initiator();
-    let url: (string|null)|null = null;
+    let url: Platform.DevToolsPath.UrlString|null = null;
 
     if (timelineData.warning) {
       contentHelper.appendWarningRow(event);
@@ -2137,7 +2138,7 @@ export class TimelineUIUtils {
       }
 
       case recordTypes.CompileScript: {
-        url = eventData && eventData['url'];
+        url = eventData && eventData['url'] as Platform.DevToolsPath.UrlString;
         if (url) {
           contentHelper.appendLocationRow(
               i18nString(UIStrings.script), url, eventData['lineNumber'], eventData['columnNumber']);
@@ -2154,7 +2155,7 @@ export class TimelineUIUtils {
       }
 
       case recordTypes.CacheModule: {
-        url = eventData && eventData['url'];
+        url = eventData && eventData['url'] as Platform.DevToolsPath.UrlString;
         contentHelper.appendTextRow(
             i18nString(UIStrings.compilationCacheSize),
             Platform.NumberUtilities.bytesToString(eventData['producedCacheSize']));
@@ -2162,7 +2163,7 @@ export class TimelineUIUtils {
       }
 
       case recordTypes.CacheScript: {
-        url = eventData && eventData['url'];
+        url = eventData && eventData['url'] as Platform.DevToolsPath.UrlString;
         if (url) {
           contentHelper.appendLocationRow(
               i18nString(UIStrings.script), url, eventData['lineNumber'], eventData['columnNumber']);
@@ -2174,7 +2175,7 @@ export class TimelineUIUtils {
       }
 
       case recordTypes.EvaluateScript: {
-        url = eventData && eventData['url'];
+        url = eventData && eventData['url'] as Platform.DevToolsPath.UrlString;
         if (url) {
           contentHelper.appendLocationRow(
               i18nString(UIStrings.script), url, eventData['lineNumber'], eventData['columnNumber']);
@@ -2188,7 +2189,7 @@ export class TimelineUIUtils {
       case recordTypes.WasmModuleCacheHit:
       case recordTypes.WasmModuleCacheInvalid: {
         if (eventData) {
-          url = event.args['url'];
+          url = event.args['url'] as Platform.DevToolsPath.UrlString;
           if (url) {
             contentHelper.appendTextRow(i18nString(UIStrings.url), url);
           }
@@ -2242,7 +2243,7 @@ export class TimelineUIUtils {
       }
 
       case recordTypes.ParseAuthorStyleSheet: {
-        url = eventData['styleSheetUrl'];
+        url = eventData['styleSheetUrl'] as Platform.DevToolsPath.UrlString;
         if (url) {
           const options = {
             tabStop: true,
@@ -2911,7 +2912,7 @@ export class TimelineUIUtils {
     }
     const imageURLPromise = snapshotWithRect.snapshot.replay();
     snapshotWithRect.snapshot.release();
-    const imageURL = await imageURLPromise;
+    const imageURL = await imageURLPromise as Platform.DevToolsPath.UrlString;
     if (!imageURL) {
       return null;
     }
@@ -3662,14 +3663,15 @@ export class TimelineDetailsContentHelper {
       showColumnNumber: true,
       inlineFrameIndex: 0,
     };
-    const link = this.linkifierInternal.maybeLinkifyScriptLocation(this.target, null, url, startLine, options);
+    const link = this.linkifierInternal.maybeLinkifyScriptLocation(
+        this.target, null, url as Platform.DevToolsPath.UrlString, startLine, options);
     if (!link) {
       return;
     }
     this.appendElementRow(title, link);
   }
 
-  appendLocationRange(title: string, url: string, startLine: number, endLine?: number): void {
+  appendLocationRange(title: string, url: Platform.DevToolsPath.UrlString, startLine: number, endLine?: number): void {
     if (!this.linkifierInternal || !this.target) {
       return;
     }