chrome-devtools-frontend 1.0.1660788 → 1.0.1662289

package/front_end/panels/sources/SourcesView.ts

@@ -345,9 +345,6 @@ export class SourcesView extends Common.ObjectWrapper.eventMixin<EventTypes, typ
     if (view instanceof UI.View.SimpleView) {
       void view.toolbarItems().then(items => {
         this.#scriptViewToolbar.removeToolbarItems();
-        for (const action of getRegisteredEditorActions()) {
-          this.#scriptViewToolbar.appendToolbarItem(action.getOrCreateButton(this));
-        }
         if (Array.isArray(items)) {
           items.map(item => this.#scriptViewToolbar.appendToolbarItem(item));
         } else {
@@ -657,20 +654,6 @@ export interface EventTypes {
   [Events.EDITOR_SELECTED]: Workspace.UISourceCode.UISourceCode;
 }
 
-export interface EditorAction {
-  getOrCreateButton(sourcesView: SourcesView): UI.Toolbar.ToolbarButton;
-}
-
-const registeredEditorActions: Array<() => EditorAction> = [];
-
-export function registerEditorAction(editorAction: () => EditorAction): void {
-  registeredEditorActions.push(editorAction);
-}
-
-export function getRegisteredEditorActions(): EditorAction[] {
-  return registeredEditorActions.map(editorAction => editorAction());
-}
-
 export class SwitchFileActionDelegate implements UI.ActionRegistration.ActionDelegate {
   private static nextFile(currentUISourceCode: Workspace.UISourceCode.UISourceCode): Workspace.UISourceCode.UISourceCode
       |null {

package/front_end/panels/sources/TabbedEditorContainer.ts

@@ -718,7 +718,7 @@ export interface EventTypes {
 const MAX_PREVIOUSLY_VIEWED_FILES_COUNT = 30;
 const MAX_SERIALIZABLE_URL_LENGTH = 4096;
 
-interface SerializedHistoryItem {
+export interface SerializedHistoryItem {
   url: string;
   resourceTypeName: string;
   selectionRange?: TextUtils.TextRange.SerializedTextRange;

package/front_end/panels/sources/UISourceCodeFrame.ts

@@ -6,8 +6,10 @@
 
 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 * as FormatterActions from '../../entrypoints/formatter_worker/FormatterActions.js';  // eslint-disable-line @devtools/es-modules-import
 import * as AiCodeCompletion from '../../models/ai_code_completion/ai_code_completion.js';
+import * as Formatter from '../../models/formatter/formatter.js';
 import * as IssuesManager from '../../models/issues_manager/issues_manager.js';
 import * as Persistence from '../../models/persistence/persistence.js';
 import * as TextUtils from '../../models/text_utils/text_utils.js';
@@ -30,6 +32,15 @@ import {ResourceOriginPlugin} from './ResourceOriginPlugin.js';
 import {SnippetsPlugin} from './SnippetsPlugin.js';
 import {SourcesPanel} from './SourcesPanel.js';
 
+const UIStrings = {
+  /**
+   * @description Title of the format button
+   */
+  format: 'Format',
+} as const;
+const str_ = i18n.i18n.registerUIStrings('panels/sources/UISourceCodeFrame.ts', UIStrings);
+const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
+
 export class UISourceCodeFrame extends Common.ObjectWrapper
                                            .eventMixin<EventTypes, typeof SourceFrame.SourceFrame.SourceFrameImpl>(
                                                SourceFrame.SourceFrame.SourceFrameImpl) {
@@ -290,6 +301,24 @@ export class UISourceCodeFrame extends Common.ObjectWrapper
     this.maybeSetContent(this.#uiSourceCode.workingCopyContentData());
   }
 
+  async #formatSourceInPlace(): Promise<void> {
+    const contentDataOrError = await this.workingCopy();
+    if (TextUtils.ContentData.ContentData.isError(contentDataOrError)) {
+      return;
+    }
+    const content = TextUtils.ContentData.ContentData.textOr(contentDataOrError, '');
+    const {formattedContent, formattedMapping} = await Formatter.ScriptFormatter.format(
+        Common.Settings.Settings.instance(), this.#uiSourceCode.contentType(), this.contentType, content);
+    if (this.#uiSourceCode.workingCopy() === formattedContent) {
+      return;
+    }
+    const selection = this.textEditor.toLineColumn(this.textEditor.state.selection.main.head);
+    const [lineNumber, columnNumber] =
+        formattedMapping.originalToFormatted(selection.lineNumber, selection.columnNumber);
+    this.#uiSourceCode.setWorkingCopy(formattedContent);
+    this.revealPosition({lineNumber, columnNumber});
+  }
+
   private onWorkingCopyCommitted(): void {
     if (!this.#muteSourceCodeEvents) {
       this.maybeSetContent(this.uiSourceCode().workingCopyContentData());
@@ -433,6 +462,19 @@ export class UISourceCodeFrame extends Common.ObjectWrapper
 
   override async toolbarItems(): Promise<UI.Toolbar.ToolbarItem[]> {
     const leftToolbarItems = await super.toolbarItems();
+
+    const isEditable = Persistence.Persistence.PersistenceImpl.instance().hasEditableContent(this.#uiSourceCode);
+    const isJavaScript = Common.ResourceType.ResourceType.isJavaScriptMimeType(this.contentType);
+    const isInplaceFormattable = isEditable && isJavaScript;
+
+    if (isInplaceFormattable) {
+      const formatButton = new UI.Toolbar.ToolbarButton(i18nString(UIStrings.format), 'brackets');
+      formatButton.addEventListener(UI.Toolbar.ToolbarButton.Events.CLICK, () => {
+        void this.#formatSourceInPlace();
+      });
+      leftToolbarItems.unshift(formatButton);
+    }
+
     const rightToolbarItems = [];
     for (const plugin of this.plugins) {
       leftToolbarItems.push(...plugin.leftToolbarItems());

package/front_end/panels/sources/sources.ts

@@ -18,7 +18,6 @@ import * as EditingLocationHistoryManager from './EditingLocationHistoryManager.
 import * as FilePathScoreFunction from './FilePathScoreFunction.js';
 import * as FilteredUISourceCodeListProvider from './FilteredUISourceCodeListProvider.js';
 import * as GoToLineQuickOpen from './GoToLineQuickOpen.js';
-import * as InplaceFormatterEditorAction from './InplaceFormatterEditorAction.js';
 import * as NavigatorView from './NavigatorView.js';
 import * as OpenFileQuickOpen from './OpenFileQuickOpen.js';
 import * as OutlineQuickOpen from './OutlineQuickOpen.js';
@@ -54,7 +53,6 @@ export {
   FilePathScoreFunction,
   FilteredUISourceCodeListProvider,
   GoToLineQuickOpen,
-  InplaceFormatterEditorAction,
   NavigatorView,
   OpenFileQuickOpen,
   OutlineQuickOpen,

package/front_end/panels/timeline/CompatibilityTracksAppender.ts

@@ -168,7 +168,6 @@ export const enum VisualLoggingTrackName {
   THREAD_MAIN = 'thread.main',
   THREAD_FRAME = 'thread.frame',
   THREAD_WORKER = 'thread.worker',
-  THREAD_AUCTION_WORKLET = 'thread.auction-worklet',
   THREAD_RASTERIZER = 'thread.rasterizer',
   THREAD_POOL = 'thread.pool',
   THREAD_OTHER = 'thread.other',
@@ -301,8 +300,6 @@ export class CompatibilityTracksAppender {
         }
         case Trace.Handlers.Threads.ThreadType.WORKER:
           return 3;
-        case Trace.Handlers.Threads.ThreadType.AUCTION_WORKLET:
-          return 3;
         case Trace.Handlers.Threads.ThreadType.RASTERIZER:
           return 4;
         case Trace.Handlers.Threads.ThreadType.THREAD_POOL:
@@ -328,20 +325,6 @@ export class CompatibilityTracksAppender {
         continue;
       }
 
-      const matchingWorklet = this.#parsedTrace.data.AuctionWorklets.worklets.get(pid);
-      if (matchingWorklet) {
-        // Each AuctionWorklet has two key threads:
-        // 1. the Utility Thread
-        // 2. the V8 Helper Thread - either a bidder or seller. see buildNameForAuctionWorklet()
-        // There are other threads in a worklet process, but we don't render them.
-        const tids = [matchingWorklet.args.data.utilityThread.tid, matchingWorklet.args.data.v8HelperThread.tid];
-        if (tids.includes(tid)) {
-          this.#threadAppenders.push(new ThreadAppender(
-              this, this.#parsedTrace, pid, tid, '', Trace.Handlers.Threads.ThreadType.AUCTION_WORKLET, entries, tree));
-        }
-        continue;
-      }
-
       // The Common case… Add the main thread, or iframe, or thread pool, etc.
       this.#threadAppenders.push(new ThreadAppender(this, this.#parsedTrace, pid, tid, name, type, entries, tree));
     }

package/front_end/panels/timeline/IsolateSelector.ts

@@ -26,10 +26,14 @@ export class IsolateSelector extends UI.Toolbar.ToolbarItem implements SDK.Isola
   options?: Array<{index: number, isolate: SDK.IsolateManager.Isolate}>;
   items?: Menus.Menu.MenuItem[];
   readonly itemByIsolate = new Map<SDK.IsolateManager.Isolate, Menus.Menu.MenuItem>();
+  readonly #targetManager: SDK.TargetManager.TargetManager;
+  readonly #isolateManager: SDK.IsolateManager.IsolateManager;
 
-  constructor() {
+  constructor(targetManager: SDK.TargetManager.TargetManager, isolateManager: SDK.IsolateManager.IsolateManager) {
     const menu = new Menus.SelectMenu.SelectMenu();
     super(menu);
+    this.#targetManager = targetManager;
+    this.#isolateManager = isolateManager;
 
     this.menu = menu;
     menu.buttonTitle = i18nString(UIStrings.selectJavascriptVmInstance);
@@ -38,18 +42,16 @@ export class IsolateSelector extends UI.Toolbar.ToolbarItem implements SDK.Isola
 
     menu.addEventListener('selectmenuselected', this.#onSelectMenuSelected.bind(this));
 
-    SDK.IsolateManager.IsolateManager.instance().observeIsolates(this);
-    SDK.TargetManager.TargetManager.instance().addEventListener(
-        SDK.TargetManager.Events.NAME_CHANGED, this.targetChanged, this);
-    SDK.TargetManager.TargetManager.instance().addEventListener(
-        SDK.TargetManager.Events.INSPECTED_URL_CHANGED, this.targetChanged, this);
+    this.#isolateManager.observeIsolates(this);
+    this.#targetManager.addEventListener(SDK.TargetManager.Events.NAME_CHANGED, this.targetChanged, this);
+    this.#targetManager.addEventListener(SDK.TargetManager.Events.INSPECTED_URL_CHANGED, this.targetChanged, this);
   }
 
   #updateIsolateItem(isolate: SDK.IsolateManager.Isolate, itemForIsolate: Menus.Menu.MenuItem): void {
     const modelCountByName = new Map<string, number>();
     for (const model of isolate.models()) {
       const target = model.target();
-      const name = SDK.TargetManager.TargetManager.instance().rootTarget() !== target ? target.name() : '';
+      const name = this.#targetManager.rootTarget() !== target ? target.name() : '';
       const parsedURL = new Common.ParsedURL.ParsedURL(target.inspectedURL());
       const domain = parsedURL.isValid ? parsedURL.domain() : '';
       const title =
@@ -117,7 +119,7 @@ export class IsolateSelector extends UI.Toolbar.ToolbarItem implements SDK.Isola
     if (!model) {
       return;
     }
-    const isolate = SDK.IsolateManager.IsolateManager.instance().isolateByModel(model);
+    const isolate = this.#isolateManager.isolateByModel(model);
     if (isolate) {
       this.isolateChanged(isolate);
     }

package/front_end/panels/timeline/ThreadAppender.ts

@@ -87,48 +87,7 @@ const UIStrings = {
    * @example {2} PH1
    */
   threadPoolThreadS: 'Thread pool worker {PH1}',
-  /**
-   * @description Title of a bidder auction worklet with known URL in the timeline flame chart of the Performance panel
-   * @example {https://google.com} PH1
-   */
-  bidderWorkletS: 'Bidder Worklet — {PH1}',
-  /**
-   * @description Title of a bidder auction worklet in the timeline flame chart of the Performance panel with an unknown URL
-   */
-  bidderWorklet: 'Bidder Worklet',
-
-  /**
-   * @description Title of a seller auction worklet in the timeline flame chart of the Performance panel with an unknown URL
-   */
-  sellerWorklet: 'Seller Worklet',
-
-  /**
-   * @description Title of an auction worklet in the timeline flame chart of the Performance panel with an unknown URL
-   */
-  unknownWorklet: 'Auction Worklet',
-
-  /**
-   * @description Title of control thread of a service process for an auction worklet in the timeline flame chart of the Performance panel with an unknown URL
-   */
-  workletService: 'Auction Worklet service',
-
-  /**
-   * @description Title of a seller auction worklet with known URL in the timeline flame chart of the Performance panel
-   * @example {https://google.com} PH1
-   */
-  sellerWorkletS: 'Seller Worklet — {PH1}',
 
-  /**
-   * @description Title of an auction worklet with known URL in the timeline flame chart of the Performance panel
-   * @example {https://google.com} PH1
-   */
-  unknownWorkletS: 'Auction Worklet — {PH1}',
-
-  /**
-   * @description Title of control thread of a service process for an auction worklet with known URL in the timeline flame chart of the Performance panel
-   * @example {https://google.com} PH1
-   */
-  workletServiceS: 'Auction Worklet service — {PH1}',
 } as const;
 
 const str_ = i18n.i18n.registerUIStrings('panels/timeline/ThreadAppender.ts', UIStrings);
@@ -181,12 +140,6 @@ export class ThreadAppender implements TrackAppender {
     this.#threadDefaultName = threadName || i18nString(UIStrings.threadS, {PH1: threadId});
     this.isOnMainFrame = Boolean(this.#parsedTrace.data.Renderer?.processes.get(processId)?.isOnMainFrame);
     this.threadType = type;
-    // AuctionWorklets are threads, so we re-use this appender rather than
-    // duplicate it, but we change the name because we want to render these
-    // lower down than other threads.
-    if (this.#parsedTrace.data.AuctionWorklets.worklets.has(processId)) {
-      this.appenderName = 'Thread_AuctionWorklet';
-    }
     this.#url = this.#parsedTrace.data.Renderer?.processes.get(this.#processId)?.url || '';
   }
 
@@ -279,8 +232,6 @@ export class ThreadAppender implements TrackAppender {
         return VisualLoggingTrackName.THREAD_WORKER;
       case Trace.Handlers.Threads.ThreadType.RASTERIZER:
         return VisualLoggingTrackName.THREAD_RASTERIZER;
-      case Trace.Handlers.Threads.ThreadType.AUCTION_WORKLET:
-        return VisualLoggingTrackName.THREAD_AUCTION_WORKLET;
       case Trace.Handlers.Threads.ThreadType.OTHER:
         return VisualLoggingTrackName.THREAD_OTHER;
       case Trace.Handlers.Threads.ThreadType.CPU_PROFILE:
@@ -350,9 +301,6 @@ export class ThreadAppender implements TrackAppender {
         break;
       case Trace.Handlers.Threads.ThreadType.OTHER:
         break;
-      case Trace.Handlers.Threads.ThreadType.AUCTION_WORKLET:
-        threadTypeLabel = this.#buildNameForAuctionWorklet();
-        break;
       default:
         return Platform.assertNever(this.threadType, `Unknown thread type: ${this.threadType}`);
     }
@@ -371,60 +319,6 @@ export class ThreadAppender implements TrackAppender {
     return this.#entries;
   }
 
-  #buildNameForAuctionWorklet(): string {
-    const workletMetadataEvent = this.#parsedTrace.data.AuctionWorklets.worklets.get(this.#processId);
-    // We should always have this event - if we do not, we were instantiated with invalid data.
-    if (!workletMetadataEvent) {
-      return i18nString(UIStrings.unknownWorklet);
-    }
-
-    // Host could be empty - in which case we do not want to add it.
-    const host = workletMetadataEvent.host ? `https://${workletMetadataEvent.host}` : '';
-    const shouldAddHost = host.length > 0;
-
-    // For each Auction Worklet in a page there are two threads we care about on the same process.
-    // 1. The "Worklet Service" which is a generic helper service. This thread
-    // is always named "auction_worklet.CrUtilityMain".
-    //
-    // 2. The "Seller/Bidder" service. This thread is always named
-    // "AuctionV8HelperThread". The AuctionWorkets handler does the job of
-    // figuring this out for us - the metadata event it provides for each
-    // worklet process will have a `type` already set.
-    //
-    // Therefore, for this given thread, which we know is part of
-    // an AuctionWorklet process, we need to figure out if this thread is the
-    // generic service, or a seller/bidder worklet.
-    //
-    // Note that the worklet could also have the "unknown" type - this is not
-    // expected but implemented to prevent trace event changes causing DevTools
-    // to break with unknown worklet types.
-    const isUtilityThread = workletMetadataEvent.args.data.utilityThread.tid === this.#threadId;
-    const isBidderOrSeller = workletMetadataEvent.args.data.v8HelperThread.tid === this.#threadId;
-
-    if (isUtilityThread) {
-      return shouldAddHost ? i18nString(UIStrings.workletServiceS, {PH1: host}) : i18nString(UIStrings.workletService);
-    }
-
-    if (isBidderOrSeller) {
-      switch (workletMetadataEvent.type) {
-        case Trace.Types.Events.AuctionWorkletType.SELLER:
-          return shouldAddHost ? i18nString(UIStrings.sellerWorkletS, {PH1: host}) :
-                                 i18nString(UIStrings.sellerWorklet);
-        case Trace.Types.Events.AuctionWorkletType.BIDDER:
-          return shouldAddHost ? i18nString(UIStrings.bidderWorkletS, {PH1: host}) :
-                                 i18nString(UIStrings.bidderWorklet);
-        case Trace.Types.Events.AuctionWorkletType.UNKNOWN:
-          return shouldAddHost ? i18nString(UIStrings.unknownWorkletS, {PH1: host}) :
-                                 i18nString(UIStrings.unknownWorklet);
-        default:
-          Platform.assertNever(
-              workletMetadataEvent.type, `Unexpected Auction Worklet Type ${workletMetadataEvent.type}`);
-      }
-    }
-    // We should never reach here, but just in case!
-    return shouldAddHost ? i18nString(UIStrings.unknownWorkletS, {PH1: host}) : i18nString(UIStrings.unknownWorklet);
-  }
-
   #buildNameForWorker(): string {
     const url = this.#parsedTrace.data.Renderer?.processes.get(this.#processId)?.url || '';
     const workerId = this.#parsedTrace.data.Workers.workerIdByThread.get(this.#threadId);

package/front_end/panels/timeline/TimelinePanel.ts

@@ -453,10 +453,15 @@ export class TimelinePanel extends Common.ObjectWrapper.eventMixin<EventTypes, t
   #hiddenTracksInfoBarByParsedTrace = new WeakMap<Trace.TraceModel.ParsedTrace, UI.Infobar.Infobar|'DISMISSED'>();
 
   readonly #resourceLoader: SDK.PageResourceLoader.ResourceLoader;
+  readonly #targetManager: SDK.TargetManager.TargetManager;
+  readonly #isolateManager: SDK.IsolateManager.IsolateManager;
 
-  constructor(resourceLoader: SDK.PageResourceLoader.ResourceLoader, traceModel?: Trace.TraceModel.Model) {
+  constructor(resourceLoader: SDK.PageResourceLoader.ResourceLoader, targetManager: SDK.TargetManager.TargetManager,
+              isolateManager: SDK.IsolateManager.IsolateManager, traceModel?: Trace.TraceModel.Model) {
     super('timeline');
     this.#resourceLoader = resourceLoader;
+    this.#targetManager = targetManager;
+    this.#isolateManager = isolateManager;
     this.registerRequiredCSS(timelinePanelStyles);
     const adornerContent = document.createElement('span');
     adornerContent.innerHTML = `<div style="
@@ -717,10 +722,13 @@ export class TimelinePanel extends Common.ObjectWrapper.eventMixin<EventTypes, t
   static instance(opts: {
     forceNew: true,
     resourceLoader: SDK.PageResourceLoader.ResourceLoader,
+    targetManager: SDK.TargetManager.TargetManager,
+    isolateManager: SDK.IsolateManager.IsolateManager,
     traceModel?: Trace.TraceModel.Model,
   }|undefined = undefined): TimelinePanel {
     if (opts) {
-      timelinePanelInstance = new TimelinePanel(opts.resourceLoader, opts.traceModel);
+      timelinePanelInstance =
+          new TimelinePanel(opts.resourceLoader, opts.targetManager, opts.isolateManager, opts.traceModel);
     }
 
     if (!timelinePanelInstance) {
@@ -1149,7 +1157,7 @@ export class TimelinePanel extends Common.ObjectWrapper.eventMixin<EventTypes, t
 
     // Isolate selector
     if (this.#isNode) {
-      const isolateSelector = new IsolateSelector();
+      const isolateSelector = new IsolateSelector(this.#targetManager, this.#isolateManager);
       this.panelToolbar.appendSeparator();
       this.panelToolbar.appendToolbarItem(isolateSelector);
     }
@@ -2703,8 +2711,8 @@ export class TimelinePanel extends Common.ObjectWrapper.eventMixin<EventTypes, t
       const {scriptId, scriptUrl, sourceUrl, sourceMapUrl, frame, cachedRawSourceMap} = params;
 
       if (cachedRawSourceMap) {
-        return new SDK.SourceMap.SourceMap(
-            sourceUrl, sourceMapUrl ?? '' as Platform.DevToolsPath.UrlString, cachedRawSourceMap);
+        return new SDK.SourceMap.SourceMap(sourceUrl, sourceMapUrl ?? '' as Platform.DevToolsPath.UrlString,
+                                           cachedRawSourceMap, Common.Console.Console.instance());
       }
 
       // For still-active frames, the source map is likely already fetched or at least in-flight.
@@ -2725,7 +2733,8 @@ export class TimelinePanel extends Common.ObjectWrapper.eventMixin<EventTypes, t
       if (!isFreshRecording && metadata?.sourceMaps && !isDataUrl) {
         const cachedSourceMap = metadata.sourceMaps.find(m => m.sourceMapUrl === sourceMapUrl);
         if (cachedSourceMap) {
-          return new SDK.SourceMap.SourceMap(sourceUrl, sourceMapUrl, cachedSourceMap.sourceMap);
+          return new SDK.SourceMap.SourceMap(sourceUrl, sourceMapUrl, cachedSourceMap.sourceMap,
+                                             Common.Console.Console.instance());
         }
       }
 
@@ -2755,7 +2764,9 @@ export class TimelinePanel extends Common.ObjectWrapper.eventMixin<EventTypes, t
       };
       const payload = await SDK.SourceMapManager.tryLoadSourceMap(
           TimelinePanel.instance().#resourceLoader, sourceMapUrl, initiator);
-      return payload ? new SDK.SourceMap.SourceMap(sourceUrl, sourceMapUrl, payload) : null;
+      return payload ?
+          new SDK.SourceMap.SourceMap(sourceUrl, sourceMapUrl, payload, Common.Console.Console.instance()) :
+          null;
     }
 
     const timeout = new Promise<null>(resolve => setTimeout(() => resolve(null), SOURCE_MAP_LOAD_TIMEOUT_MS));