chrome-devtools-mcp 0.10.1 → 0.10.2

package/build/node_modules/chrome-devtools-frontend/front_end/third_party/marked/package/src/rules.js

@@ -0,0 +1,243 @@
+import { edit, merge, noopTest } from './helpers.js';
+/**
+ * Block-Level Grammar
+ */
+export const block = {
+    newline: /^(?: *(?:\n|$))+/,
+    code: /^( {4}[^\n]+(?:\n(?: *(?:\n|$))*)?)+/,
+    fences: /^ {0,3}(`{3,}(?=[^`\n]*\n)|~{3,})([^\n]*)\n(?:|([\s\S]*?)\n)(?: {0,3}\1[~`]* *(?=\n|$)|$)/,
+    hr: /^ {0,3}((?:- *){3,}|(?:_ *){3,}|(?:\* *){3,})(?:\n+|$)/,
+    heading: /^ {0,3}(#{1,6})(?=\s|$)(.*)(?:\n+|$)/,
+    blockquote: /^( {0,3}> ?(paragraph|[^\n]*)(?:\n|$))+/,
+    list: /^( {0,3}bull)( [^\n]+?)?(?:\n|$)/,
+    html: '^ {0,3}(?:' // optional indentation
+        + '<(script|pre|style|textarea)[\\s>][\\s\\S]*?(?:</\\1>[^\\n]*\\n+|$)' // (1)
+        + '|comment[^\\n]*(\\n+|$)' // (2)
+        + '|<\\?[\\s\\S]*?(?:\\?>\\n*|$)' // (3)
+        + '|<![A-Z][\\s\\S]*?(?:>\\n*|$)' // (4)
+        + '|<!\\[CDATA\\[[\\s\\S]*?(?:\\]\\]>\\n*|$)' // (5)
+        + '|</?(tag)(?: +|\\n|/?>)[\\s\\S]*?(?:(?:\\n *)+\\n|$)' // (6)
+        + '|<(?!script|pre|style|textarea)([a-z][\\w-]*)(?:attribute)*? */?>(?=[ \\t]*(?:\\n|$))[\\s\\S]*?(?:(?:\\n *)+\\n|$)' // (7) open tag
+        + '|</(?!script|pre|style|textarea)[a-z][\\w-]*\\s*>(?=[ \\t]*(?:\\n|$))[\\s\\S]*?(?:(?:\\n *)+\\n|$)' // (7) closing tag
+        + ')',
+    def: /^ {0,3}\[(label)\]: *\n? *<?([^\s>]+)>?(?:(?: +\n? *| *\n *)(title))? *(?:\n+|$)/,
+    table: noopTest,
+    lheading: /^([^\n]+)\n {0,3}(=+|-+) *(?:\n+|$)/,
+    // regex template, placeholders will be replaced according to different paragraph
+    // interruption rules of commonmark and the original markdown spec:
+    _paragraph: /^([^\n]+(?:\n(?!hr|heading|lheading|blockquote|fences|list|html| +\n)[^\n]+)*)/,
+    text: /^[^\n]+/
+};
+block._label = /(?!\s*\])(?:\\[\[\]]|[^\[\]])+/;
+block._title = /(?:"(?:\\"?|[^"\\])*"|'[^'\n]*(?:\n[^'\n]+)*\n?'|\([^()]*\))/;
+block.def = edit(block.def)
+    .replace('label', block._label)
+    .replace('title', block._title)
+    .getRegex();
+block.bullet = /(?:[*+-]|\d{1,9}[.)])/;
+block.listItemStart = edit(/^( *)(bull) */)
+    .replace('bull', block.bullet)
+    .getRegex();
+block.list = edit(block.list)
+    .replace(/bull/g, block.bullet)
+    .replace('hr', '\\n+(?=\\1?(?:(?:- *){3,}|(?:_ *){3,}|(?:\\* *){3,})(?:\\n+|$))')
+    .replace('def', '\\n+(?=' + block.def.source + ')')
+    .getRegex();
+block._tag = 'address|article|aside|base|basefont|blockquote|body|caption'
+    + '|center|col|colgroup|dd|details|dialog|dir|div|dl|dt|fieldset|figcaption'
+    + '|figure|footer|form|frame|frameset|h[1-6]|head|header|hr|html|iframe'
+    + '|legend|li|link|main|menu|menuitem|meta|nav|noframes|ol|optgroup|option'
+    + '|p|param|section|source|summary|table|tbody|td|tfoot|th|thead|title|tr'
+    + '|track|ul';
+block._comment = /<!--(?!-?>)[\s\S]*?(?:-->|$)/;
+block.html = edit(block.html, 'i')
+    .replace('comment', block._comment)
+    .replace('tag', block._tag)
+    .replace('attribute', / +[a-zA-Z:_][\w.:-]*(?: *= *"[^"\n]*"| *= *'[^'\n]*'| *= *[^\s"'=<>`]+)?/)
+    .getRegex();
+block.paragraph = edit(block._paragraph)
+    .replace('hr', block.hr)
+    .replace('heading', ' {0,3}#{1,6} ')
+    .replace('|lheading', '') // setex headings don't interrupt commonmark paragraphs
+    .replace('blockquote', ' {0,3}>')
+    .replace('fences', ' {0,3}(?:`{3,}(?=[^`\\n]*\\n)|~{3,})[^\\n]*\\n')
+    .replace('list', ' {0,3}(?:[*+-]|1[.)]) ') // only lists starting from 1 can interrupt
+    .replace('html', '</?(?:tag)(?: +|\\n|/?>)|<(?:script|pre|style|textarea|!--)')
+    .replace('tag', block._tag) // pars can be interrupted by type (6) html blocks
+    .getRegex();
+block.blockquote = edit(block.blockquote)
+    .replace('paragraph', block.paragraph)
+    .getRegex();
+/**
+ * Normal Block Grammar
+ */
+block.normal = merge({}, block);
+/**
+ * GFM Block Grammar
+ */
+block.gfm = merge({}, block.normal, {
+    table: '^ *([^\\n ].*\\|.*)\\n' // Header
+        + ' {0,3}(?:\\| *)?(:?-+:? *(?:\\| *:?-+:? *)*)(?:\\| *)?' // Align
+        + '(?:\\n((?:(?! *\\n|hr|heading|blockquote|code|fences|list|html).*(?:\\n|$))*)\\n*|$)' // Cells
+});
+block.gfm.table = edit(block.gfm.table)
+    .replace('hr', block.hr)
+    .replace('heading', ' {0,3}#{1,6} ')
+    .replace('blockquote', ' {0,3}>')
+    .replace('code', ' {4}[^\\n]')
+    .replace('fences', ' {0,3}(?:`{3,}(?=[^`\\n]*\\n)|~{3,})[^\\n]*\\n')
+    .replace('list', ' {0,3}(?:[*+-]|1[.)]) ') // only lists starting from 1 can interrupt
+    .replace('html', '</?(?:tag)(?: +|\\n|/?>)|<(?:script|pre|style|textarea|!--)')
+    .replace('tag', block._tag) // tables can be interrupted by type (6) html blocks
+    .getRegex();
+/**
+ * Pedantic grammar (original John Gruber's loose markdown specification)
+ */
+block.pedantic = merge({}, block.normal, {
+    html: edit('^ *(?:comment *(?:\\n|\\s*$)'
+        + '|<(tag)[\\s\\S]+?</\\1> *(?:\\n{2,}|\\s*$)' // closed tag
+        + '|<tag(?:"[^"]*"|\'[^\']*\'|\\s[^\'"/>\\s]*)*?/?> *(?:\\n{2,}|\\s*$))')
+        .replace('comment', block._comment)
+        .replace(/tag/g, '(?!(?:'
+        + 'a|em|strong|small|s|cite|q|dfn|abbr|data|time|code|var|samp|kbd|sub'
+        + '|sup|i|b|u|mark|ruby|rt|rp|bdi|bdo|span|br|wbr|ins|del|img)'
+        + '\\b)\\w+(?!:|[^\\w\\s@]*@)\\b')
+        .getRegex(),
+    def: /^ *\[([^\]]+)\]: *<?([^\s>]+)>?(?: +(["(][^\n]+[")]))? *(?:\n+|$)/,
+    heading: /^(#{1,6})(.*)(?:\n+|$)/,
+    fences: noopTest, // fences not supported
+    paragraph: edit(block.normal._paragraph)
+        .replace('hr', block.hr)
+        .replace('heading', ' *#{1,6} *[^\n]')
+        .replace('lheading', block.lheading)
+        .replace('blockquote', ' {0,3}>')
+        .replace('|fences', '')
+        .replace('|list', '')
+        .replace('|html', '')
+        .getRegex()
+});
+/**
+ * Inline-Level Grammar
+ */
+export const inline = {
+    escape: /^\\([!"#$%&'()*+,\-./:;<=>?@\[\]\\^_`{|}~])/,
+    autolink: /^<(scheme:[^\s\x00-\x1f<>]*|email)>/,
+    url: noopTest,
+    tag: '^comment'
+        + '|^</[a-zA-Z][\\w:-]*\\s*>' // self-closing tag
+        + '|^<[a-zA-Z][\\w-]*(?:attribute)*?\\s*/?>' // open tag
+        + '|^<\\?[\\s\\S]*?\\?>' // processing instruction, e.g. <?php ?>
+        + '|^<![a-zA-Z]+\\s[\\s\\S]*?>' // declaration, e.g. <!DOCTYPE html>
+        + '|^<!\\[CDATA\\[[\\s\\S]*?\\]\\]>', // CDATA section
+    link: /^!?\[(label)\]\(\s*(href)(?:\s+(title))?\s*\)/,
+    reflink: /^!?\[(label)\]\[(?!\s*\])((?:\\[\[\]]?|[^\[\]\\])+)\]/,
+    nolink: /^!?\[(?!\s*\])((?:\[[^\[\]]*\]|\\[\[\]]|[^\[\]])*)\](?:\[\])?/,
+    reflinkSearch: 'reflink|nolink(?!\\()',
+    emStrong: {
+        lDelim: /^(?:\*+(?:([punct_])|[^\s*]))|^_+(?:([punct*])|([^\s_]))/,
+        //        (1) and (2) can only be a Right Delimiter. (3) and (4) can only be Left.  (5) and (6) can be either Left or Right.
+        //        () Skip orphan delim inside strong    (1) #***                (2) a***#, a***                   (3) #***a, ***a                 (4) ***#              (5) #***#                 (6) a***a
+        rDelimAst: /^[^_*]*?\_\_[^_*]*?\*[^_*]*?(?=\_\_)|[punct_](\*+)(?=[\s]|$)|[^punct*_\s](\*+)(?=[punct_\s]|$)|[punct_\s](\*+)(?=[^punct*_\s])|[\s](\*+)(?=[punct_])|[punct_](\*+)(?=[punct_])|[^punct*_\s](\*+)(?=[^punct*_\s])/,
+        rDelimUnd: /^[^_*]*?\*\*[^_*]*?\_[^_*]*?(?=\*\*)|[punct*](\_+)(?=[\s]|$)|[^punct*_\s](\_+)(?=[punct*\s]|$)|[punct*\s](\_+)(?=[^punct*_\s])|[\s](\_+)(?=[punct*])|[punct*](\_+)(?=[punct*])/ // ^- Not allowed for _
+    },
+    code: /^(`+)([^`]|[^`][\s\S]*?[^`])\1(?!`)/,
+    br: /^( {2,}|\\)\n(?!\s*$)/,
+    del: noopTest,
+    text: /^(`+|[^`])(?:(?= {2,}\n)|[\s\S]*?(?:(?=[\\<!\[`*_]|\b_|$)|[^ ](?= {2,}\n)))/,
+    punctuation: /^([\spunctuation])/
+};
+// list of punctuation marks from CommonMark spec
+// without * and _ to handle the different emphasis markers * and _
+inline._punctuation = '!"#$%&\'()+\\-.,/:;<=>?@\\[\\]`^{|}~';
+inline.punctuation = edit(inline.punctuation).replace(/punctuation/g, inline._punctuation).getRegex();
+// sequences em should skip over [title](link), `code`, <html>
+inline.blockSkip = /\[[^\]]*?\]\([^\)]*?\)|`[^`]*?`|<[^>]*?>/g;
+inline.escapedEmSt = /\\\*|\\_/g;
+inline._comment = edit(block._comment).replace('(?:-->|$)', '-->').getRegex();
+inline.emStrong.lDelim = edit(inline.emStrong.lDelim)
+    .replace(/punct/g, inline._punctuation)
+    .getRegex();
+inline.emStrong.rDelimAst = edit(inline.emStrong.rDelimAst, 'g')
+    .replace(/punct/g, inline._punctuation)
+    .getRegex();
+inline.emStrong.rDelimUnd = edit(inline.emStrong.rDelimUnd, 'g')
+    .replace(/punct/g, inline._punctuation)
+    .getRegex();
+inline._escapes = /\\([!"#$%&'()*+,\-./:;<=>?@\[\]\\^_`{|}~])/g;
+inline._scheme = /[a-zA-Z][a-zA-Z0-9+.-]{1,31}/;
+inline._email = /[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+(@)[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)+(?![-_])/;
+inline.autolink = edit(inline.autolink)
+    .replace('scheme', inline._scheme)
+    .replace('email', inline._email)
+    .getRegex();
+inline._attribute = /\s+[a-zA-Z:_][\w.:-]*(?:\s*=\s*"[^"]*"|\s*=\s*'[^']*'|\s*=\s*[^\s"'=<>`]+)?/;
+inline.tag = edit(inline.tag)
+    .replace('comment', inline._comment)
+    .replace('attribute', inline._attribute)
+    .getRegex();
+inline._label = /(?:\[(?:\\.|[^\[\]\\])*\]|\\.|`[^`]*`|[^\[\]\\`])*?/;
+inline._href = /<(?:\\.|[^\n<>\\])+>|[^\s\x00-\x1f]*/;
+inline._title = /"(?:\\"?|[^"\\])*"|'(?:\\'?|[^'\\])*'|\((?:\\\)?|[^)\\])*\)/;
+inline.link = edit(inline.link)
+    .replace('label', inline._label)
+    .replace('href', inline._href)
+    .replace('title', inline._title)
+    .getRegex();
+inline.reflink = edit(inline.reflink)
+    .replace('label', inline._label)
+    .getRegex();
+inline.reflinkSearch = edit(inline.reflinkSearch, 'g')
+    .replace('reflink', inline.reflink)
+    .replace('nolink', inline.nolink)
+    .getRegex();
+/**
+ * Normal Inline Grammar
+ */
+inline.normal = merge({}, inline);
+/**
+ * Pedantic Inline Grammar
+ */
+inline.pedantic = merge({}, inline.normal, {
+    strong: {
+        start: /^__|\*\*/,
+        middle: /^__(?=\S)([\s\S]*?\S)__(?!_)|^\*\*(?=\S)([\s\S]*?\S)\*\*(?!\*)/,
+        endAst: /\*\*(?!\*)/g,
+        endUnd: /__(?!_)/g
+    },
+    em: {
+        start: /^_|\*/,
+        middle: /^()\*(?=\S)([\s\S]*?\S)\*(?!\*)|^_(?=\S)([\s\S]*?\S)_(?!_)/,
+        endAst: /\*(?!\*)/g,
+        endUnd: /_(?!_)/g
+    },
+    link: edit(/^!?\[(label)\]\((.*?)\)/)
+        .replace('label', inline._label)
+        .getRegex(),
+    reflink: edit(/^!?\[(label)\]\s*\[([^\]]*)\]/)
+        .replace('label', inline._label)
+        .getRegex()
+});
+/**
+ * GFM Inline Grammar
+ */
+inline.gfm = merge({}, inline.normal, {
+    escape: edit(inline.escape).replace('])', '~|])').getRegex(),
+    _extended_email: /[A-Za-z0-9._+-]+(@)[a-zA-Z0-9-_]+(?:\.[a-zA-Z0-9-_]*[a-zA-Z0-9])+(?![-_])/,
+    url: /^((?:ftp|https?):\/\/|www\.)(?:[a-zA-Z0-9\-]+\.?)+[^\s<]*|^email/,
+    _backpedal: /(?:[^?!.,:;*_~()&]+|\([^)]*\)|&(?![a-zA-Z0-9]+;$)|[?!.,:;*_~)]+(?!$))+/,
+    del: /^(~~?)(?=[^\s~])([\s\S]*?[^\s~])\1(?=[^~]|$)/,
+    text: /^([`~]+|[^`~])(?:(?= {2,}\n)|(?=[a-zA-Z0-9.!#$%&'*+\/=?_`{\|}~-]+@)|[\s\S]*?(?:(?=[\\<!\[`*~_]|\b_|https?:\/\/|ftp:\/\/|www\.|$)|[^ ](?= {2,}\n)|[^a-zA-Z0-9.!#$%&'*+\/=?_`{\|}~-](?=[a-zA-Z0-9.!#$%&'*+\/=?_`{\|}~-]+@)))/
+});
+inline.gfm.url = edit(inline.gfm.url, 'i')
+    .replace('email', inline.gfm._extended_email)
+    .getRegex();
+/**
+ * GFM + Line Breaks Inline Grammar
+ */
+inline.breaks = merge({}, inline.gfm, {
+    br: edit(inline.br).replace('{2,}', '*').getRegex(),
+    text: edit(inline.gfm.text)
+        .replace('\\b_', '\\b_| {2,}\\n')
+        .replace(/\{2,\}/g, '*')
+        .getRegex()
+});

package/build/node_modules/chrome-devtools-frontend/mcp/mcp.js

@@ -6,9 +6,16 @@
  * tests added to foundation_unittests. See front_end/core/i18n/BUILD.gn as an
  * example.
  */
+export * as Common from '../front_end/core/common/common.js';
 export * as I18n from '../front_end/core/i18n/i18n.js';
 export { ConnectionTransport } from '../front_end/core/protocol_client/ConnectionTransport.js';
+export * as Foundation from '../front_end/foundation/foundation.js';
 export { PerformanceInsightFormatter } from '../front_end/models/ai_assistance/data_formatters/PerformanceInsightFormatter.js';
 export { PerformanceTraceFormatter } from '../front_end/models/ai_assistance/data_formatters/PerformanceTraceFormatter.js';
 export { AgentFocus } from '../front_end/models/ai_assistance/performance/AIContext.js';
+export { Issue } from '../front_end/models/issues_manager/Issue.js';
+export { AggregatedIssue, IssueAggregator } from '../front_end/models/issues_manager/IssueAggregator.js';
+export { createIssuesFromProtocolIssue, IssuesManager } from '../front_end/models/issues_manager/IssuesManager.js';
+export { findTitleFromMarkdownAst } from '../front_end/models/issues_manager/MarkdownIssueDescription.js';
 export * as TraceEngine from '../front_end/models/trace/trace.js';
+export * as Marked from '../front_end/third_party/marked/marked.js';

package/build/src/DevToolsConnectionAdapter.js

@@ -3,8 +3,7 @@
  * Copyright 2025 Google LLC
  * SPDX-License-Identifier: Apache-2.0
  */
-// eslint-disable-next-line no-restricted-imports
-import { ConnectionTransport as DevToolsConnectionTransport } from '../node_modules/chrome-devtools-frontend/front_end/core/protocol_client/ConnectionTransport.js';
+import { ConnectionTransport as DevToolsConnectionTransport } from '../node_modules/chrome-devtools-frontend/mcp/mcp.js';
 /**
  * Allows a puppeteer {@link ConnectionTransport} to act like a DevTools {@link Connection}.
  */

package/build/src/DevtoolsUtils.js

@@ -3,6 +3,7 @@
  * Copyright 2025 Google LLC
  * SPDX-License-Identifier: Apache-2.0
  */
+import { Common, I18n, } from '../node_modules/chrome-devtools-frontend/mcp/mcp.js';
 export function extractUrlLikeFromDevToolsTitle(title) {
     const match = title.match(new RegExp(`DevTools - (.*)`));
     return match?.[1] ?? undefined;
@@ -42,3 +43,22 @@ function normalizeUrl(url) {
     }
     return result;
 }
+/**
+ * A mock implementation of an issues manager that only implements the methods
+ * that are actually used by the IssuesAggregator
+ */
+export class FakeIssuesManager extends Common.ObjectWrapper
+    .ObjectWrapper {
+    issues() {
+        return [];
+    }
+}
+I18n.DevToolsLocale.DevToolsLocale.instance({
+    create: true,
+    data: {
+        navigatorLanguage: 'en-US',
+        settingLanguage: 'en-US',
+        lookupClosestDevToolsLocale: l => l,
+    },
+});
+I18n.i18n.registerLocaleDataForTest('en-US', {});

package/build/src/McpContext.js

@@ -7,7 +7,7 @@ import fs from 'node:fs/promises';
 import os from 'node:os';
 import path from 'node:path';
 import { extractUrlLikeFromDevToolsTitle, urlsEqual } from './DevtoolsUtils.js';
-import { NetworkCollector, PageCollector } from './PageCollector.js';
+import { NetworkCollector, ConsoleCollector } from './PageCollector.js';
 import { Locator } from './third_party/index.js';
 import { listPages } from './tools/pages.js';
 import { takeSnapshot } from './tools/snapshot.js';
@@ -65,7 +65,7 @@ export class McpContext {
         this.#locatorClass = locatorClass;
         this.#options = options;
         this.#networkCollector = new NetworkCollector(this.browser, undefined, this.#options.experimentalIncludeAllPages);
-        this.#consoleCollector = new PageCollector(this.browser, collect => {
+        this.#consoleCollector = new ConsoleCollector(this.browser, collect => {
             return {
                 console: event => {
                     collect(event);
@@ -80,6 +80,9 @@ export class McpContext {
                         collect(error);
                     }
                 },
+                issue: event => {
+                    collect(event);
+                },
             };
         }, this.#options.experimentalIncludeAllPages);
     }
