chrome-devtools-frontend 1.0.1582745 → 1.0.1585538

package/front_end/third_party/puppeteer/package/src/node/ChromeLauncher.ts

@@ -178,8 +178,6 @@ export class ChromeLauncher extends BrowserLauncher {
       'MediaRouter',
       'OptimizationHints',
       'RenderDocument', // https://crbug.com/444150315
-      'IPH_ReadingModePageActionLabel', // b/479237585
-      'ReadAnythingOmniboxChip', // b/479237585
       ...(turnOnExperimentalFeaturesForTesting
         ? []
         : [
@@ -247,7 +245,10 @@ export class ChromeLauncher extends BrowserLauncher {
       enableExtensions = false,
     } = options;
     if (userDataDir) {
-      chromeArguments.push(`--user-data-dir=${path.resolve(userDataDir)}`);
+      // If absolute (for any platform) path is given, we should not resolve it.
+      chromeArguments.push(
+        `--user-data-dir=${path.posix.isAbsolute(userDataDir) || path.win32.isAbsolute(userDataDir) ? userDataDir : path.resolve(userDataDir)}`,
+      );
     }
     if (devtools) {
       chromeArguments.push('--auto-open-devtools-for-tabs');

package/front_end/third_party/puppeteer/package/src/revisions.ts

@@ -8,7 +8,7 @@
  * @internal
  */
 export const PUPPETEER_REVISIONS = Object.freeze({
-  chrome: '145.0.7632.46',
-  'chrome-headless-shell': '145.0.7632.46',
+  chrome: '145.0.7632.67',
+  'chrome-headless-shell': '145.0.7632.67',
   firefox: 'stable_147.0.3',
 });

package/front_end/third_party/puppeteer/package/src/util/encoding.ts

@@ -12,9 +12,11 @@ export function stringToTypedArray(
   base64Encoded = false,
 ): Uint8Array {
   if (base64Encoded) {
-    // TODO: use
-    // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Uint8Array/fromBase64
-    // once available.
+    if ('fromBase64' in Uint8Array) {
+      // @ts-expect-error fromBase64 is newer than the types we use.
+      return Uint8Array.fromBase64(string);
+    }
+    // TODO: remove Buffer in v26 when it becomes LTS.
     if (typeof Buffer === 'function') {
       return Buffer.from(string, 'base64');
     }

package/front_end/third_party/puppeteer/package/src/util/version.ts

@@ -6,5 +6,5 @@
 
 // If moved update release-please config
 // x-release-please-start-version
-export const packageVersion = '24.37.2';
+export const packageVersion = '24.37.3';
 // x-release-please-end

package/front_end/ui/components/linkifier/LinkifierImpl.ts

@@ -31,6 +31,9 @@ export class LinkifierClick extends Event {
   }
 }
 
+/**
+ * @deprecated do not use
+ */
 export class Linkifier extends HTMLElement {
   readonly #shadow = this.attachShadow({mode: 'open'});
   #url: Platform.DevToolsPath.UrlString = Platform.DevToolsPath.EmptyUrlString;

package/front_end/ui/components/linkifier/LinkifierUtils.ts

@@ -5,6 +5,9 @@
 import type * as Platform from '../../../core/platform/platform.js';
 import * as Bindings from '../../../models/bindings/bindings.js';
 
+/**
+ * @deprecated do not use
+ */
 export function linkText(url: Platform.DevToolsPath.UrlString, lineNumber?: number): string {
   if (url) {
     const displayName = Bindings.ResourceUtils.displayNameForURL(url);

package/front_end/ui/components/text_editor/AiCodeCompletionProvider.ts

@@ -18,6 +18,7 @@ import {
   acceptAiAutoCompleteSuggestion,
   aiAutoCompleteSuggestion,
   aiAutoCompleteSuggestionState,
+  AiSuggestionSource,
   hasActiveAiSuggestion,
   setAiAutoCompleteSuggestion,
   showCompletionHint,
@@ -201,6 +202,12 @@ export class AiCodeCompletionProvider {
           if (!this.#aiCodeCompletion || !this.#editor || !hasActiveAiSuggestion(this.#editor.state)) {
             return false;
           }
+          if (this.#editor.state.field(aiAutoCompleteSuggestionState)?.source === AiSuggestionSource.GENERATION) {
+            // If the suggestion is from code generation, we don't want to
+            // dismiss it here. The user should use the code generation
+            // provider's keymap to dismiss the suggestion.
+            return false;
+          }
           this.#editor.dispatch({
             effects: setAiAutoCompleteSuggestion.of(null),
           });
@@ -347,6 +354,7 @@ export class AiCodeCompletionProvider {
               startTime,
               clearCachedRequest: this.clearCache.bind(this),
               onImpression: this.#aiCodeCompletion?.registerUserImpression.bind(this.#aiCodeCompletion),
+              source: AiSuggestionSource.COMPLETION,
             })
           });
         }

package/front_end/ui/components/text_editor/AiCodeGenerationParser.ts

@@ -4,7 +4,7 @@
 
 import * as CodeMirror from '../../../third_party/codemirror.next/codemirror.next.js';
 
-const LINE_COMMENT_PATTERN = /^(?:\/\/|#)\s*/;
+const LINE_COMMENT_PATTERN = /^(?:\/\/|#)\s*/gm;
 const BLOCK_COMMENT_START_PATTERN = /^\/\*+\s*/;
 const BLOCK_COMMENT_END_PATTERN = /\s*\*+\/$/;
 const BLOCK_COMMENT_LINE_PREFIX_PATTERN = /^\s*\*\s?/;
@@ -51,7 +51,7 @@ function resolveCommentNode(state: CodeMirror.EditorState, cursorPosition: numbe
   return;
 }
 
-function extractBlockComment(rawText: string): string|undefined {
+function extractBlockCommentText(rawText: string): string|undefined {
   // Remove /* and */, whitespace, and common leading asterisks on new lines
   if (!rawText.match(BLOCK_COMMENT_START_PATTERN)) {
     return;
@@ -66,8 +66,29 @@ function extractBlockComment(rawText: string): string|undefined {
   return cleaned;
 }
 
-function extractLineComment(rawText: string): string {
-  return rawText.replace(LINE_COMMENT_PATTERN, '').trim();
+function extractLineComment(node: CodeMirror.SyntaxNode, state: CodeMirror.EditorState): CommentNodeInfo|undefined {
+  let firstNode = node;
+  let lastNode = node;
+
+  let prev = node.prevSibling;
+  while (prev?.type.name.includes('LineComment')) {
+    firstNode = prev;
+    prev = prev.prevSibling;
+  }
+
+  let next = node.nextSibling;
+  while (next?.type.name.includes('LineComment')) {
+    lastNode = next;
+    next = next.nextSibling;
+  }
+
+  // Extract all lines between the first and last identified node
+  const fullRawText = state.doc.sliceString(firstNode.from, lastNode.to);
+
+  // Process each line to remove prefixes (// or #)
+  const concatenatedText = fullRawText.replaceAll(LINE_COMMENT_PATTERN, '').replace(/\n\s*\n/g, '\n').trim();
+
+  return concatenatedText ? {text: concatenatedText, to: lastNode.to} : undefined;
 }
 
 export class AiCodeGenerationParser {
@@ -80,9 +101,10 @@ export class AiCodeGenerationParser {
     const rawText = state.doc.sliceString(node.from, node.to);
     let text = '';
     if (nodeType.includes('LineComment')) {
-      text = extractLineComment(rawText);
-    } else if (nodeType.includes('BlockComment')) {
-      text = extractBlockComment(rawText) ?? '';
+      return extractLineComment(node, state);
+    }
+    if (nodeType.includes('BlockComment')) {
+      text = extractBlockCommentText(rawText) ?? '';
     } else {
       text = rawText;
     }

package/front_end/ui/components/text_editor/AiCodeGenerationProvider.ts

@@ -19,6 +19,7 @@ import {
   acceptAiAutoCompleteSuggestion,
   aiAutoCompleteSuggestion,
   aiAutoCompleteSuggestionState,
+  AiSuggestionSource,
   hasActiveAiSuggestion,
   setAiAutoCompleteSuggestion,
 } from './config.js';
@@ -159,6 +160,12 @@ export class AiCodeGenerationProvider {
             return false;
           }
           if (hasActiveAiSuggestion(this.#editor.state)) {
+            if (this.#editor.state.field(aiAutoCompleteSuggestionState)?.source === AiSuggestionSource.COMPLETION) {
+              // If the suggestion is from code completion, we don't want to
+              // dismiss it here. The user should use the code completion
+              // provider's keymap to dismiss the suggestion.
+              return false;
+            }
             this.#dismissTeaserAndSuggestion();
             return true;
           }
@@ -175,20 +182,11 @@ export class AiCodeGenerationProvider {
       },
       {
         key: 'Tab',
-        run: (): boolean => {
-          if (!this.#aiCodeGeneration || !this.#editor || !hasActiveAiSuggestion(this.#editor.state)) {
-            return false;
-          }
-          const {accepted, suggestion} = acceptAiAutoCompleteSuggestion(this.#editor.editor);
-          if (!accepted) {
-            return false;
-          }
-          if (suggestion?.rpcGlobalId) {
-            this.#aiCodeGeneration.registerUserAcceptance(suggestion.rpcGlobalId, suggestion.sampleId);
-          }
-          this.#aiCodeGenerationConfig?.onSuggestionAccepted(this.#aiCodeGenerationCitations);
-          return true;
-        },
+        run: this.#acceptAiSuggestion.bind(this),
+      },
+      {
+        key: 'Enter',
+        run: this.#acceptAiSuggestion.bind(this),
       },
       {
         any: (_view: unknown, event: KeyboardEvent) => {
@@ -241,6 +239,21 @@ export class AiCodeGenerationProvider {
     });
   }
 
+  #acceptAiSuggestion(): boolean {
+    if (!this.#aiCodeGeneration || !this.#editor || !hasActiveAiSuggestion(this.#editor.state)) {
+      return false;
+    }
+    const {accepted, suggestion} = acceptAiAutoCompleteSuggestion(this.#editor.editor);
+    if (!accepted) {
+      return false;
+    }
+    if (suggestion?.rpcGlobalId) {
+      this.#aiCodeGeneration.registerUserAcceptance(suggestion.rpcGlobalId, suggestion.sampleId);
+    }
+    this.#aiCodeGenerationConfig?.onSuggestionAccepted(this.#aiCodeGenerationCitations);
+    return true;
+  }
+
   #activateTeaser(update: CodeMirror.ViewUpdate): void {
     const currentTeaserMode = update.state.field(aiCodeGenerationTeaserModeState);
     if (currentTeaserMode === AiCodeGenerationTeaserMode.ACTIVE) {
@@ -335,12 +348,13 @@ export class AiCodeGenerationProvider {
       this.#editor.dispatch({
         effects: [
           setAiAutoCompleteSuggestion.of({
-            text: '\n' + suggestionText,
+            text: '\n' + suggestionText + '\n',
             from: commentNodeInfo.to,
             rpcGlobalId: generationResponse.metadata.rpcGlobalId,
             sampleId: topSample.sampleId,
             startTime,
             onImpression: this.#aiCodeGeneration?.registerUserImpression.bind(this.#aiCodeGeneration),
+            source: AiSuggestionSource.GENERATION,
           }),
           setAiCodeGenerationTeaserMode.of(AiCodeGenerationTeaserMode.ACTIVE)
         ]
@@ -441,9 +455,19 @@ function aiCodeGenerationTeaserExtension(teaser: PanelCommon.AiCodeGenerationTea
         // Required for mouse hover to propagate to the info button in teaser.
         return (event.target instanceof Node && teaser.contentElement.contains(event.target));
       },
-      mousedown(event: MouseEvent): boolean {
-        // Required for mouse click to propagate to the info tooltip in teaser.
-        return (event.target instanceof Node && teaser.contentElement.contains(event.target));
+      mousedown(event: MouseEvent, view: CodeMirror.EditorView): boolean {
+        if (!(event.target instanceof Node) || !teaser.contentElement.contains(event.target)) {
+          return false;
+        }
+        // On mouse click, move the cursor position to the end of the line.
+        const cursorPosition = view.state.selection.main.head;
+        const line = view.state.doc.lineAt(cursorPosition);
+        if (cursorPosition !== line.to) {
+          view.dispatch({selection: {anchor: line.to, head: line.to}});
+        }
+        // Explicitly focus the editor.
+        view.focus();
+        return true;
       },
       keydown(event: KeyboardEvent): boolean {
         if (!UI.KeyboardShortcut.KeyboardShortcut.eventHasCtrlEquivalentKey(event) ||

package/front_end/ui/components/text_editor/config.ts

@@ -483,6 +483,11 @@ export function contentIncludingHint(view: CM.EditorView): string {
 
 export const setAiAutoCompleteSuggestion = CM.StateEffect.define<ActiveSuggestion|null>();
 
+export const enum AiSuggestionSource {
+  COMPLETION = 'completion',
+  GENERATION = 'generation',
+}
+
 export interface ActiveSuggestion {
   text: string;
   from: number;
@@ -491,6 +496,7 @@ export interface ActiveSuggestion {
   startTime: number;
   onImpression: (rpcGlobalId: Host.AidaClient.RpcGlobalId, latency: number, sampleId?: number) => void;
   clearCachedRequest?: () => void;
+  source: AiSuggestionSource;
 }
 
 export const aiAutoCompleteSuggestionState = CM.StateField.define<ActiveSuggestion|null>({

package/front_end/ui/legacy/InspectorView.ts

@@ -8,7 +8,6 @@ import * as Host from '../../core/host/host.js';
 import * as i18n from '../../core/i18n/i18n.js';
 import * as Root from '../../core/root/root.js';
 import * as SDK from '../../core/sdk/sdk.js';
-import * as GreenDev from '../../models/greendev/greendev.js';
 import * as Buttons from '../../ui/components/buttons/buttons.js';
 import {createIcon, type Icon} from '../kit/kit.js';
 import * as VisualLogging from '../visual_logging/visual_logging.js';
@@ -20,7 +19,6 @@ import type {Context} from './Context.js';
 import type {ContextMenu} from './ContextMenu.js';
 import {Dialog} from './Dialog.js';
 import {DockController, DockState, Events as DockControllerEvents} from './DockController.js';
-import {Floaty} from './Floaty.js';
 import {GlassPane} from './GlassPane.js';
 import {Infobar, Type as InfobarType} from './Infobar.js';
 import {KeyboardShortcut} from './KeyboardShortcut.js';
@@ -54,6 +52,14 @@ const UIStrings = {
    * @description Title of an action that reloads the DevTools
    */
   reloadDevtools: 'Reload DevTools',
+  /**
+   * @description Title of an action that restarts Chrome
+   */
+  restartChrome: 'Restart Chrome',
+  /**
+   * @description Confirmation dialog text for restarting Chrome
+   */
+  areYouSureYouWantToRestartChrome: 'Are you sure you want to restart Chrome?',
   /**
    * @description Text for context menu action to move a tab to the main tab bar
    */
@@ -155,6 +161,7 @@ export class InspectorView extends VBox implements ViewLocationResolver {
   private focusRestorer?: WidgetFocusRestorer|null;
   private ownerSplitWidget?: SplitWidget;
   private reloadRequiredInfobar?: Infobar;
+  #chromeRestartRequiredInfobar?: Infobar;
   #debuggedTabReloadRequiredInfobar?: Infobar;
   #selectOverrideFolderInfobar?: Infobar;
   #resizeObserver: ResizeObserver;
@@ -362,10 +369,6 @@ export class InspectorView extends VBox implements ViewLocationResolver {
     this.element.style.setProperty('--devtools-window-top', `${rect.top}px`);
     this.element.style.setProperty('--devtools-window-bottom', `${window.innerHeight - rect.bottom}px`);
     this.element.style.setProperty('--devtools-window-height', `${rect.height}px`);
-
-    if (Floaty.exists()) {
-      Floaty.instance().setDevToolsRect(rect);
-    }
   }
 
   override wasShown(): void {
@@ -376,13 +379,6 @@ export class InspectorView extends VBox implements ViewLocationResolver {
     DockController.instance().addEventListener(
         DockControllerEvents.DOCK_SIDE_CHANGED, this.#applyDrawerOrientationForDockSide, this);
     this.#applyDrawerOrientationForDockSide();
-
-    if (GreenDev.Prototypes.instance().isEnabled('inDevToolsFloaty')) {
-      Floaty.instance({
-        forceNew: true,
-        document: this.element.ownerDocument,
-      });
-    }
   }
 
   override willHide(): void {
@@ -676,7 +672,7 @@ export class InspectorView extends VBox implements ViewLocationResolver {
   }
 
   displayReloadRequiredWarning(message: string): void {
-    if (!this.reloadRequiredInfobar) {
+    if (!this.reloadRequiredInfobar && !this.#chromeRestartRequiredInfobar) {
       const infobar = new Infobar(
           InfobarType.INFO, message,
           [
@@ -693,7 +689,37 @@ export class InspectorView extends VBox implements ViewLocationResolver {
       this.attachInfobar(infobar);
       this.reloadRequiredInfobar = infobar;
       infobar.setCloseCallback(() => {
-        delete this.reloadRequiredInfobar;
+        this.reloadRequiredInfobar = undefined;
+      });
+    }
+  }
+
+  displayChromeRestartRequiredWarning(message: string): void {
+    if (this.reloadRequiredInfobar) {
+      this.reloadRequiredInfobar.dispose();
+    }
+    if (!this.#chromeRestartRequiredInfobar) {
+      const infobar = new Infobar(
+          InfobarType.INFO, message,
+          [
+            {
+              text: i18nString(UIStrings.restartChrome),
+              delegate: () => {
+                if (confirm(i18nString(UIStrings.areYouSureYouWantToRestartChrome))) {
+                  Host.InspectorFrontendHost.InspectorFrontendHostInstance.requestRestart();
+                }
+              },
+              dismiss: false,
+              buttonVariant: Buttons.Button.Variant.PRIMARY,
+              jslogContext: 'main.chrome-restart-chrome',
+            },
+          ],
+          undefined, 'reload-required');
+      infobar.setParentView(this);
+      this.attachInfobar(infobar);
+      this.#chromeRestartRequiredInfobar = infobar;
+      infobar.setCloseCallback(() => {
+        this.#chromeRestartRequiredInfobar = undefined;
       });
     }
   }

package/front_end/ui/legacy/Toolbar.ts

@@ -835,7 +835,7 @@ export class ToolbarInputElement extends HTMLElement {
 
   item?: ToolbarInput;
   datalist: HTMLDataListElement|null = null;
-  value: string|undefined = undefined;
+  #value: string|undefined = undefined;
   #disabled = false;
 
   connectedCallback(): void {
@@ -862,8 +862,8 @@ export class ToolbarInputElement extends HTMLElement {
           /* shrinkFactor=*/ undefined, tooltip, this.datalist ? this.#onAutocomplete.bind(this) : undefined,
           /* dynamicCompletions=*/ undefined, jslogContext, this);
     }
-    if (this.value) {
-      this.item.setValue(this.value);
+    if (this.#value) {
+      this.item.setValue(this.#value);
     }
     if (this.#disabled) {
       this.item.setEnabled(false);
@@ -894,7 +894,7 @@ export class ToolbarInputElement extends HTMLElement {
       if (this.item && this.item.value() !== newValue) {
         this.item.setValue(newValue, true);
       } else {
-        this.value = newValue;
+        this.#value = newValue;
       }
     } else if (name === 'disabled') {
       this.#disabled = typeof newValue === 'string';
@@ -904,6 +904,14 @@ export class ToolbarInputElement extends HTMLElement {
     }
   }
 
+  get value(): string {
+    return this.item ? this.item.value() : (this.#value ?? '');
+  }
+
+  set value(value: string) {
+    this.setAttribute('value', value);
+  }
+
   set disabled(disabled: boolean) {
     if (disabled) {
       this.setAttribute('disabled', '');

package/front_end/ui/legacy/UIUtils.ts

@@ -697,19 +697,42 @@ export class ElementFocusRestorer {
 export function runCSSAnimationOnce(element: Element, className: string): void {
   function animationEndCallback(): void {
     element.classList.remove(className);
-    element.removeEventListener('webkitAnimationEnd', animationEndCallback, false);
+    element.removeEventListener('animationend', animationEndCallback, false);
     element.removeEventListener('animationcancel', animationEndCallback, false);
   }
 
-  if (element.classList.contains(className)) {
-    element.classList.remove(className);
-  }
-
-  element.addEventListener('webkitAnimationEnd', animationEndCallback, false);
+  // Remove class if it exists.
+  element.classList.toggle(className, /* force=*/ false);
+  element.addEventListener('animationend', animationEndCallback, false);
   element.addEventListener('animationcancel', animationEndCallback, false);
   element.classList.add(className);
 }
 
+class AnimateOnDirective extends Lit.Directive.Directive {
+  #previousValue = false;
+
+  render(_condition: boolean, _className: string): void {
+    return undefined;  // Directives don't have to render HTML
+  }
+
+  override update(part: Lit.Directive.ElementPart, [condition, className]: [boolean, string]): void {
+    const el = part.element as HTMLElement;
+
+    // Only trigger if the condition transitioned from false -> true
+    if (condition && !this.#previousValue) {
+      this.#animate(el, className);
+    }
+
+    this.#previousValue = condition;
+  }
+
+  #animate(el: HTMLElement, className: string): void {
+    runCSSAnimationOnce(el, className);
+  }
+}
+
+export const animateOn = Lit.Directive.directive(AnimateOnDirective);
+
 export function measurePreferredSize(element: Element, containerElement?: Element|null): Geometry.Size {
   const oldParent = element.parentElement;
   const oldNextSibling = element.nextSibling;
@@ -1530,6 +1553,7 @@ export function createFileSelectorElement(callback: (arg0: File) => void, accept
 }
 
 export const MaxLengthForDisplayedURLs = 150;
+export const MaxLengthForDisplayedURLsInConsole = 40;
 
 export class MessageDialog {
   static async show(header: string, message: string, where?: Element|Document, jslogContext?: string): Promise<void> {
@@ -2193,13 +2217,29 @@ export const bindCheckboxImpl = function(
   };
 };
 
+export type BindToSettingOpts = ((newSettingValue: string) => boolean)|{
+  validator?: (newSettingValue: string) => boolean,
+  jslog?: boolean,
+};
 export const bindToSetting =
     (settingOrName: string|Common.Settings.Setting<boolean|string>|Common.Settings.RegExpSetting,
-     stringValidator?: (newSettingValue: string) => boolean): ReturnType<typeof Directives.ref> => {
+     optionsOrValidator?: BindToSettingOpts): ReturnType<typeof Directives.ref> => {
       const setting = typeof settingOrName === 'string' ?
           Common.Settings.Settings.instance().moduleSetting(settingOrName) :
           settingOrName;
 
+      let stringValidator: ((newSettingValue: string) => boolean)|undefined;
+      let jslog = true;
+      if (typeof optionsOrValidator === 'function') {
+        stringValidator = optionsOrValidator;
+      } else if (optionsOrValidator) {
+        stringValidator = optionsOrValidator.validator;
+        if (optionsOrValidator.jslog !== undefined) {
+          jslog = optionsOrValidator.jslog;
+        }
+      }
+
+      const jslogBuilder = jslog ? VisualLogging.toggle(setting.name).track({change: true}) : null;
       // We can't use `setValue` as the change listener directly, otherwise we won't
       // be able to remove it again.
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -2214,6 +2254,9 @@ export const bindToSetting =
             setting.removeChangeListener(settingChanged);
             return;
           }
+          if (jslogBuilder) {
+            e.setAttribute('jslog', jslogBuilder.toString());
+          }
 
           setting.addChangeListener(settingChanged);
           setValue =
@@ -2229,6 +2272,9 @@ export const bindToSetting =
             return;
           }
 
+          if (jslogBuilder) {
+            e.setAttribute('jslog', jslogBuilder.toString());
+          }
           setting.addChangeListener(settingChanged);
           setValue = bindInput(e as HTMLInputElement, setting.set.bind(setting), (value: string) => {
             try {
@@ -2249,6 +2295,9 @@ export const bindToSetting =
             return;
           }
 
+          if (jslogBuilder) {
+            e.setAttribute('jslog', jslogBuilder.toString());
+          }
           setting.addChangeListener(settingChanged);
           setValue = bindInput(
               e as HTMLInputElement, setting.set.bind(setting), stringValidator ?? (() => true), /* numeric */ false);

package/front_end/ui/legacy/components/quick_open/CommandMenu.ts

@@ -275,8 +275,8 @@ export const enum PanelOrDrawer {
 export class CommandMenuProvider extends Provider {
   private commands: Command[];
 
-  constructor(commandsForTest: Command[] = []) {
-    super('command');
+  constructor(jslogContext: string, commandsForTest: Command[] = []) {
+    super(jslogContext);
     this.commands = commandsForTest;
   }
 
@@ -455,8 +455,9 @@ export class ShowActionDelegate implements UI.ActionRegistration.ActionDelegate
 registerProvider({
   prefix: '>',
   iconName: 'chevron-right',
-  provider: () => Promise.resolve(new CommandMenuProvider()),
+  provider: (jslogContext: string) => Promise.resolve(new CommandMenuProvider(jslogContext)),
   helpTitle: () => i18nString(UIStrings.runCommand),
   titlePrefix: () => i18nString(UIStrings.run),
   titleSuggestion: () => i18nString(UIStrings.command),
+  jslogContext: 'command',
 });

package/front_end/ui/legacy/components/quick_open/FilteredListWidget.ts

@@ -657,8 +657,9 @@ export function getRegisteredProviders(): ProviderRegistration[] {
 export interface ProviderRegistration {
   prefix: string;
   iconName: string;
-  provider: () => Promise<Provider>;
+  provider: (jslogContext: string) => Promise<Provider>;
   helpTitle: (() => string);
   titlePrefix: (() => string);
   titleSuggestion?: (() => string);
+  jslogContext: string;
 }

package/front_end/ui/legacy/components/quick_open/HelpQuickOpen.ts

@@ -24,11 +24,16 @@ export class HelpQuickOpen extends Provider {
   }
 
   private async addProvider(extension: ProviderRegistration): Promise<void> {
+    // We want to exclude Help menu as we are already in it.
+    if (extension.prefix === '?') {
+      return;
+    }
+
     this.providers.push({
       prefix: extension.prefix || '',
       iconName: extension.iconName,
       title: extension.helpTitle(),
-      jslogContext: (await extension.provider()).jslogContext,
+      jslogContext: extension.jslogContext,
     });
   }
 
@@ -69,8 +74,9 @@ export class HelpQuickOpen extends Provider {
 registerProvider({
   prefix: '?',
   iconName: 'help',
-  provider: () => Promise.resolve(new HelpQuickOpen('help')),
+  provider: jslogContext => Promise.resolve(new HelpQuickOpen(jslogContext)),
   helpTitle: () => 'Help',
   titlePrefix: () => 'Help',
   titleSuggestion: undefined,
+  jslogContext: 'help'
 });

package/front_end/ui/legacy/components/quick_open/QuickOpen.ts

@@ -5,7 +5,12 @@
 import * as i18n from '../../../../core/i18n/i18n.js';
 import type * as UI from '../../legacy.js';
 
-import {FilteredListWidget, getRegisteredProviders, type Provider} from './FilteredListWidget.js';
+import {
+  FilteredListWidget,
+  getRegisteredProviders,
+  type Provider,
+  type ProviderRegistration
+} from './FilteredListWidget.js';
 
 const UIStrings = {
   /**
@@ -42,19 +47,14 @@ export class QuickOpenImpl {
     filteredListWidget.setQuery(query);
   }
 
-  private addProvider(extension: {
-    prefix: string,
-    provider: () => Promise<Provider>,
-    titlePrefix: () => string,
-    titleSuggestion?: (() => string),
-  }): void {
+  private addProvider(extension: ProviderRegistration): void {
     const prefix = extension.prefix;
     if (prefix === null) {
       return;
     }
     this.prefixes.push(prefix);
     this.providers.set(prefix, {
-      provider: extension.provider,
+      provider: () => extension.provider(extension.jslogContext),
       titlePrefix: extension.titlePrefix,
       titleSuggestion: extension.titleSuggestion,
     });