chrome-devtools-frontend 1.0.998142 → 1.0.999279

package/front_end/panels/application/IndexedDBViews.ts

@@ -28,14 +28,17 @@
  * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
  */
 
-import indexedDBViewsStyles from './indexedDBViews.css.js';
 import * as i18n from '../../core/i18n/i18n.js';
+
+import indexedDBViewsStyles from './indexedDBViews.css.js';
+
 import type * as SDK from '../../core/sdk/sdk.js';
 import * as DataGrid from '../../ui/legacy/components/data_grid/data_grid.js';
 import * as ObjectUI from '../../ui/legacy/components/object_ui/object_ui.js';
 import * as UI from '../../ui/legacy/legacy.js';
 
-import type {Database, DatabaseId, Entry, Index, IndexedDBModel, ObjectStore, ObjectStoreMetadata} from './IndexedDBModel.js';
+import type {
+  Database, DatabaseId, Entry, Index, IndexedDBModel, ObjectStore, ObjectStoreMetadata} from './IndexedDBModel.js';
 
 const UIStrings = {
   /**

package/front_end/panels/console/ConsoleView.ts

@@ -56,7 +56,15 @@ import {ConsoleFilter, FilterType} from './ConsoleFilter.js';
 import {ConsolePinPane} from './ConsolePinPane.js';
 import {ConsolePrompt, Events as ConsolePromptEvents} from './ConsolePrompt.js';
 import {ConsoleSidebar, Events} from './ConsoleSidebar.js';
-import {ConsoleCommand, ConsoleCommandResult, ConsoleGroupViewMessage, ConsoleTableMessageView, ConsoleViewMessage, getMessageForElement, MaxLengthForLinks} from './ConsoleViewMessage.js';
+import {
+  ConsoleCommand,
+  ConsoleCommandResult,
+  ConsoleGroupViewMessage,
+  ConsoleTableMessageView,
+  ConsoleViewMessage,
+  getMessageForElement,
+  MaxLengthForLinks,
+} from './ConsoleViewMessage.js';
 
 import type {ConsoleViewportElement, ConsoleViewportProvider} from './ConsoleViewport.js';
 import {ConsoleViewport} from './ConsoleViewport.js';

package/front_end/panels/css_overview/CSSOverviewCompletedView.ts

@@ -14,7 +14,9 @@ import * as UI from '../../ui/legacy/legacy.js';
 import type * as Protocol from '../../generated/protocol.js';
 
 import cssOverviewCompletedViewStyles from './cssOverviewCompletedView.css.js';
-import type {OverviewController, PopulateNodesEvent, PopulateNodesEventNodes, PopulateNodesEventNodeTypes} from './CSSOverviewController.js';
+import type {
+  OverviewController, PopulateNodesEvent, PopulateNodesEventNodes, PopulateNodesEventNodeTypes} from
+  './CSSOverviewController.js';
 import {Events as CSSOverViewControllerEvents} from './CSSOverviewController.js';
 import {CSSOverviewSidebarPanel, SidebarEvents} from './CSSOverviewSidebarPanel.js';
 import type {UnusedDeclaration} from './CSSOverviewUnusedDeclarations.js';

package/front_end/panels/elements/PropertiesWidget.ts

@@ -212,4 +212,3 @@ export class PropertiesWidget extends UI.ThrottledWidget.ThrottledWidget {
     this.registerCSSFiles([propertiesWidgetStyles]);
   }
 }
-

package/front_end/panels/elements/StylesSidebarPane.ts

@@ -61,7 +61,13 @@ import {StylePropertyHighlighter} from './StylePropertyHighlighter.js';
 import stylesSidebarPaneStyles from './stylesSidebarPane.css.js';
 
 import type {StylePropertyTreeElement} from './StylePropertyTreeElement.js';
-import {StylePropertiesSection, BlankStylePropertiesSection, KeyframePropertiesSection, HighlightPseudoStylePropertiesSection} from './StylePropertiesSection.js';
+import {
+  StylePropertiesSection,
+  BlankStylePropertiesSection,
+  KeyframePropertiesSection,
+  HighlightPseudoStylePropertiesSection,
+} from './StylePropertiesSection.js';
+
 import * as LayersWidget from './LayersWidget.js';
 
 const UIStrings = {

package/front_end/panels/lighthouse/LighthouseController.ts

@@ -399,14 +399,16 @@ export const Presets: Preset[] = [
     title: i18nLazyString(UIStrings.performance),
     description: i18nLazyString(UIStrings.howLongDoesThisAppTakeToShow),
     plugin: false,
+    supportedModes: ['navigation', 'timespan', 'snapshot'],
   },
   {
     setting: Common.Settings.Settings.instance().createSetting(
-        'lighthouse.cat_pwa', true, Common.Settings.SettingStorageType.Synced),
-    configID: 'pwa',
-    title: i18nLazyString(UIStrings.progressiveWebApp),
-    description: i18nLazyString(UIStrings.doesThisPageMeetTheStandardOfA),
+        'lighthouse.cat_a11y', true, Common.Settings.SettingStorageType.Synced),
+    configID: 'accessibility',
+    title: i18nLazyString(UIStrings.accessibility),
+    description: i18nLazyString(UIStrings.isThisPageUsableByPeopleWith),
     plugin: false,
+    supportedModes: ['navigation', 'snapshot'],
   },
   {
     setting: Common.Settings.Settings.instance().createSetting(
@@ -415,14 +417,7 @@ export const Presets: Preset[] = [
     title: i18nLazyString(UIStrings.bestPractices),
     description: i18nLazyString(UIStrings.doesThisPageFollowBestPractices),
     plugin: false,
-  },
-  {
-    setting: Common.Settings.Settings.instance().createSetting(
-        'lighthouse.cat_a11y', true, Common.Settings.SettingStorageType.Synced),
-    configID: 'accessibility',
-    title: i18nLazyString(UIStrings.accessibility),
-    description: i18nLazyString(UIStrings.isThisPageUsableByPeopleWith),
-    plugin: false,
+    supportedModes: ['navigation', 'timespan', 'snapshot'],
   },
   {
     setting: Common.Settings.Settings.instance().createSetting(
@@ -431,6 +426,16 @@ export const Presets: Preset[] = [
     title: i18nLazyString(UIStrings.seo),
     description: i18nLazyString(UIStrings.isThisPageOptimizedForSearch),
     plugin: false,
+    supportedModes: ['navigation', 'snapshot'],
+  },
+  {
+    setting: Common.Settings.Settings.instance().createSetting(
+        'lighthouse.cat_pwa', true, Common.Settings.SettingStorageType.Synced),
+    configID: 'pwa',
+    title: i18nLazyString(UIStrings.progressiveWebApp),
+    description: i18nLazyString(UIStrings.doesThisPageMeetTheStandardOfA),
+    plugin: false,
+    supportedModes: ['navigation'],
   },
   {
     setting: Common.Settings.Settings.instance().createSetting(
@@ -439,6 +444,7 @@ export const Presets: Preset[] = [
     configID: 'lighthouse-plugin-publisher-ads',
     title: i18nLazyString(UIStrings.publisherAds),
     description: i18nLazyString(UIStrings.isThisPageOptimizedForAdSpeedAnd),
+    supportedModes: ['navigation'],
   },
 ];
 
@@ -567,6 +573,7 @@ export interface Preset {
   title: () => Common.UIString.LocalizedString;
   description: () => Common.UIString.LocalizedString;
   plugin: boolean;
+  supportedModes: string[];
 }
 export interface RuntimeSetting {
   setting: Common.Settings.Setting<string|boolean>;

package/front_end/panels/lighthouse/LighthousePanel.ts

@@ -12,7 +12,8 @@ import * as EmulationModel from '../../models/emulation/emulation.js';
 import * as UI from '../../ui/legacy/legacy.js';
 import * as Emulation from '../emulation/emulation.js';
 
-import type {AuditProgressChangedEvent, PageAuditabilityChangedEvent, PageWarningsChangedEvent} from './LighthouseController.js';
+import type {
+  AuditProgressChangedEvent, PageAuditabilityChangedEvent, PageWarningsChangedEvent} from './LighthouseController.js';
 import {Events, LighthouseController} from './LighthouseController.js';
 import lighthousePanelStyles from './lighthousePanel.css.js';
 import type {LighthouseRun} from './LighthouseProtocolService.js';
@@ -174,7 +175,7 @@ export class LighthousePanel extends UI.Panel.Panel {
       return;
     }
 
-    this.startView.updateMode();
+    this.startView.refresh();
 
     this.unauditableExplanation = evt.data.helpText;
     this.startView.setUnauditableExplanation(evt.data.helpText);

package/front_end/panels/lighthouse/LighthouseStartView.ts

@@ -102,20 +102,26 @@ export class StartView extends UI.Widget.Widget {
     }
   }
 
-  protected populateFormControls(fragment: UI.Fragment.Fragment): void {
+  protected populateFormControls(fragment: UI.Fragment.Fragment, mode?: string): void {
     // Populate the device type
     const deviceTypeFormElements = fragment.$('device-type-form-elements');
     this.populateRuntimeSettingAsRadio('lighthouse.device_type', i18nString(UIStrings.device), deviceTypeFormElements);
 
     // Populate the categories
-    const categoryFormElements = fragment.$('categories-form-elements');
-    const pluginFormElements = fragment.$('plugins-form-elements');
+    const categoryFormElements = fragment.$('categories-form-elements') as HTMLElement;
+    categoryFormElements.textContent = '';
+    const pluginFormElements = fragment.$('plugins-form-elements') as HTMLElement;
+    pluginFormElements.textContent = '';
     for (const preset of Presets) {
       const formElements = preset.plugin ? pluginFormElements : categoryFormElements;
       preset.setting.setTitle(preset.title());
       const checkbox = new UI.Toolbar.ToolbarSettingCheckbox(preset.setting, preset.description());
       const row = formElements.createChild('div', 'vbox lighthouse-launcher-row');
       row.appendChild(checkbox.element);
+      if (mode && !preset.supportedModes.includes(mode)) {
+        checkbox.setEnabled(false);
+        checkbox.setIndeterminate(true);
+      }
     }
     UI.ARIAUtils.markAsGroup(categoryFormElements);
     UI.ARIAUtils.setAccessibleName(categoryFormElements, i18nString(UIStrings.categories));
@@ -181,7 +187,7 @@ export class StartView extends UI.Widget.Widget {
     this.contentElement.style.overflow = 'auto';
   }
 
-  updateMode(): void {
+  refresh(): void {
     // Do nothing in default case.
   }
 

package/front_end/panels/lighthouse/LighthouseStartViewFR.ts

@@ -46,6 +46,52 @@ const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
 export class StartViewFR extends StartView {
   protected render(): void {
     super.render();
+    this.refresh();
+  }
+
+  private createStartButton(mode: string): HTMLButtonElement {
+    let buttonLabel: Platform.UIString.LocalizedString;
+    let callback: () => void;
+
+    if (mode === 'timespan') {
+      buttonLabel = i18nString(UIStrings.startTimespan);
+      callback = (): void => {
+        this.controller.dispatchEventToListeners(
+            Events.RequestLighthouseTimespanStart,
+            /* keyboardInitiated */ this.startButton.matches(':focus-visible'),
+        );
+      };
+    } else if (mode === 'snapshot') {
+      buttonLabel = i18nString(UIStrings.analyzeSnapshot);
+      callback = (): void => {
+        this.controller.dispatchEventToListeners(
+            Events.RequestLighthouseStart,
+            /* keyboardInitiated */ this.startButton.matches(':focus-visible'),
+        );
+      };
+    } else {
+      buttonLabel = i18nString(UIStrings.analyzeNavigation);
+      callback = (): void => {
+        this.controller.dispatchEventToListeners(
+            Events.RequestLighthouseStart,
+            /* keyboardInitiated */ this.startButton.matches(':focus-visible'),
+        );
+      };
+    }
+
+    return UI.UIUtils.createTextButton(
+        buttonLabel,
+        callback,
+        /* className */ '',
+        /* primary */ true,
+    );
+  }
+
+  refresh(): void {
+    const {mode} = this.controller.getFlags();
+
+    this.startButton = this.createStartButton(mode);
+
     const fragment = UI.Fragment.Fragment.build`
 <form class="lighthouse-start-view-fr">
   <header class="hbox">
@@ -82,7 +128,7 @@ export class StartViewFR extends StartView {
     this.warningText = fragment.$('warning-text');
 
     // The previous radios are removed later and don't exist on the new fragment yet.
-    this.populateFormControls(fragment);
+    this.populateFormControls(fragment, mode);
 
     // Populate the Lighthouse mode
     const modeFormElements = fragment.$('mode-form-elements');
@@ -90,7 +136,9 @@ export class StartViewFR extends StartView {
 
     this.contentElement.textContent = '';
     this.contentElement.append(fragment.element());
-    this.updateMode();
+
+    // Ensure the correct layout is used after refresh.
+    this.onResize();
   }
 
   onResize(): void {
@@ -107,50 +155,4 @@ export class StartViewFR extends StartView {
       optionsEl.classList.toggle('narrow', useNarrowLayout);
     }
   }
-
-  updateMode(): void {
-    const {mode} = this.controller.getFlags();
-
-    let buttonLabel: Platform.UIString.LocalizedString;
-    let callback: () => void;
-
-    if (mode === 'timespan') {
-      buttonLabel = i18nString(UIStrings.startTimespan);
-      callback = (): void => {
-        this.controller.dispatchEventToListeners(
-            Events.RequestLighthouseTimespanStart,
-            /* keyboardInitiated */ this.startButton.matches(':focus-visible'),
-        );
-      };
-    } else if (mode === 'snapshot') {
-      buttonLabel = i18nString(UIStrings.analyzeSnapshot);
-      callback = (): void => {
-        this.controller.dispatchEventToListeners(
-            Events.RequestLighthouseStart,
-            /* keyboardInitiated */ this.startButton.matches(':focus-visible'),
-        );
-      };
-    } else {
-      buttonLabel = i18nString(UIStrings.analyzeNavigation);
-      callback = (): void => {
-        this.controller.dispatchEventToListeners(
-            Events.RequestLighthouseStart,
-            /* keyboardInitiated */ this.startButton.matches(':focus-visible'),
-        );
-      };
-    }
-
-    this.startButton = UI.UIUtils.createTextButton(
-        buttonLabel,
-        callback,
-        /* className */ '',
-        /* primary */ true,
-    );
-
-    const startButtonContainerEl = this.contentElement.querySelector('.lighthouse-start-button-container');
-    if (startButtonContainerEl) {
-      startButtonContainerEl.textContent = '';
-      startButtonContainerEl.appendChild(this.startButton);
-    }
-  }
 }

package/front_end/panels/lighthouse/LighthouseTimespanView.ts

@@ -71,13 +71,20 @@ export class TimespanView extends UI.Dialog.Dialog {
     const dialogRoot = UI.Utils.createShadowRootWithCoreStyles(
         this.contentElement, {cssFile: [lighthouseDialogStyles], delegatesFocus: undefined});
 
-    this.endButton = UI.UIUtils.createTextButton(i18nString(UIStrings.endTimespan), this.endTimespan.bind(this));
+    this.endButton = UI.UIUtils.createTextButton(
+        i18nString(UIStrings.endTimespan),
+        this.endTimespan.bind(this),
+        undefined,
+        true,
+    );
     const cancelButton = UI.UIUtils.createTextButton(i18nString(UIStrings.cancel), this.cancel.bind(this));
     const fragment = UI.Fragment.Fragment.build`
   <div class="lighthouse-view vbox">
   <h2 $="status-header"></h2>
-  ${this.endButton}
+  <div class="lighthouse-action-buttons hbox">
   ${cancelButton}
+  ${this.endButton}
+  </div>
   </div>
   `;
 

package/front_end/panels/lighthouse/lighthouseDialog.css

@@ -117,3 +117,8 @@
   display: block;
   margin-top: 5px;
 }
+
+.lighthouse-action-buttons {
+  align-self: end;
+  column-gap: 8px;
+}

package/front_end/panels/lighthouse/lighthouseStartView.css

@@ -170,16 +170,16 @@ input[type="radio"]:focus {
 
 .lighthouse-options {
   display: grid;
-  grid-template-columns: auto auto;
+  grid-template-columns: 1fr 1fr;
   grid-template-rows: auto auto;
 }
 
 .lighthouse-options.narrow {
-  grid-template-columns: auto;
+  grid-template-columns: 1fr;
   grid-template-rows: auto auto auto;
 }
 
 .lighthouse-options.wide {
-  grid-template-columns: auto auto auto;
+  grid-template-columns: 1fr 1fr 1fr;
   grid-template-rows: auto;
 }

package/front_end/panels/mobile_throttling/ThrottlingManager.ts

@@ -11,7 +11,9 @@ import * as UI from '../../ui/legacy/legacy.js';
 import {MobileThrottlingSelector} from './MobileThrottlingSelector.js';
 import {NetworkThrottlingSelector} from './NetworkThrottlingSelector.js';
 
-import type {Conditions, ConditionsList, MobileThrottlingConditionsGroup, NetworkThrottlingConditionsGroup} from './ThrottlingPresets.js';
+import type {
+  Conditions, ConditionsList, MobileThrottlingConditionsGroup, NetworkThrottlingConditionsGroup} from
+  './ThrottlingPresets.js';
 import {ThrottlingPresets} from './ThrottlingPresets.js';
 
 const UIStrings = {

package/front_end/panels/network/NetworkLogView.ts

@@ -57,7 +57,11 @@ import {Events, NetworkGroupNode, NetworkRequestNode} from './NetworkDataGridNod
 import {NetworkFrameGrouper} from './NetworkFrameGrouper.js';
 import {NetworkLogViewColumns} from './NetworkLogViewColumns.js';
 import type {NetworkTimeCalculator} from './NetworkTimeCalculator.js';
-import {NetworkTimeBoundary, NetworkTransferDurationCalculator, NetworkTransferTimeCalculator} from './NetworkTimeCalculator.js';
+import {
+  NetworkTimeBoundary,
+  NetworkTransferDurationCalculator,
+  NetworkTransferTimeCalculator,
+} from './NetworkTimeCalculator.js';
 
 const UIStrings = {
   /**

package/front_end/panels/network/NetworkLogViewColumns.ts

@@ -14,7 +14,9 @@ import type {NetworkNode} from './NetworkDataGridNode.js';
 import {NetworkRequestNode} from './NetworkDataGridNode.js';
 import type {NetworkLogView} from './NetworkLogView.js';
 import {NetworkManageCustomHeadersView} from './NetworkManageCustomHeadersView.js';
-import type {NetworkTimeCalculator, NetworkTransferDurationCalculator, NetworkTransferTimeCalculator} from './NetworkTimeCalculator.js';
+import type {
+  NetworkTimeCalculator, NetworkTransferDurationCalculator, NetworkTransferTimeCalculator} from
+  './NetworkTimeCalculator.js';
 import {NetworkWaterfallColumn} from './NetworkWaterfallColumn.js';
 import {RequestInitiatorView} from './RequestInitiatorView.js';
 

package/front_end/panels/network/RequestTimingView.ts

@@ -102,7 +102,7 @@ const UIStrings = {
   /**
   *@description Text in Request Timing View of the Network panel
   */
-  waitingTtfb: 'Waiting (TTFB)',
+  waitingTtfb: 'Waiting for server response',
   /**
   *@description Text in Signed Exchange Info View of the Network panel
   */

package/front_end/panels/profiler/HeapSnapshotDataGrids.ts

@@ -38,7 +38,14 @@ import type * as SDK from '../../core/sdk/sdk.js';
 import * as UI from '../../ui/legacy/legacy.js';
 
 import type {HeapSnapshotGridNode} from './HeapSnapshotGridNodes.js';
-import {AllocationGridNode, HeapSnapshotConstructorNode, HeapSnapshotGenericObjectNode, HeapSnapshotRetainingObjectNode, HeapSnapshotObjectNode, HeapSnapshotDiffNode} from './HeapSnapshotGridNodes.js';
+import {
+  AllocationGridNode,
+  HeapSnapshotConstructorNode,
+  HeapSnapshotGenericObjectNode,
+  HeapSnapshotRetainingObjectNode,
+  HeapSnapshotObjectNode,
+  HeapSnapshotDiffNode,
+} from './HeapSnapshotGridNodes.js';
 import type {HeapSnapshotProxy} from './HeapSnapshotProxy.js';
 import type {HeapProfileHeader} from './HeapSnapshotView.js';
 import type {DataDisplayDelegate} from './ProfileHeader.js';

package/front_end/panels/profiler/HeapSnapshotGridNodes.ts

@@ -38,7 +38,9 @@ import * as DataGrid from '../../ui/legacy/components/data_grid/data_grid.js';
 import * as UI from '../../ui/legacy/legacy.js';
 
 import type {ChildrenProvider} from './ChildrenProvider.js';
-import type {AllocationDataGrid, HeapSnapshotConstructorsDataGrid, HeapSnapshotDiffDataGrid, HeapSnapshotSortableDataGrid} from './HeapSnapshotDataGrids.js';
+import type {
+  AllocationDataGrid, HeapSnapshotConstructorsDataGrid, HeapSnapshotDiffDataGrid, HeapSnapshotSortableDataGrid} from
+  './HeapSnapshotDataGrids.js';
 import {HeapSnapshotSortableDataGridEvents} from './HeapSnapshotDataGrids.js';
 import type {HeapSnapshotProviderProxy, HeapSnapshotProxy} from './HeapSnapshotProxy.js';
 import type {DataDisplayDelegate} from './ProfileHeader.js';

package/front_end/panels/profiler/HeapSnapshotView.ts

@@ -44,7 +44,14 @@ import * as Components from '../../ui/legacy/components/utils/utils.js';
 import * as UI from '../../ui/legacy/legacy.js';
 
 import type {HeapSnapshotSortableDataGrid} from './HeapSnapshotDataGrids.js';
-import {AllocationDataGrid, HeapSnapshotSortableDataGridEvents, HeapSnapshotConstructorsDataGrid, HeapSnapshotDiffDataGrid, HeapSnapshotRetainmentDataGrid, HeapSnapshotContainmentDataGrid} from './HeapSnapshotDataGrids.js';
+import {
+  AllocationDataGrid,
+  HeapSnapshotSortableDataGridEvents,
+  HeapSnapshotConstructorsDataGrid,
+  HeapSnapshotDiffDataGrid,
+  HeapSnapshotRetainmentDataGrid,
+  HeapSnapshotContainmentDataGrid,
+} from './HeapSnapshotDataGrids.js';
 import type {AllocationGridNode, HeapSnapshotGridNode} from './HeapSnapshotGridNodes.js';
 import {HeapSnapshotGenericObjectNode} from './HeapSnapshotGridNodes.js';
 import type {HeapSnapshotProxy} from './HeapSnapshotProxy.js';
@@ -53,7 +60,12 @@ import type {IdsRangeChangedEvent} from './HeapTimelineOverview.js';
 import {HeapTimelineOverview, Events, Samples} from './HeapTimelineOverview.js';
 import * as ModuleUIStrings from './ModuleUIStrings.js';
 import type {DataDisplayDelegate} from './ProfileHeader.js';
-import {Events as ProfileHeaderEvents, ProfileEvents as ProfileTypeEvents, ProfileHeader, ProfileType} from './ProfileHeader.js';
+import {
+  Events as ProfileHeaderEvents,
+  ProfileEvents as ProfileTypeEvents,
+  ProfileHeader,
+  ProfileType,
+} from './ProfileHeader.js';
 import {ProfileSidebarTreeElement} from './ProfileSidebarTreeElement.js';
 import {instance} from './ProfileTypeRegistry.js';
 

package/front_end/panels/sources/SourcesPanel.ts

@@ -45,7 +45,13 @@ import {DebuggerPausedMessage} from './DebuggerPausedMessage.js';
 import sourcesPanelStyles from './sourcesPanel.css.js';
 
 import type {NavigatorView} from './NavigatorView.js';
-import {ContentScriptsNavigatorView, FilesNavigatorView, NetworkNavigatorView, OverridesNavigatorView, SnippetsNavigatorView} from './SourcesNavigator.js';
+import {
+  ContentScriptsNavigatorView,
+  FilesNavigatorView,
+  NetworkNavigatorView,
+  OverridesNavigatorView,
+  SnippetsNavigatorView,
+} from './SourcesNavigator.js';
 import {Events, SourcesView} from './SourcesView.js';
 import {ThreadsSidebarPane} from './ThreadsSidebarPane.js';
 import {UISourceCodeFrame} from './UISourceCodeFrame.js';

package/front_end/panels/timeline/TimelineController.ts

@@ -90,7 +90,7 @@ export class TimelineController implements SDK.TargetManager.SDKModelObserver<SD
     // 'disabled-by-default-v8.cpu_profiler'
     //   └ default: on, option: enableJSSampling
     const categoriesArray = [
-      '-*',
+      Root.Runtime.experiments.isEnabled('timelineShowAllEvents') ? '*' : '-*',
       TimelineModel.TimelineModel.TimelineModelImpl.Category.Console,
       TimelineModel.TimelineModel.TimelineModelImpl.Category.UserTiming,
       'devtools.timeline',

package/front_end/panels/timeline/TimelineFlameChartView.ts

@@ -17,7 +17,10 @@ import type {PerformanceModel, WindowChangedEvent} from './PerformanceModel.js';
 import {Events as PerformanceModelEvents} from './PerformanceModel.js';
 import {TimelineDetailsView} from './TimelineDetailsView.js';
 import {TimelineRegExp} from './TimelineFilters.js';
-import {Events as TimelineFlameChartDataProviderEvents, TimelineFlameChartDataProvider} from './TimelineFlameChartDataProvider.js';
+import {
+  Events as TimelineFlameChartDataProviderEvents,
+  TimelineFlameChartDataProvider,
+} from './TimelineFlameChartDataProvider.js';
 import {TimelineFlameChartNetworkDataProvider} from './TimelineFlameChartNetworkDataProvider.js';
 import type {TimelineModeViewDelegate} from './TimelinePanel.js';
 import {TimelineSelection} from './TimelinePanel.js';

package/front_end/panels/timeline/TimelineHistoryManager.ts

@@ -10,7 +10,12 @@ import * as UI from '../../ui/legacy/legacy.js';
 import timelineHistoryManagerStyles from './timelineHistoryManager.css.js';
 
 import type {PerformanceModel} from './PerformanceModel.js';
-import {TimelineEventOverviewCPUActivity, TimelineEventOverviewFrames, TimelineEventOverviewNetwork, TimelineEventOverviewResponsiveness} from './TimelineEventOverview.js';
+import {
+  TimelineEventOverviewCPUActivity,
+  TimelineEventOverviewFrames,
+  TimelineEventOverviewNetwork,
+  TimelineEventOverviewResponsiveness,
+} from './TimelineEventOverview.js';
 
 const UIStrings = {
   /**

package/front_end/panels/timeline/TimelinePanel.ts

@@ -57,7 +57,16 @@ import {Events, PerformanceModel} from './PerformanceModel.js';
 import type {Client} from './TimelineController.js';
 import {TimelineController} from './TimelineController.js';
 import type {TimelineEventOverview} from './TimelineEventOverview.js';
-import {TimelineEventOverviewCoverage, TimelineEventOverviewCPUActivity, TimelineEventOverviewFrames, TimelineEventOverviewInput, TimelineEventOverviewMemory, TimelineEventOverviewNetwork, TimelineEventOverviewResponsiveness, TimelineFilmStripOverview} from './TimelineEventOverview.js';
+import {
+  TimelineEventOverviewCoverage,
+  TimelineEventOverviewCPUActivity,
+  TimelineEventOverviewFrames,
+  TimelineEventOverviewInput,
+  TimelineEventOverviewMemory,
+  TimelineEventOverviewNetwork,
+  TimelineEventOverviewResponsiveness,
+  TimelineFilmStripOverview,
+} from './TimelineEventOverview.js';
 import {TimelineFlameChartView} from './TimelineFlameChartView.js';
 import {TimelineHistoryManager} from './TimelineHistoryManager.js';
 import {TimelineLoader} from './TimelineLoader.js';

package/front_end/panels/timeline/TimelineUIUtils.ts

@@ -1682,8 +1682,7 @@ export class TimelineUIUtils {
     }
   }
 
-  static async buildDetailsTextForTraceEvent(event: SDK.TracingModel.Event, target: SDK.Target.Target|null):
-      Promise<string|null> {
+  static async buildDetailsTextForTraceEvent(event: SDK.TracingModel.Event): Promise<string|null> {
     const recordType = TimelineModel.TimelineModel.RecordType;
     let detailsText;
     const eventData = event.args['data'];
@@ -1696,9 +1695,9 @@ export class TimelineUIUtils {
         break;
       }
       case recordType.FunctionCall:
-        if (eventData) {
-          detailsText =
-              await linkifyLocationAsText(eventData['scriptId'], eventData['lineNumber'], eventData['columnNumber']);
+        if (eventData && eventData['url'] && eventData['lineNumber'] !== undefined &&
+            eventData['columnNumber'] !== undefined) {
+          detailsText = eventData.url + ':' + (eventData.lineNumber + 1) + ':' + (eventData.columnNumber + 1);
         }
         break;
       case recordType.JSFrame:
@@ -1804,33 +1803,13 @@ export class TimelineUIUtils {
 
     return detailsText;
 
-    async function linkifyLocationAsText(
-        scriptId: Protocol.Runtime.ScriptId, lineNumber: number, columnNumber: number): Promise<string|null> {
-      const debuggerModel = target ? target.model(SDK.DebuggerModel.DebuggerModel) : null;
-      if (!target || target.isDisposed() || !scriptId || !debuggerModel) {
-        return null;
-      }
-      const rawLocation = debuggerModel.createRawLocationByScriptId(scriptId, lineNumber, columnNumber);
-      if (!rawLocation) {
-        return null;
-      }
-      const uiLocation =
-          await Bindings.DebuggerWorkspaceBinding.DebuggerWorkspaceBinding.instance().rawLocationToUILocation(
-              rawLocation);
-      return uiLocation ? uiLocation.linkText(false /* skipTrim*/, true /* showColumnNumber*/) : null;
-    }
-
     async function linkifyTopCallFrameAsText(): Promise<string|null> {
       const frame = TimelineModel.TimelineModel.TimelineData.forEvent(event).topFrame();
       if (!frame) {
         return null;
       }
-      let text: string|(string | null) =
-          await linkifyLocationAsText(frame.scriptId, frame.lineNumber, frame.columnNumber);
-      if (!text) {
-        text = frame.url + ':' + (frame.lineNumber + 1) + ':' + (frame.columnNumber + 1);
-      }
-      return text;
+
+      return frame.url + ':' + (frame.lineNumber + 1) + ':' + (frame.columnNumber + 1);
     }
   }
 
@@ -1859,7 +1838,7 @@ export class TimelineUIUtils {
       case recordType.WebSocketSendHandshakeRequest:
       case recordType.WebSocketReceiveHandshakeResponse:
       case recordType.WebSocketDestroy: {
-        detailsText = await TimelineUIUtils.buildDetailsTextForTraceEvent(event, target);
+        detailsText = await TimelineUIUtils.buildDetailsTextForTraceEvent(event);
         break;
       }
 

package/front_end/panels/web_audio/graph_visualizer/GraphView.ts

@@ -6,7 +6,9 @@ import * as Common from '../../../core/common/common.js';
 import * as Platform from '../../../core/platform/platform.js';
 
 import {EdgeTypes, EdgeView, generateEdgePortIdsByData} from './EdgeView.js';
-import type {NodeCreationData, NodeParamConnectionData, NodeParamDisconnectionData, NodesConnectionData, NodesDisconnectionData, NodesDisconnectionDataWithDestination, ParamCreationData} from './GraphStyle.js';
+import type {
+  NodeCreationData, NodeParamConnectionData, NodeParamDisconnectionData, NodesConnectionData, NodesDisconnectionData,
+  NodesDisconnectionDataWithDestination, ParamCreationData} from './GraphStyle.js';
 import {NodeLabelGenerator, NodeView} from './NodeView.js';
 
 // A class that tracks all the nodes and edges of an audio graph.