@@ -88,6 +91,10 @@ export class McpContext {
         await this.#networkCollector.init();
         await this.#consoleCollector.init();
     }
+    dispose() {
+        this.#networkCollector.dispose();
+        this.#consoleCollector.dispose();
+    }
     static async from(browser, logger, opts, 
     /* Let tests use unbundled Locator class to avoid overly strict checks within puppeteer that fail when mixing bundled and unbundled class instances */
     locatorClass = Locator) {

package/build/src/McpResponse.js

@@ -1,6 +1,14 @@
+/**
+ * @license
+ * Copyright 2025 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+import { AggregatedIssue, Marked, findTitleFromMarkdownAst, } from '../node_modules/chrome-devtools-frontend/mcp/mcp.js';
 import { formatConsoleEventShort, formatConsoleEventVerbose, } from './formatters/consoleFormatter.js';
 import { getFormattedHeaderValue, getFormattedResponseBody, getFormattedRequestBody, getShortDescriptionForRequest, getStatusFromRequest, } from './formatters/networkFormatter.js';
 import { formatSnapshotNode } from './formatters/snapshotFormatter.js';
+import { getIssueDescription } from './issue-descriptions.js';
+import { logger } from './logger.js';
 import { handleDialog } from './tools/pages.js';
 import { paginate } from './utils/pagination.js';
 export class McpResponse {
@@ -166,10 +174,13 @@ export class McpResponse {
                     if ('type' in message) {
                         return normalizedTypes.has(message.type());
                     }
+                    if (message instanceof AggregatedIssue) {
+                        return normalizedTypes.has('issue');
+                    }
                     return normalizedTypes.has('error');
                 });
             }
-            consoleListData = await Promise.all(messages.map(async (item) => {
+            consoleListData = (await Promise.all(messages.map(async (item) => {
                 const consoleMessageStableId = context.getConsoleMessageStableId(item);
                 if ('args' in item) {
                     const consoleMessage = item;
@@ -187,13 +198,38 @@ export class McpResponse {
                         })),
                     };
                 }
+                if (item instanceof AggregatedIssue) {
+                    const count = item.getAggregatedIssuesCount();
+                    const filename = item.getDescription()?.file;
+                    const rawMarkdown = filename
+                        ? getIssueDescription(filename)
+                        : null;
+                    if (!rawMarkdown) {
+                        logger(`no markdown ${filename} found for issue:` + item.code);
+                        return null;
+                    }
+                    const markdownAst = Marked.Marked.lexer(rawMarkdown);
+                    const title = findTitleFromMarkdownAst(markdownAst);
+                    if (!title) {
+                        logger('cannot read issue title from ' + filename);
+                        return null;
+                    }
+                    return {
+                        consoleMessageStableId,
+                        type: 'issue',
+                        item,
+                        message: title,
+                        count,
+                        args: [],
+                    };
+                }
                 return {
                     consoleMessageStableId,
                     type: 'error',
                     message: item.message,
                     args: [],
                 };
-            }));
+            }))).filter(item => item !== null);
         }
         return this.format(toolName, context, {
             bodies,

package/build/src/PageCollector.js

@@ -3,6 +3,10 @@
  * Copyright 2025 Google LLC
  * SPDX-License-Identifier: Apache-2.0
  */
+import { createIssuesFromProtocolIssue, IssueAggregator, } from '../node_modules/chrome-devtools-frontend/mcp/mcp.js';
+import { FakeIssuesManager } from './DevtoolsUtils.js';
+import { features } from './features.js';
+import { logger } from './logger.js';
 function createIdGenerator() {
     let i = 1;
     return () => {
@@ -33,23 +37,29 @@ export class PageCollector {
     async init() {
         const pages = await this.#browser.pages(this.#includeAllPages);
         for (const page of pages) {
-            this.#initializePage(page);
+            this.addPage(page);
         }
-        this.#browser.on('targetcreated', async (target) => {
-            const page = await target.page();
-            if (!page) {
-                return;
-            }
-            this.#initializePage(page);
-        });
-        this.#browser.on('targetdestroyed', async (target) => {
-            const page = await target.page();
-            if (!page) {
-                return;
-            }
-            this.#cleanupPageDestroyed(page);
-        });
+        this.#browser.on('targetcreated', this.#onTargetCreated);
+        this.#browser.on('targetdestroyed', this.#onTargetDestroyed);
     }
