chrome-devtools-frontend 1.0.1702515 → 1.0.1703574

package/front_end/core/common/ParsedURL.ts

@@ -179,7 +179,11 @@ export class ParsedURL {
         preEncodedPath = 'file:///' + preEncodedPath;
       }
     }
-    return new URL(preEncodedPath).toString() as Platform.DevToolsPath.UrlString;
+    let url = new URL(preEncodedPath).toString();
+    while (url.endsWith('/') && url.length > 'file:///'.length) {
+      url = url.substring(0, url.length - 1);
+    }
+    return url as Platform.DevToolsPath.UrlString;
   }
 
   static relativePathToUrlString(

package/front_end/core/text_utils/Markdown.ts

@@ -0,0 +1,73 @@
+// Copyright 2026 The Chromium Authors
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+import * as Marked from '../../third_party/marked/marked.js';
+
+export interface PlaceholderToken extends Marked.Marked.Tokens.Generic {
+  type: 'placeholder';
+  raw: string;
+  key: string;
+}
+
+export const VALID_PLACEHOLDER_MATCH_PATTERN: RegExp = /\{(PLACEHOLDER_[a-zA-Z][a-zA-Z0-9_]*)\}/g;
+const VALID_PLACEHOLDER_NAME_PATTERN = /^PLACEHOLDER_[a-zA-Z][a-zA-Z0-9_]*$/;
+
+const placeholderExtension: Marked.Marked.TokenizerExtension = {
+  name: 'placeholder',
+  level: 'inline',
+  start(src: string): number |
+      undefined {
+        return src.match(/\{PLACEHOLDER_[a-zA-Z][a-zA-Z0-9_]*\}/)?.index;
+      },
+  tokenizer(src: string): PlaceholderToken |
+      undefined {
+        const match = /^\{(PLACEHOLDER_[a-zA-Z][a-zA-Z0-9_]*)\}/.exec(src);
+        if (match) {
+          return {
+            type: 'placeholder',
+            raw: match[0],
+            key: match[1],
+          };
+        }
+        return undefined;
+      },
+};
+
+export function validateSubstitutions(rawMarkdown: string, substitutions?: Map<string, string>): void {
+  if (!substitutions) {
+    return;
+  }
+  const unusedPlaceholders = new Set(substitutions.keys());
+  for (const key of unusedPlaceholders) {
+    if (!VALID_PLACEHOLDER_NAME_PATTERN.test(key)) {
+      throw new Error(`Invalid placeholder '${key}' provided in the substitutions map.`);
+    }
+  }
+  for (const [, placeholder] of rawMarkdown.matchAll(VALID_PLACEHOLDER_MATCH_PATTERN)) {
+    if (!substitutions.has(placeholder)) {
+      throw new Error(`No replacement provided for placeholder '${placeholder}'.`);
+    }
+    unusedPlaceholders.delete(placeholder);
+  }
+  if (unusedPlaceholders.size > 0) {
+    throw new Error(`Unused replacements provided: ${[...unusedPlaceholders]}`);
+  }
+}
+
+/**
+ * Tokenizes markdown into a Marked AST while preserving `{PLACEHOLDER_*}` tokens
+ * as `PlaceholderToken` AST nodes instead of substituting strings before lexing.
+ */
+export function tokenizeWithPlaceholders(markdown: string|Marked.Marked.Token[],
+                                         substitutions?: Map<string, string>): Marked.Marked.Token[] {
+  const rawMarkdown = typeof markdown === 'string' ? markdown : markdown.map(token => token.raw).join('');
+  validateSubstitutions(rawMarkdown, substitutions);
+  if (typeof markdown !== 'string' && !rawMarkdown.includes('{PLACEHOLDER_')) {
+    return markdown;
+  }
+  const markedInstance = new Marked.Marked.Marked({
+    extensions: [placeholderExtension],
+  });
+  return markedInstance.lexer(rawMarkdown);
+}

package/front_end/core/text_utils/text_utils.ts

@@ -5,6 +5,7 @@
 import * as CodeMirrorUtils from './CodeMirrorUtils.js';
 import * as ContentData from './ContentData.js';
 import * as ContentProvider from './ContentProvider.js';
+import * as Markdown from './Markdown.js';
 import * as StaticContentProvider from './StaticContentProvider.js';
 import * as StreamingContentData from './StreamingContentData.js';
 import * as Text from './Text.js';
@@ -17,6 +18,7 @@ export {
   CodeMirrorUtils,
   ContentData,
   ContentProvider,
+  Markdown,
   StaticContentProvider,
   StreamingContentData,
   Text,

package/front_end/generated/InspectorBackendCommands.ts

@@ -1183,7 +1183,7 @@ inspectorBackend.registerType("Page.FrameResource", [{"name": "url", "type": "st
 inspectorBackend.registerType("Page.FrameResourceTree", [{"name": "frame", "type": "object", "optional": false, "description": "Frame information for this tree item.", "typeRef": "Page.Frame"}, {"name": "childFrames", "type": "array", "optional": true, "description": "Child frames.", "typeRef": "Page.FrameResourceTree"}, {"name": "resources", "type": "array", "optional": false, "description": "Information about frame resources.", "typeRef": "Page.FrameResource"}]);
 inspectorBackend.registerType("Page.FrameTree", [{"name": "frame", "type": "object", "optional": false, "description": "Frame information for this tree item.", "typeRef": "Page.Frame"}, {"name": "childFrames", "type": "array", "optional": true, "description": "Child frames.", "typeRef": "Page.FrameTree"}]);
 inspectorBackend.registerType("Page.NavigationEntry", [{"name": "id", "type": "number", "optional": false, "description": "Unique id of the navigation history entry.", "typeRef": null}, {"name": "url", "type": "string", "optional": false, "description": "URL of the navigation history entry.", "typeRef": null}, {"name": "userTypedURL", "type": "string", "optional": false, "description": "URL that the user typed in the url bar.", "typeRef": null}, {"name": "title", "type": "string", "optional": false, "description": "Title of the navigation history entry.", "typeRef": null}, {"name": "transitionType", "type": "string", "optional": false, "description": "Transition type.", "typeRef": "Page.TransitionType"}]);
-inspectorBackend.registerType("Page.ScreencastFrameMetadata", [{"name": "offsetTop", "type": "number", "optional": false, "description": "Top offset in DIP.", "typeRef": null}, {"name": "pageScaleFactor", "type": "number", "optional": false, "description": "Page scale factor.", "typeRef": null}, {"name": "deviceWidth", "type": "number", "optional": false, "description": "Device screen width in DIP.", "typeRef": null}, {"name": "deviceHeight", "type": "number", "optional": false, "description": "Device screen height in DIP.", "typeRef": null}, {"name": "scrollOffsetX", "type": "number", "optional": false, "description": "Position of horizontal scroll in CSS pixels.", "typeRef": null}, {"name": "scrollOffsetY", "type": "number", "optional": false, "description": "Position of vertical scroll in CSS pixels.", "typeRef": null}, {"name": "timestamp", "type": "number", "optional": true, "description": "Frame swap timestamp.", "typeRef": "Network.TimeSinceEpoch"}]);
+inspectorBackend.registerType("Page.ScreencastFrameMetadata", [{"name": "offsetTop", "type": "number", "optional": false, "description": "Top offset in DIP.", "typeRef": null}, {"name": "pageScaleFactor", "type": "number", "optional": false, "description": "Page scale factor.", "typeRef": null}, {"name": "deviceWidth", "type": "number", "optional": false, "description": "Device screen width in DIP.", "typeRef": null}, {"name": "deviceHeight", "type": "number", "optional": false, "description": "Device screen height in DIP.", "typeRef": null}, {"name": "scrollOffsetX", "type": "number", "optional": false, "description": "Position of horizontal scroll in CSS pixels.", "typeRef": null}, {"name": "scrollOffsetY", "type": "number", "optional": false, "description": "Position of vertical scroll in CSS pixels.", "typeRef": null}, {"name": "timestamp", "type": "number", "optional": true, "description": "Frame swap timestamp.", "typeRef": "Network.TimeSinceEpoch"}, {"name": "monotonicTimestamp", "type": "number", "optional": true, "description": "Frame swap timestamp as monotonic time.", "typeRef": "Network.MonotonicTime"}]);
 inspectorBackend.registerType("Page.AppManifestError", [{"name": "message", "type": "string", "optional": false, "description": "Error message.", "typeRef": null}, {"name": "critical", "type": "number", "optional": false, "description": "If critical, this is a non-recoverable parse error.", "typeRef": null}, {"name": "line", "type": "number", "optional": false, "description": "Error line.", "typeRef": null}, {"name": "column", "type": "number", "optional": false, "description": "Error column.", "typeRef": null}]);
 inspectorBackend.registerType("Page.AppManifestParsedProperties", [{"name": "scope", "type": "string", "optional": false, "description": "Computed scope value", "typeRef": null}]);
 inspectorBackend.registerType("Page.LayoutViewport", [{"name": "pageX", "type": "number", "optional": false, "description": "Horizontal offset relative to the document (CSS pixels).", "typeRef": null}, {"name": "pageY", "type": "number", "optional": false, "description": "Vertical offset relative to the document (CSS pixels).", "typeRef": null}, {"name": "clientWidth", "type": "number", "optional": false, "description": "Width (CSS pixels), excludes scrollbar if present.", "typeRef": null}, {"name": "clientHeight", "type": "number", "optional": false, "description": "Height (CSS pixels), excludes scrollbar if present.", "typeRef": null}]);
@@ -1362,6 +1362,7 @@ inspectorBackend.registerCommand("Storage.untrackIndexedDBForStorageKey", [{"nam
 inspectorBackend.registerCommand("Storage.getTrustTokens", [], ["tokens"], "Returns the number of stored Trust Tokens per issuer for the current browsing context.");
 inspectorBackend.registerCommand("Storage.clearTrustTokens", [{"name": "issuerOrigin", "type": "string", "optional": false, "description": "", "typeRef": null}], ["didDeleteTokens"], "Removes all Trust Tokens issued by the provided issuerOrigin. Leaves other stored data, including the issuer's Redemption Records, intact.");
 inspectorBackend.registerCommand("Storage.getPrivateVerificationTokens", [], ["tokens"], "Returns all stored Private Verification Tokens for the current browsing context.");
+inspectorBackend.registerCommand("Storage.getPrivateVerificationTokensIssuerConfigs", [], ["configs"], "Returns the configured Private Verification Tokens issuers and their redeemer origins.");
 inspectorBackend.registerCommand("Storage.clearPrivateVerificationTokens", [{"name": "issuerOrigin", "type": "string", "optional": false, "description": "", "typeRef": null}], [], "Removes all Private Verification Tokens issued by the provided issuerOrigin.");
 inspectorBackend.registerCommand("Storage.deletePrivateVerificationToken", [{"name": "tokenId", "type": "string", "optional": false, "description": "", "typeRef": null}], [], "Removes a specific Private Verification Token by its ID.");
 inspectorBackend.registerCommand("Storage.setPrivateVerificationTokensTracking", [{"name": "enable", "type": "boolean", "optional": false, "description": "", "typeRef": null}], [], "Set tracking for Private Verification Tokens.");
@@ -1371,6 +1372,7 @@ inspectorBackend.registerCommand("Storage.runBounceTrackingMitigations", [], ["d
 inspectorBackend.registerType("Storage.UsageForType", [{"name": "storageType", "type": "string", "optional": false, "description": "Name of storage type.", "typeRef": "Storage.StorageType"}, {"name": "usage", "type": "number", "optional": false, "description": "Storage usage (bytes).", "typeRef": null}]);
 inspectorBackend.registerType("Storage.TrustTokens", [{"name": "issuerOrigin", "type": "string", "optional": false, "description": "", "typeRef": null}, {"name": "count", "type": "number", "optional": false, "description": "", "typeRef": null}]);
 inspectorBackend.registerType("Storage.PrivateVerificationToken", [{"name": "id", "type": "string", "optional": false, "description": "Unique identifier of the token in the database.", "typeRef": null}, {"name": "issuerOrigin", "type": "string", "optional": false, "description": "Origin of the token issuer.", "typeRef": null}, {"name": "keyId", "type": "number", "optional": false, "description": "Public key ID used to issue the token.", "typeRef": null}, {"name": "expiration", "type": "number", "optional": false, "description": "Expiration timestamp in seconds since the epoch.", "typeRef": "Network.TimeSinceEpoch"}, {"name": "creationTime", "type": "number", "optional": false, "description": "Token creation timestamp in seconds since the epoch.", "typeRef": "Network.TimeSinceEpoch"}, {"name": "version", "type": "number", "optional": false, "description": "Token protocol version.", "typeRef": null}, {"name": "token", "type": "string", "optional": false, "description": "Base64-encoded serialized token.", "typeRef": null}]);
+inspectorBackend.registerType("Storage.PrivateVerificationTokensIssuerConfig", [{"name": "issuerOrigin", "type": "string", "optional": false, "description": "Origin of the token issuer.", "typeRef": null}, {"name": "redeemerOrigins", "type": "array", "optional": false, "description": "Origins authorized to redeem tokens from this issuer.", "typeRef": "string"}]);
 inspectorBackend.registerType("Storage.StorageBucket", [{"name": "storageKey", "type": "string", "optional": false, "description": "", "typeRef": "Storage.SerializedStorageKey"}, {"name": "name", "type": "string", "optional": true, "description": "If not specified, it is the default bucket of the storageKey.", "typeRef": null}]);
 inspectorBackend.registerType("Storage.StorageBucketInfo", [{"name": "bucket", "type": "object", "optional": false, "description": "", "typeRef": "Storage.StorageBucket"}, {"name": "id", "type": "string", "optional": false, "description": "", "typeRef": null}, {"name": "expiration", "type": "number", "optional": false, "description": "", "typeRef": "Network.TimeSinceEpoch"}, {"name": "quota", "type": "number", "optional": false, "description": "Storage quota (bytes).", "typeRef": null}, {"name": "persistent", "type": "boolean", "optional": false, "description": "", "typeRef": null}, {"name": "durability", "type": "string", "optional": false, "description": "", "typeRef": "Storage.StorageBucketsDurability"}]);
 

package/front_end/generated/protocol-mapping.d.ts

@@ -4954,6 +4954,14 @@ export namespace ProtocolMapping {
       paramsType: [];
       returnType: Protocol.Storage.GetPrivateVerificationTokensResponse;
     };
+    /**
+     * Returns the configured Private Verification Tokens issuers and their redeemer
+     * origins.
+     */
+    'Storage.getPrivateVerificationTokensIssuerConfigs': {
+      paramsType: [];
+      returnType: Protocol.Storage.GetPrivateVerificationTokensIssuerConfigsResponse;
+    };
     /**
      * Removes all Private Verification Tokens issued by the provided issuerOrigin.
      */

package/front_end/generated/protocol-proxy-api.d.ts

@@ -4331,6 +4331,12 @@ declare namespace ProtocolProxyApi {
      */
     invoke_getPrivateVerificationTokens(): Promise<Protocol.Storage.GetPrivateVerificationTokensResponse>;
 
+    /**
+     * Returns the configured Private Verification Tokens issuers and their redeemer
+     * origins.
+     */
+    invoke_getPrivateVerificationTokensIssuerConfigs(): Promise<Protocol.Storage.GetPrivateVerificationTokensIssuerConfigsResponse>;
+
     /**
      * Removes all Private Verification Tokens issued by the provided issuerOrigin.
      */

package/front_end/generated/protocol.ts

@@ -15133,6 +15133,10 @@ export namespace Page {
      * Frame swap timestamp.
      */
     timestamp?: Network.TimeSinceEpoch;
+    /**
+     * Frame swap timestamp as monotonic time.
+     */
+    monotonicTimestamp?: Network.MonotonicTime;
   }
 
   /**
@@ -18504,6 +18508,20 @@ export namespace Storage {
     token: string;
   }
 
+  /**
+   * Configuration for a Private Verification Tokens issuer.
+   */
+  export interface PrivateVerificationTokensIssuerConfig {
+    /**
+     * Origin of the token issuer.
+     */
+    issuerOrigin: string;
+    /**
+     * Origins authorized to redeem tokens from this issuer.
+     */
+    redeemerOrigins: string[];
+  }
+
   export const enum StorageBucketsDurability {
     Relaxed = 'relaxed',
     Strict = 'strict',
@@ -18717,6 +18735,10 @@ export namespace Storage {
     tokens: PrivateVerificationToken[];
   }
 
+  export interface GetPrivateVerificationTokensIssuerConfigsResponse extends ProtocolResponseWithError {
+    configs: PrivateVerificationTokensIssuerConfig[];
+  }
+
   export interface ClearPrivateVerificationTokensRequest {
     issuerOrigin: string;
   }

package/front_end/models/comment_manager/CD4ABridge.ts

@@ -87,8 +87,13 @@ export class CD4ABridge extends Common.ObjectWrapper.ObjectWrapper<EventTypes> {
 
   #formatCommentText(thread: CommentManager.CommentThread): string {
     const rawText = thread.comments[0]?.text ?? '';
+
     const details: string[] = [];
 
+    if (thread.anchor.vePath) {
+      details.push(`- DevTools VEPath: ${thread.anchor.vePath}`);
+    }
+
     if (thread.anchor.textSignature) {
       details.push(`- DevTools element: ${thread.anchor.textSignature}`);
     }

package/front_end/models/issues_manager/MarkdownIssueDescription.ts

@@ -3,6 +3,7 @@
 // found in the LICENSE file.
 
 import * as Platform from '../../core/platform/platform.js';
+import * as TextUtils from '../../core/text_utils/text_utils.js';
 import * as Marked from '../../third_party/marked/marked.js';
 
 /**
@@ -75,9 +76,8 @@ export async function getMarkdownFileContent(filename: string): Promise<string>
 
 export async function createIssueDescriptionFromMarkdown(description: MarkdownIssueDescription):
     Promise<IssueDescription> {
-  const rawMarkdown = await getMarkdownFileContent(description.file);
-  const rawMarkdownWithPlaceholdersReplaced = substitutePlaceholders(rawMarkdown, description.substitutions);
-  return createIssueDescriptionFromRawMarkdown(rawMarkdownWithPlaceholdersReplaced, description);
+  const markdown = await getMarkdownFileContent(description.file);
+  return createIssueDescriptionFromRawMarkdown(markdown, description);
 }
 
 /**
@@ -85,7 +85,7 @@ export async function createIssueDescriptionFromMarkdown(description: MarkdownIs
  */
 export function createIssueDescriptionFromRawMarkdown(
     markdown: string, description: MarkdownIssueDescription): IssueDescription {
-  const markdownAst = Marked.Marked.lexer(markdown);
+  const markdownAst = TextUtils.Markdown.tokenizeWithPlaceholders(markdown, description.substitutions);
   const markdownTitle = findTitleFromMarkdownAst(markdownAst);
   if (!markdownTitle) {
     throw new Error('Markdown issue descriptions must start with a heading');
@@ -99,49 +99,6 @@ export function createIssueDescriptionFromRawMarkdown(
   };
 }
 
-const validPlaceholderMatchPattern = /\{(PLACEHOLDER_[a-zA-Z][a-zA-Z0-9]*)\}/g;
-const validPlaceholderNamePattern = /PLACEHOLDER_[a-zA-Z][a-zA-Z0-9]*/;
-
-/**
- * Replaces placeholders in markdown text with a string provided by the
- * `substitutions` map. To keep mental overhead to a minimum, the same
- * syntax is used as for l10n placeholders. Please note that the
- * placeholders require a mandatory 'PLACEHOLDER_' prefix.
- *
- * Example:
- *   const str = "This is markdown with `code` and two placeholders, namely {PLACEHOLDER_PH1} and {PLACEHOLDER_PH2}".
- *   const result = substitutePlaceholders(str, new Map([['PLACEHOLDER_PH1', 'foo'], ['PLACEHOLDER_PH2', 'bar']]));
- *
- * Exported only for unit testing.
- */
-export function substitutePlaceholders(markdown: string, substitutions?: Map<string, string>): string {
-  const unusedPlaceholders = new Set(substitutions ? substitutions.keys() : []);
-  validatePlaceholders(unusedPlaceholders);
-
-  const result = markdown.replace(validPlaceholderMatchPattern, (_, placeholder) => {
-    const replacement = substitutions ? substitutions.get(placeholder) : undefined;
-    if (replacement === undefined) {
-      throw new Error(`No replacement provided for placeholder '${placeholder}'.`);
-    }
-    unusedPlaceholders.delete(placeholder);
-    return replacement;
-  });
-
-  if (unusedPlaceholders.size > 0) {
-    throw new Error(`Unused replacements provided: ${[...unusedPlaceholders]}`);
-  }
-
-  return result;
-}
-
-/** Ensure that all provided placeholders match the naming pattern. **/
-function validatePlaceholders(placeholders: Set<string>): void {
-  const invalidPlaceholders = [...placeholders].filter(placeholder => !validPlaceholderNamePattern.test(placeholder));
-  if (invalidPlaceholders.length > 0) {
-    throw new Error(`Invalid placeholders provided in the substitutions map: ${invalidPlaceholders}`);
-  }
-}
-
 export function findTitleFromMarkdownAst(markdownAst: Marked.Marked.Token[]): string|null {
   if (markdownAst.length === 0 || markdownAst[0].type !== 'heading' || markdownAst[0].depth !== 1) {
     return null;

package/front_end/models/persistence/AutomaticFileSystemWorkspaceBinding.ts

@@ -64,7 +64,7 @@ export class FileSystem implements Workspace.Workspace.Project {
   }
 
   displayName(): string {
-    const {root} = this.automaticFileSystem;
+    const root = this.automaticFileSystem.root.replace(Host.Platform.isWin() ? /[/\\]+$/ : /\/+$/, '');
     let slash = root.lastIndexOf('/');
     if (slash === -1 && Host.Platform.isWin()) {
       slash = root.lastIndexOf('\\');

package/front_end/panels/common/CommentsStatusBarPill.ts

@@ -4,16 +4,24 @@
 
 import * as i18n from '../../core/i18n/i18n.js';
 import * as CommentManager from '../../models/comment_manager/comment_manager.js';
+import * as Buttons from '../../ui/components/buttons/buttons.js';
 import * as UI from '../../ui/legacy/legacy.js';
 import * as Lit from '../../ui/lit/lit.js';
 import * as VisualLogging from '../../ui/visual_logging/visual_logging.js';
 
+import commentsStatusBarPillStyles from './commentsStatusBarPill.css.js';
+
 const UIStrings = {
   /**
    * @description Button text for the comments status bar pill showing the number of open comments.
    * @example {2} PH1
    */
   commentsCount: 'Comments ({PH1})',
+  /**
+   * @description Button text for sending all draft comments to the agent in the comments status bar pill.
+   * @example {2} PH1
+   */
+  sendToAgentCount: 'Send to agent ({PH1})',
 } as const;
 const str_ = i18n.i18n.registerUIStrings('panels/common/CommentsStatusBarPill.ts', UIStrings);
 const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
@@ -23,22 +31,38 @@ const {html, render} = Lit;
 export interface ViewInput {
   threads: CommentManager.CommentManager.CommentThread[];
   onPillClick: () => void;
+  onSendToAgentClick?: () => void;
   disabled?: boolean;
 }
 
 export type View = (input: ViewInput, output: undefined, target: HTMLElement) => void;
 
 export const DEFAULT_VIEW: View = (input: ViewInput, _output: undefined, target: HTMLElement): void => {
+  const unsentCount = input.threads.filter(thread => thread.status === 'ACTIVE').length;
+  const tooltip = input.threads.flatMap(thread => thread.comments.map(comment => comment.text)).join('\n');
   // clang-format off
   render(html`
+    <style>${commentsStatusBarPillStyles}</style>
     ${input.threads.length <= 0 ? Lit.nothing : html`
-      <button
-        class="devtools-pill"
-        ?disabled=${input.disabled}
-        @click=${input.onPillClick}
-        jslog=${VisualLogging.action('comments-status-bar-pill').track({click: true})}>
-        ${i18nString(UIStrings.commentsCount, {PH1: input.threads.length})}
-      </button>
+      <div class="pill-container">
+        <button
+          class="devtools-pill"
+          title=${tooltip}
+          ?disabled=${input.disabled}
+          @click=${input.onPillClick}
+          jslog=${VisualLogging.action('comments-status-bar-pill').track({click: true})}>
+          ${i18nString(UIStrings.commentsCount, {PH1: input.threads.length})}
+        </button>
+        ${unsentCount > 0 ? html`
+          <devtools-button
+            .variant=${Buttons.Button.Variant.PRIMARY}
+            .disabled=${Boolean(input.disabled)}
+            .jslogContext=${'comments-send-to-agent'}
+            @click=${input.onSendToAgentClick}>
+            ${i18nString(UIStrings.sendToAgentCount, {PH1: unsentCount})}
+          </devtools-button>
+        ` : Lit.nothing}
+      </div>
     `}
   `, target);
   // clang-format on
@@ -100,9 +124,18 @@ export class CommentsStatusBarPill extends UI.Widget.Widget {
           this.#commentManager.getCommentThreads().filter(thread => thread.status !== 'DRAFT') :
           [],
       onPillClick: this.#handlePillClick,
+      onSendToAgentClick: this.#handleSendToAgentClick,
     };
     this.#view(viewInput, undefined, this.contentElement);
   }
 
   #handlePillClick = (): void => {};
+
+  #handleSendToAgentClick = (): void => {
+    for (const thread of this.#commentManager.getCommentThreads()) {
+      if (thread.status === 'ACTIVE') {
+        thread.sendToAgent();
+      }
+    }
+  };
 }

package/front_end/panels/common/commentsStatusBarPill.css

@@ -0,0 +1,13 @@
+/*
+ * Copyright 2026 The Chromium Authors
+ * Use of this source code is governed by a BSD-style license that can be
+ * found in the LICENSE file.
+ */
+
+@scope to (devtools-widget > *) {
+  .pill-container {
+    display: flex;
+    align-items: center;
+    gap: var(--sys-size-3);
+  }
+}

package/front_end/panels/issues/IssueView.ts

@@ -435,7 +435,11 @@ export class IssueView extends UI.TreeOutline.TreeElement {
     messageElement.setCollapsible(false);
     messageElement.selectable = false;
     const markdownComponent = new MarkdownView.MarkdownView.MarkdownView();
-    markdownComponent.data = {tokens: this.#description.markdown};
+    markdownComponent.data = {
+      tokens: this.#description.markdown,
+      renderer: new MarkdownView.MarkdownPlaceholderLitRenderer.MarkdownPlaceholderLitRenderer(
+          this.#description.substitutions),
+    };
     messageElement.listItemElement.appendChild(markdownComponent);
     UI.ARIAUtils.setPositionInSet(messageElement.listItemElement, 1);
     UI.ARIAUtils.setSetSize(messageElement.listItemElement, this.#description.links.length === 0 ? 2 : 3);