+    dispose() {
+        this.#browser.off('targetcreated', this.#onTargetCreated);
+        this.#browser.off('targetdestroyed', this.#onTargetDestroyed);
+    }
+    #onTargetCreated = async (target) => {
+        const page = await target.page();
+        if (!page) {
+            return;
+        }
+        this.addPage(page);
+    };
+    #onTargetDestroyed = async (target) => {
+        const page = await target.page();
+        if (!page) {
+            return;
+        }
+        this.cleanupPageDestroyed(page);
+    };
     addPage(page) {
         this.#initializePage(page);
     }
@@ -87,7 +97,7 @@ export class PageCollector {
         navigations.unshift([]);
         navigations.splice(this.#maxNavigationSaved);
     }
-    #cleanupPageDestroyed(page) {
+    cleanupPageDestroyed(page) {
         const listeners = this.#listeners.get(page);
         if (listeners) {
             for (const [name, listener] of Object.entries(listeners)) {
@@ -140,6 +150,111 @@ export class PageCollector {
         return;
     }
 }
+export class ConsoleCollector extends PageCollector {
+    #subscribedPages = new WeakMap();
+    addPage(page) {
+        super.addPage(page);
+        if (!features.issues) {
+            return;
+        }
+        if (!this.#subscribedPages.has(page)) {
+            const subscriber = new PageIssueSubscriber(page);
+            this.#subscribedPages.set(page, subscriber);
+            void subscriber.subscribe();
+        }
+    }
+    cleanupPageDestroyed(page) {
+        super.cleanupPageDestroyed(page);
+        this.#subscribedPages.get(page)?.unsubscribe();
+        this.#subscribedPages.delete(page);
+    }
+}
+class PageIssueSubscriber {
+    #issueManager = new FakeIssuesManager();
+    #issueAggregator = new IssueAggregator(this.#issueManager);
+    #seenKeys = new Set();
+    #seenIssues = new Set();
+    #page;
+    #session;
+    constructor(page) {
+        this.#page = page;
+        // @ts-expect-error use existing CDP client (internal Puppeteer API).
+        this.#session = this.#page._client();
+    }
+    #resetIssueAggregator() {
+        this.#issueManager = new FakeIssuesManager();
+        if (this.#issueAggregator) {
+            this.#issueAggregator.removeEventListener("AggregatedIssueUpdated" /* IssueAggregatorEvents.AGGREGATED_ISSUE_UPDATED */, this.#onAggregatedissue);
+        }
+        this.#issueAggregator = new IssueAggregator(this.#issueManager);
+        this.#issueAggregator.addEventListener("AggregatedIssueUpdated" /* IssueAggregatorEvents.AGGREGATED_ISSUE_UPDATED */, this.#onAggregatedissue);
+    }
+    async subscribe() {
+        this.#resetIssueAggregator();
+        this.#page.on('framenavigated', this.#onFrameNavigated);
+        this.#session.on('Audits.issueAdded', this.#onIssueAdded);
+        try {
+            await this.#session.send('Audits.enable');
+        }
+        catch (error) {
+            logger('Error subscribing to issues', error);
+        }
+    }
+    unsubscribe() {
+        this.#seenKeys.clear();
+        this.#seenIssues.clear();
+        this.#page.off('framenavigated', this.#onFrameNavigated);
+        this.#session.off('Audits.issueAdded', this.#onIssueAdded);
+        if (this.#issueAggregator) {
+            this.#issueAggregator.removeEventListener("AggregatedIssueUpdated" /* IssueAggregatorEvents.AGGREGATED_ISSUE_UPDATED */, this.#onAggregatedissue);
+        }
+        void this.#session.send('Audits.disable').catch(() => {
+            // might fail.
+        });
+    }
+    #onAggregatedissue = (event) => {
+        if (this.#seenIssues.has(event.data)) {
+            return;
+        }
+        this.#seenIssues.add(event.data);
+        this.#page.emit('issue', event.data);
+    };
+    // On navigation, we reset issue aggregation.
+    #onFrameNavigated = (frame) => {
+        // Only split the storage on main frame navigation
+        if (frame !== frame.page().mainFrame()) {
+            return;
+        }
+        this.#seenKeys.clear();
+        this.#seenIssues.clear();
+        this.#resetIssueAggregator();
+    };
+    #onIssueAdded = (data) => {
+        try {
+            const inspectorIssue = data.issue;
+            // @ts-expect-error Types of protocol from Puppeteer and CDP are
+            // incomparable for InspectorIssueCode, one is union, other is enum.
+            const issue = createIssuesFromProtocolIssue(null, inspectorIssue)[0];
+            if (!issue) {
+                logger('No issue mapping for for the issue: ', inspectorIssue.code);
+                return;
+            }
+            const primaryKey = issue.primaryKey();
+            if (this.#seenKeys.has(primaryKey)) {
+                return;
+            }
+            this.#seenKeys.add(primaryKey);
+            this.#issueManager.dispatchEventToListeners("IssueAdded" /* IssuesManagerEvents.ISSUE_ADDED */, {
+                issue,
+                // @ts-expect-error We don't care that issues model is null
+                issuesModel: null,
+            });
+        }
+        catch (error) {
+            logger('Error creating a new issue', error);
+        }
+    };
+}
 export class NetworkCollector extends PageCollector {
     constructor(browser, listeners = collect => {
         return {

package/build/src/features.js

@@ -0,0 +1,14 @@
+/**
+ * @license
+ * Copyright 2025 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+let issuesEnabled = false;
+export const features = {
+    get issues() {
+        return issuesEnabled;
+    },
+};
+export function setIssuesEnabled(value) {
+    issuesEnabled = value;
+}

package/build/src/formatters/consoleFormatter.js

@@ -5,6 +5,9 @@
  */
 // The short format for a console message, based on a previous format.
 export function formatConsoleEventShort(msg) {
+    if (msg.type === 'issue') {
+        return `msgid=${msg.consoleMessageStableId} [${msg.type}] ${msg.message} (count: ${msg.count})`;
+    }
     return `msgid=${msg.consoleMessageStableId} [${msg.type}] ${msg.message} (${msg.args?.length ?? 0} args)`;
 }
 function getArgs(msg) {

package/build/src/issue-descriptions.js

@@ -0,0 +1,35 @@
+/**
+ * @license
+ * Copyright 2025 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+import * as fs from 'node:fs';
+import * as path from 'node:path';
+const DESCRIPTIONS_PATH = path.join(import.meta.dirname, '../node_modules/chrome-devtools-frontend/front_end/models/issues_manager/descriptions');
+let issueDescriptions = {};
+/**
+ * Reads all issue descriptions from the filesystem into memory.
+ */
+export async function loadIssueDescriptions() {
+    if (Object.keys(issueDescriptions).length > 0) {
+        return;
+    }
+    const files = await fs.promises.readdir(DESCRIPTIONS_PATH);
+    const descriptions = {};
+    for (const file of files) {
+        if (!file.endsWith('.md')) {
+            continue;
+        }
+        const content = await fs.promises.readFile(path.join(DESCRIPTIONS_PATH, file), 'utf-8');
+        descriptions[file] = content;
+    }
+    issueDescriptions = descriptions;
+}
+/**
+ * Gets an issue description from the in-memory cache.
+ * @param fileName The file name of the issue description.
+ * @returns The description of the issue, or null if it doesn't exist.
+ */
+export function getIssueDescription(fileName) {
+    return issueDescriptions[fileName] ?? null;
+}