From 4aa2419571bf88c922470bbbd2850015aaae6e17 Mon Sep 17 00:00:00 2001 From: Alex Rudenko Date: Thu, 11 Dec 2025 12:47:52 +0100 Subject: [PATCH 1/2] build: bundle devtools frontend (#656) --- package.json | 4 +++ src/DevToolsConnectionAdapter.ts | 25 ++++++++++----- src/DevtoolsUtils.ts | 51 +++++++++++++++++------------- src/McpContext.ts | 9 ++++-- src/McpResponse.ts | 10 ++++-- src/PageCollector.ts | 30 ++++++++++-------- src/formatters/consoleFormatter.ts | 8 +++-- src/third_party/devtools.ts | 31 ++++++++++++++++++ src/third_party/index.ts | 4 +++ src/trace-processing/parse.ts | 31 ++++++++++-------- tests/DevtoolsUtils.test.ts | 26 +++++++++++---- tests/PageCollector.test.ts | 14 +++++--- tests/tools/console.test.ts | 6 +++- tests/utils.ts | 10 ++++-- 14 files changed, 180 insertions(+), 79 deletions(-) create mode 100644 src/third_party/devtools.ts diff --git a/package.json b/package.json index dbd5d780a..bbdff2607 100644 --- a/package.json +++ b/package.json @@ -19,7 +19,11 @@ "test:node20": "node --import ./build/tests/setup.js --test-reporter spec --test-force-exit --test build/tests", "test:no-build": "node --import ./build/tests/setup.js --no-warnings=ExperimentalWarning --experimental-print-required-tla --test-reporter spec --test-force-exit --test \"build/tests/**/*.test.js\"", "test": "npm run build && npm run test:no-build", +<<<<<<< HEAD "test:only": "npm run build && node --import ./build/tests/setup.js --no-warnings=ExperimentalWarning --test-reporter spec --test-force-exit --test --test-only \"build/tests/**/*.test.js\"", +======= + "test:only": "npm run build && npm run test:only:no-build", +>>>>>>> 8e5e779 (build: bundle devtools frontend (#656)) "test:only:no-build": "node --import ./build/tests/setup.js --no-warnings=ExperimentalWarning --test-reporter spec --test-force-exit --test --test-only \"build/tests/**/*.test.js\"", "test:update-snapshots": "npm run build && node --import ./build/tests/setup.js --no-warnings=ExperimentalWarning --test-force-exit --test --test-update-snapshots \"build/tests/**/*.test.js\"", "prepare": "node --experimental-strip-types scripts/prepare.ts", diff --git a/src/DevToolsConnectionAdapter.ts b/src/DevToolsConnectionAdapter.ts index a83167999..77a47389b 100644 --- a/src/DevToolsConnectionAdapter.ts +++ b/src/DevToolsConnectionAdapter.ts @@ -4,8 +4,12 @@ * SPDX-License-Identifier: Apache-2.0 */ +<<<<<<< HEAD import type {CDPConnection as devtools} from './third_party/index.js'; +======= +>>>>>>> 8e5e779 (build: bundle devtools frontend (#656)) import type * as puppeteer from './third_party/index.js'; +import type {DevTools} from './third_party/index.js'; import {CDPSessionEvent} from './third_party/index.js'; /** @@ -16,9 +20,11 @@ import {CDPSessionEvent} from './third_party/index.js'; * We don't have to recursively listen for 'sessionattached' as the "root" CDP session sees all child session attached * events, regardless how deeply nested they are. */ -export class PuppeteerDevToolsConnection implements devtools.CDPConnection { +export class PuppeteerDevToolsConnection + implements DevTools.CDPConnection.CDPConnection +{ readonly #connection: puppeteer.Connection; - readonly #observers = new Set(); + readonly #observers = new Set(); readonly #sessionEventHandlers = new Map< string, puppeteer.Handler @@ -39,11 +45,14 @@ export class PuppeteerDevToolsConnection implements devtools.CDPConnection { this.#startForwardingCdpEvents(session); } - send( + send( method: T, - params: devtools.CommandParams, + params: DevTools.CDPConnection.CommandParams, sessionId: string | undefined, - ): Promise<{result: devtools.CommandResult} | {error: devtools.CDPError}> { + ): Promise< + | {result: DevTools.CDPConnection.CommandResult} + | {error: DevTools.CDPConnection.CDPError} + > { if (sessionId === undefined) { throw new Error( 'Attempting to send on the root session. This must not happen', @@ -62,11 +71,11 @@ export class PuppeteerDevToolsConnection implements devtools.CDPConnection { /* eslint-enable @typescript-eslint/no-explicit-any */ } - observe(observer: devtools.CDPConnectionObserver): void { + observe(observer: DevTools.CDPConnection.CDPConnectionObserver): void { this.#observers.add(observer); } - unobserve(observer: devtools.CDPConnectionObserver): void { + unobserve(observer: DevTools.CDPConnection.CDPConnectionObserver): void { this.#observers.delete(observer); } @@ -98,7 +107,7 @@ export class PuppeteerDevToolsConnection implements devtools.CDPConnection { ) { this.#observers.forEach(observer => observer.onEvent({ - method: type as devtools.Event, + method: type as DevTools.CDPConnection.Event, sessionId, params: event, }), diff --git a/src/DevtoolsUtils.ts b/src/DevtoolsUtils.ts index 1b60e6f1f..0589e6f99 100644 --- a/src/DevtoolsUtils.ts +++ b/src/DevtoolsUtils.ts @@ -8,6 +8,7 @@ import {PuppeteerDevToolsConnection} from './DevToolsConnectionAdapter.js'; import {ISSUE_UTILS} from './issue-descriptions.js'; import {logger} from './logger.js'; import {Mutex} from './Mutex.js'; +<<<<<<< HEAD import { type Issue, type AggregatedIssue, @@ -22,6 +23,9 @@ import { Common, I18n, } from './third_party/index.js'; +======= +import {DevTools} from './third_party/index.js'; +>>>>>>> 8e5e779 (build: bundle devtools frontend (#656)) import type { Browser, Page, @@ -87,14 +91,14 @@ function normalizeUrl(url: string): string { * 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(): Issue[] { +export class FakeIssuesManager extends DevTools.Common.ObjectWrapper + .ObjectWrapper { + issues(): DevTools.Issue[] { return []; } } -export function mapIssueToMessageObject(issue: AggregatedIssue) { +export function mapIssueToMessageObject(issue: DevTools.AggregatedIssue) { const count = issue.getAggregatedIssuesCount(); const markdownDescription = issue.getDescription(); const filename = markdownDescription?.file; @@ -113,12 +117,14 @@ export function mapIssueToMessageObject(issue: AggregatedIssue) { let title: string | null; try { - processedMarkdown = MarkdownIssueDescription.substitutePlaceholders( - rawMarkdown, - markdownDescription.substitutions, - ); - const markdownAst = Marked.Marked.lexer(processedMarkdown); - title = MarkdownIssueDescription.findTitleFromMarkdownAst(markdownAst); + processedMarkdown = + DevTools.MarkdownIssueDescription.substitutePlaceholders( + rawMarkdown, + markdownDescription.substitutions, + ); + const markdownAst = DevTools.Marked.Marked.lexer(processedMarkdown); + title = + DevTools.MarkdownIssueDescription.findTitleFromMarkdownAst(markdownAst); } catch { logger('error parsing markdown for issue ' + issue.code()); return null; @@ -137,9 +143,9 @@ export function mapIssueToMessageObject(issue: AggregatedIssue) { } // DevTools CDP errors can get noisy. -ProtocolClient.InspectorBackend.test.suppressRequestErrors = true; +DevTools.ProtocolClient.InspectorBackend.test.suppressRequestErrors = true; -I18n.DevToolsLocale.DevToolsLocale.instance({ +DevTools.I18n.DevToolsLocale.DevToolsLocale.instance({ create: true, data: { navigatorLanguage: 'en-US', @@ -147,12 +153,12 @@ I18n.DevToolsLocale.DevToolsLocale.instance({ lookupClosestDevToolsLocale: l => l, }, }); -I18n.i18n.registerLocaleDataForTest('en-US', {}); +DevTools.I18n.i18n.registerLocaleDataForTest('en-US', {}); export interface TargetUniverse { /** The DevTools target corresponding to the puppeteer Page */ - target: Target; - universe: Foundation.Universe.Universe; + target: DevTools.SDKTarget; + universe: DevTools.Foundation.Universe.Universe; } export type TargetUniverseFactoryFn = (page: Page) => Promise; @@ -231,22 +237,23 @@ export class UniverseManager { } const DEFAULT_FACTORY: TargetUniverseFactoryFn = async (page: Page) => { - const settingStorage = new Common.Settings.SettingsStorage({}); - const universe = new Foundation.Universe.Universe({ + const settingStorage = new DevTools.Common.Settings.SettingsStorage({}); + const universe = new DevTools.Foundation.Universe.Universe({ settingsCreationOptions: { syncedStorage: settingStorage, globalStorage: settingStorage, localStorage: settingStorage, - settingRegistrations: Common.SettingRegistration.getRegisteredSettings(), + settingRegistrations: + DevTools.Common.SettingRegistration.getRegisteredSettings(), }, - overrideAutoStartModels: new Set([DebuggerModel]), + overrideAutoStartModels: new Set([DevTools.DebuggerModel]), }); const session = await page.createCDPSession(); const connection = new PuppeteerDevToolsConnection(session); - const targetManager = universe.context.get(TargetManager); - targetManager.observeModels(DebuggerModel, SKIP_ALL_PAUSES); + const targetManager = universe.context.get(DevTools.TargetManager); + targetManager.observeModels(DevTools.DebuggerModel, SKIP_ALL_PAUSES); const target = targetManager.createTarget( 'main', @@ -266,7 +273,7 @@ const DEFAULT_FACTORY: TargetUniverseFactoryFn = async (page: Page) => { // sent. This means DevTools can still pause, step and do whatever. We just won't // see the `Debugger.paused`/`Debugger.resumed` events on the MCP side. const SKIP_ALL_PAUSES = { - modelAdded(model: DebuggerModel): void { + modelAdded(model: DevTools.DebuggerModel): void { void model.agent.invoke_setSkipAllPauses({skip: true}); }, diff --git a/src/McpContext.ts b/src/McpContext.ts index 9bc760cfe..5fe2587bc 100644 --- a/src/McpContext.ts +++ b/src/McpContext.ts @@ -13,6 +13,7 @@ import type {ListenerMap} from './PageCollector.js'; import {NetworkCollector, ConsoleCollector} from './PageCollector.js'; import {type AggregatedIssue} from './third_party/index.js'; import {Locator} from './third_party/index.js'; +import type {DevTools} from './third_party/index.js'; import type { Browser, ConsoleMessage, @@ -221,18 +222,20 @@ export class McpContext implements Context { getConsoleData( includePreservedMessages?: boolean, - ): Array { + ): Array { const page = this.getSelectedPage(); return this.#consoleCollector.getData(page, includePreservedMessages); } getConsoleMessageStableId( - message: ConsoleMessage | Error | AggregatedIssue, + message: ConsoleMessage | Error | DevTools.AggregatedIssue, ): number { return this.#consoleCollector.getIdForResource(message); } - getConsoleMessageById(id: number): ConsoleMessage | Error | AggregatedIssue { + getConsoleMessageById( + id: number, + ): ConsoleMessage | Error | DevTools.AggregatedIssue { return this.#consoleCollector.getById(this.getSelectedPage(), id); } diff --git a/src/McpResponse.ts b/src/McpResponse.ts index 0b8c8cee3..a1da08fda 100644 --- a/src/McpResponse.ts +++ b/src/McpResponse.ts @@ -19,7 +19,11 @@ import { } from './formatters/networkFormatter.js'; import {formatSnapshotNode} from './formatters/snapshotFormatter.js'; import type {McpContext} from './McpContext.js'; +<<<<<<< HEAD import {AggregatedIssue} from './third_party/index.js'; +======= +import {DevTools} from './third_party/index.js'; +>>>>>>> 8e5e779 (build: bundle devtools frontend (#656)) import type { ConsoleMessage, ImageContent, @@ -250,7 +254,7 @@ export class McpResponse implements Response { }), ), }; - } else if (message instanceof AggregatedIssue) { + } else if (message instanceof DevTools.AggregatedIssue) { const mappedIssueMessage = mapIssueToMessageObject(message); if (!mappedIssueMessage) throw new Error( @@ -282,7 +286,7 @@ export class McpResponse implements Response { if ('type' in message) { return normalizedTypes.has(message.type()); } - if (message instanceof AggregatedIssue) { + if (message instanceof DevTools.AggregatedIssue) { return normalizedTypes.has('issue'); } return normalizedTypes.has('error'); @@ -312,7 +316,7 @@ export class McpResponse implements Response { ), }; } - if (item instanceof AggregatedIssue) { + if (item instanceof DevTools.AggregatedIssue) { const mappedIssueMessage = mapIssueToMessageObject(item); if (!mappedIssueMessage) return null; return { diff --git a/src/PageCollector.ts b/src/PageCollector.ts index 28f1edc4d..d81b0290d 100644 --- a/src/PageCollector.ts +++ b/src/PageCollector.ts @@ -20,6 +20,7 @@ import { createIssuesFromProtocolIssue, IssueAggregator, } from './third_party/index.js'; +import {DevTools} from './third_party/index.js'; import { type Browser, type Frame, @@ -30,7 +31,7 @@ import { } from './third_party/index.js'; interface PageEvents extends PuppeteerPageEvents { - issue: AggregatedIssue; + issue: DevTools.AggregatedIssue; } export type ListenerMap = { @@ -218,7 +219,7 @@ export class PageCollector { } export class ConsoleCollector extends PageCollector< - ConsoleMessage | Error | AggregatedIssue + ConsoleMessage | Error | DevTools.AggregatedIssue > { #subscribedPages = new WeakMap(); @@ -240,9 +241,9 @@ export class ConsoleCollector extends PageCollector< class PageIssueSubscriber { #issueManager = new FakeIssuesManager(); - #issueAggregator = new IssueAggregator(this.#issueManager); + #issueAggregator = new DevTools.IssueAggregator(this.#issueManager); #seenKeys = new Set(); - #seenIssues = new Set(); + #seenIssues = new Set(); #page: Page; #session: CDPSession; @@ -256,14 +257,13 @@ class PageIssueSubscriber { this.#issueManager = new FakeIssuesManager(); if (this.#issueAggregator) { this.#issueAggregator.removeEventListener( - IssueAggregatorEvents.AGGREGATED_ISSUE_UPDATED, + DevTools.IssueAggregatorEvents.AGGREGATED_ISSUE_UPDATED, this.#onAggregatedissue, ); } - this.#issueAggregator = new IssueAggregator(this.#issueManager); - + this.#issueAggregator = new DevTools.IssueAggregator(this.#issueManager); this.#issueAggregator.addEventListener( - IssueAggregatorEvents.AGGREGATED_ISSUE_UPDATED, + DevTools.IssueAggregatorEvents.AGGREGATED_ISSUE_UPDATED, this.#onAggregatedissue, ); } @@ -286,7 +286,7 @@ class PageIssueSubscriber { this.#session.off('Audits.issueAdded', this.#onIssueAdded); if (this.#issueAggregator) { this.#issueAggregator.removeEventListener( - IssueAggregatorEvents.AGGREGATED_ISSUE_UPDATED, + DevTools.IssueAggregatorEvents.AGGREGATED_ISSUE_UPDATED, this.#onAggregatedissue, ); } @@ -296,7 +296,7 @@ class PageIssueSubscriber { } #onAggregatedissue = ( - event: Common.EventTarget.EventTargetEvent, + event: DevTools.Common.EventTarget.EventTargetEvent, ) => { if (this.#seenIssues.has(event.data)) { return; @@ -319,9 +319,11 @@ class PageIssueSubscriber { #onIssueAdded = (data: Protocol.Audits.IssueAddedEvent) => { 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]; + const issue = DevTools.createIssuesFromProtocolIssue( + null, + // @ts-expect-error Protocol types diverge. + inspectorIssue, + )[0]; if (!issue) { logger('No issue mapping for for the issue: ', inspectorIssue.code); return; @@ -333,7 +335,7 @@ class PageIssueSubscriber { } this.#seenKeys.add(primaryKey); this.#issueManager.dispatchEventToListeners( - IssuesManagerEvents.ISSUE_ADDED, + DevTools.IssuesManagerEvents.ISSUE_ADDED, { issue, // @ts-expect-error We don't care that issues model is null diff --git a/src/formatters/consoleFormatter.ts b/src/formatters/consoleFormatter.ts index 86222ba2d..a809c4e06 100644 --- a/src/formatters/consoleFormatter.ts +++ b/src/formatters/consoleFormatter.ts @@ -5,12 +5,16 @@ */ import type {McpContext} from '../McpContext.js'; +<<<<<<< HEAD import {type AggregatedIssue} from '../third_party/index.js'; +======= +import type {DevTools} from '../third_party/index.js'; +>>>>>>> 8e5e779 (build: bundle devtools frontend (#656)) export interface ConsoleMessageData { consoleMessageStableId: number; type?: string; - item?: AggregatedIssue; + item?: DevTools.AggregatedIssue; message?: string; count?: number; description?: string; @@ -71,7 +75,7 @@ function formatArgs(consoleData: ConsoleMessageData): string { } export function formatIssue( - issue: AggregatedIssue, + issue: DevTools.AggregatedIssue, description?: string, context?: McpContext, ): string { diff --git a/src/third_party/devtools.ts b/src/third_party/devtools.ts new file mode 100644 index 000000000..5e06db4ee --- /dev/null +++ b/src/third_party/devtools.ts @@ -0,0 +1,31 @@ +/** + * @license + * Copyright 2025 Google LLC + * SPDX-License-Identifier: Apache-2.0 + */ + +export type { + IssuesManagerEventTypes, + CDPConnection, +} from '../../node_modules/chrome-devtools-frontend/mcp/mcp.js'; +export { + AgentFocus, + TraceEngine, + PerformanceTraceFormatter, + PerformanceInsightFormatter, + AggregatedIssue, + Issue, + Target as SDKTarget, + DebuggerModel, + Foundation, + TargetManager, + MarkdownIssueDescription, + Marked, + ProtocolClient, + Common, + I18n, + IssueAggregatorEvents, + IssuesManagerEvents, + createIssuesFromProtocolIssue, + IssueAggregator, +} from '../../node_modules/chrome-devtools-frontend/mcp/mcp.js'; diff --git a/src/third_party/index.ts b/src/third_party/index.ts index 8239f1cf7..9324f524c 100644 --- a/src/third_party/index.ts +++ b/src/third_party/index.ts @@ -36,6 +36,7 @@ export { type ChromeReleaseChannel as BrowsersChromeReleaseChannel, } from '@puppeteer/browsers'; +<<<<<<< HEAD export { AgentFocus, TraceEngine, @@ -59,3 +60,6 @@ export { createIssuesFromProtocolIssue, IssueAggregator, } from '../../node_modules/chrome-devtools-frontend/mcp/mcp.js'; +======= +export * as DevTools from './devtools.js'; +>>>>>>> 8e5e779 (build: bundle devtools frontend (#656)) diff --git a/src/trace-processing/parse.ts b/src/trace-processing/parse.ts index 25c969b7d..b1373807d 100644 --- a/src/trace-processing/parse.ts +++ b/src/trace-processing/parse.ts @@ -5,18 +5,22 @@ */ import {logger} from '../logger.js'; +<<<<<<< HEAD import { AgentFocus, TraceEngine, PerformanceTraceFormatter, PerformanceInsightFormatter, } from '../third_party/index.js'; +======= +import {DevTools} from '../third_party/index.js'; +>>>>>>> 8e5e779 (build: bundle devtools frontend (#656)) -const engine = TraceEngine.TraceModel.Model.createWithAllHandlers(); +const engine = DevTools.TraceEngine.TraceModel.Model.createWithAllHandlers(); export interface TraceResult { - parsedTrace: TraceEngine.TraceModel.ParsedTrace; - insights: TraceEngine.Insights.Types.TraceInsightSets | null; + parsedTrace: DevTools.TraceEngine.TraceModel.ParsedTrace; + insights: DevTools.TraceEngine.Insights.Types.TraceInsightSets | null; } export function traceResultIsSuccess( @@ -47,9 +51,9 @@ export async function parseRawTraceBuffer( try { const data = JSON.parse(asString) as | { - traceEvents: TraceEngine.Types.Events.Event[]; + traceEvents: DevTools.TraceEngine.Types.Events.Event[]; } - | TraceEngine.Types.Events.Event[]; + | DevTools.TraceEngine.Types.Events.Event[]; const events = Array.isArray(data) ? data : data.traceEvents; await engine.parse(events); @@ -77,13 +81,13 @@ export async function parseRawTraceBuffer( const extraFormatDescriptions = `Information on performance traces may contain main thread activity represented as call frames and network requests. -${PerformanceTraceFormatter.callFrameDataFormatDescription} - -${PerformanceTraceFormatter.networkDataFormatDescription}`; +${DevTools.PerformanceTraceFormatter.callFrameDataFormatDescription} + +${DevTools.PerformanceTraceFormatter.networkDataFormatDescription}`; export function getTraceSummary(result: TraceResult): string { - const focus = AgentFocus.fromParsedTrace(result.parsedTrace); - const formatter = new PerformanceTraceFormatter(focus); + const focus = DevTools.AgentFocus.fromParsedTrace(result.parsedTrace); + const formatter = new DevTools.PerformanceTraceFormatter(focus); const summaryText = formatter.formatTraceSummary(); return `## Summary of Performance trace findings: ${summaryText} @@ -92,7 +96,8 @@ ${summaryText} ${extraFormatDescriptions}`; } -export type InsightName = keyof TraceEngine.Insights.Types.InsightModels; +export type InsightName = + keyof DevTools.TraceEngine.Insights.Types.InsightModels; export type InsightOutput = {output: string} | {error: string}; export function getInsightOutput( @@ -122,8 +127,8 @@ export function getInsightOutput( }; } - const formatter = new PerformanceInsightFormatter( - AgentFocus.fromParsedTrace(result.parsedTrace), + const formatter = new DevTools.PerformanceInsightFormatter( + DevTools.AgentFocus.fromParsedTrace(result.parsedTrace), matchingInsight, ); return {output: formatter.formatInsight()}; diff --git a/tests/DevtoolsUtils.test.ts b/tests/DevtoolsUtils.test.ts index 2e602a951..bf1c9b291 100644 --- a/tests/DevtoolsUtils.test.ts +++ b/tests/DevtoolsUtils.test.ts @@ -16,7 +16,11 @@ import { UniverseManager, } from '../src/DevtoolsUtils.js'; import {ISSUE_UTILS} from '../src/issue-descriptions.js'; +<<<<<<< HEAD import {AggregatedIssue, DebuggerModel} from '../src/third_party/index.js'; +======= +import {DevTools} from '../src/third_party/index.js'; +>>>>>>> 8e5e779 (build: bundle devtools frontend (#656)) import type {Browser, Target} from '../src/third_party/index.js'; import { @@ -114,7 +118,9 @@ describe('mapIssueToMessageObject', () => { }); it('maps aggregated issue with substituted description', () => { - const mockAggregatedIssue = sinon.createStubInstance(AggregatedIssue); + const mockAggregatedIssue = sinon.createStubInstance( + DevTools.AggregatedIssue, + ); mockAggregatedIssue.getDescription.returns(mockDescription); mockAggregatedIssue.getAggregatedIssuesCount.returns(1); @@ -142,7 +148,9 @@ describe('mapIssueToMessageObject', () => { }); it('returns null for the issue with no description', () => { - const mockAggregatedIssue = sinon.createStubInstance(AggregatedIssue); + const mockAggregatedIssue = sinon.createStubInstance( + DevTools.AggregatedIssue, + ); mockAggregatedIssue.getDescription.returns(null); const result = mapIssueToMessageObject(mockAggregatedIssue); @@ -150,7 +158,9 @@ describe('mapIssueToMessageObject', () => { }); it('returns null if there is no desciption file', () => { - const mockAggregatedIssue = sinon.createStubInstance(AggregatedIssue); + const mockAggregatedIssue = sinon.createStubInstance( + DevTools.AggregatedIssue, + ); mockAggregatedIssue.getDescription.returns(mockDescription); mockAggregatedIssue.getAggregatedIssuesCount.returns(1); @@ -165,7 +175,9 @@ describe('mapIssueToMessageObject', () => { }); it("returns null if can't parse the title", () => { - const mockAggregatedIssue = sinon.createStubInstance(AggregatedIssue); + const mockAggregatedIssue = sinon.createStubInstance( + DevTools.AggregatedIssue, + ); mockAggregatedIssue.getDescription.returns(mockDescription); mockAggregatedIssue.getAggregatedIssuesCount.returns(1); @@ -181,7 +193,9 @@ describe('mapIssueToMessageObject', () => { }); it('returns null if devtools utill function throws an error', () => { - const mockAggregatedIssue = sinon.createStubInstance(AggregatedIssue); + const mockAggregatedIssue = sinon.createStubInstance( + DevTools.AggregatedIssue, + ); mockAggregatedIssue.getDescription.returns(mockDescription); mockAggregatedIssue.getAggregatedIssuesCount.returns(1); @@ -247,7 +261,7 @@ describe('UniverseManager', () => { await manager.init([page]); const targetUniverse = manager.get(page); assert.ok(targetUniverse); - const model = targetUniverse.target.model(DebuggerModel); + const model = targetUniverse.target.model(DevTools.DebuggerModel); assert.ok(model); const pausedSpy = sinon.stub(); diff --git a/tests/PageCollector.test.ts b/tests/PageCollector.test.ts index 4ec447993..76a4e4095 100644 --- a/tests/PageCollector.test.ts +++ b/tests/PageCollector.test.ts @@ -16,7 +16,11 @@ import { NetworkCollector, PageCollector, } from '../src/PageCollector.js'; +<<<<<<< HEAD import {AggregatedIssue} from '../src/third_party/index.js'; +======= +import {DevTools} from '../src/third_party/index.js'; +>>>>>>> 8e5e779 (build: bundle devtools frontend (#656)) import {getMockRequest, getMockBrowser} from './utils.js'; @@ -314,7 +318,7 @@ describe('ConsoleCollector', () => { const collector = new ConsoleCollector(browser, collect => { return { issue: issue => { - collect(issue as AggregatedIssue); + collect(issue as DevTools.AggregatedIssue); }, } as ListenerMap; }); @@ -323,7 +327,7 @@ describe('ConsoleCollector', () => { sinon.assert.calledOnce(onIssuesListener); const issueArgument = onIssuesListener.getCall(0).args[0]; - assert(issueArgument instanceof AggregatedIssue); + assert(issueArgument instanceof DevTools.AggregatedIssue); }); it('collects issues', async () => { @@ -335,7 +339,7 @@ describe('ConsoleCollector', () => { const collector = new ConsoleCollector(browser, collect => { return { issue: issue => { - collect(issue as AggregatedIssue); + collect(issue as DevTools.AggregatedIssue); }, } as ListenerMap; }); @@ -367,7 +371,7 @@ describe('ConsoleCollector', () => { const collector = new ConsoleCollector(browser, collect => { return { issue: issue => { - collect(issue as AggregatedIssue); + collect(issue as DevTools.AggregatedIssue); }, } as ListenerMap; }); @@ -378,7 +382,7 @@ describe('ConsoleCollector', () => { const data = collector.getData(page); assert.equal(data.length, 1); const collectedIssue = data[0]; - assert(collectedIssue instanceof AggregatedIssue); + assert(collectedIssue instanceof DevTools.AggregatedIssue); assert.equal(collectedIssue.code(), 'MixedContentIssue'); assert.equal(collectedIssue.getAggregatedIssuesCount(), 1); }); diff --git a/tests/tools/console.test.ts b/tests/tools/console.test.ts index 8f32ec362..0b0d86062 100644 --- a/tests/tools/console.test.ts +++ b/tests/tools/console.test.ts @@ -9,7 +9,11 @@ import {before, describe, it} from 'node:test'; import {loadIssueDescriptions} from '../../src/issue-descriptions.js'; import {McpResponse} from '../../src/McpResponse.js'; +<<<<<<< HEAD import {AggregatedIssue} from '../../src/third_party/index.js'; +======= +import {DevTools} from '../../src/third_party/index.js'; +>>>>>>> 8e5e779 (build: bundle devtools frontend (#656)) import { getConsoleMessage, listConsoleMessages, @@ -199,7 +203,7 @@ describe('console', () => { const messages = context.getConsoleData(); let issueMsg; for (const message of messages) { - if (message instanceof AggregatedIssue) { + if (message instanceof DevTools.AggregatedIssue) { issueMsg = message; break; } diff --git a/tests/utils.ts b/tests/utils.ts index 84d2b8b65..c632a8338 100644 --- a/tests/utils.ts +++ b/tests/utils.ts @@ -20,7 +20,11 @@ import sinon from 'sinon'; import {McpContext} from '../src/McpContext.js'; import {McpResponse} from '../src/McpResponse.js'; import {stableIdSymbol} from '../src/PageCollector.js'; +<<<<<<< HEAD import {AggregatedIssue} from '../src/third_party/index.js'; +======= +import {DevTools} from '../src/third_party/index.js'; +>>>>>>> 8e5e779 (build: bundle devtools frontend (#656)) export function getTextContent( content: CallToolResult['content'][number], @@ -214,8 +218,10 @@ export function stabilizeResponseOutput(text: unknown) { return output; } -export function getMockAggregatedIssue(): sinon.SinonStubbedInstance { - const mockAggregatedIssue = sinon.createStubInstance(AggregatedIssue); +export function getMockAggregatedIssue(): sinon.SinonStubbedInstance { + const mockAggregatedIssue = sinon.createStubInstance( + DevTools.AggregatedIssue, + ); mockAggregatedIssue.getAllIssues.returns([]); return mockAggregatedIssue; } From c021b2f4d86d9c3857a8eff91eebdde0ea614c9b Mon Sep 17 00:00:00 2001 From: Alex Rudenko Date: Thu, 11 Dec 2025 12:59:13 +0100 Subject: [PATCH 2/2] fix --- package.json | 4 ---- src/DevToolsConnectionAdapter.ts | 4 ---- src/DevtoolsUtils.ts | 17 ----------------- src/McpContext.ts | 1 - src/McpResponse.ts | 4 ---- src/PageCollector.ts | 10 +--------- src/formatters/consoleFormatter.ts | 4 ---- src/third_party/index.ts | 26 -------------------------- src/trace-processing/parse.ts | 11 +---------- tests/DevtoolsUtils.test.ts | 4 ---- tests/PageCollector.test.ts | 4 ---- tests/tools/console.test.ts | 4 ---- tests/utils.ts | 4 ---- 13 files changed, 2 insertions(+), 95 deletions(-) diff --git a/package.json b/package.json index bbdff2607..ec328a80e 100644 --- a/package.json +++ b/package.json @@ -19,11 +19,7 @@ "test:node20": "node --import ./build/tests/setup.js --test-reporter spec --test-force-exit --test build/tests", "test:no-build": "node --import ./build/tests/setup.js --no-warnings=ExperimentalWarning --experimental-print-required-tla --test-reporter spec --test-force-exit --test \"build/tests/**/*.test.js\"", "test": "npm run build && npm run test:no-build", -<<<<<<< HEAD - "test:only": "npm run build && node --import ./build/tests/setup.js --no-warnings=ExperimentalWarning --test-reporter spec --test-force-exit --test --test-only \"build/tests/**/*.test.js\"", -======= "test:only": "npm run build && npm run test:only:no-build", ->>>>>>> 8e5e779 (build: bundle devtools frontend (#656)) "test:only:no-build": "node --import ./build/tests/setup.js --no-warnings=ExperimentalWarning --test-reporter spec --test-force-exit --test --test-only \"build/tests/**/*.test.js\"", "test:update-snapshots": "npm run build && node --import ./build/tests/setup.js --no-warnings=ExperimentalWarning --test-force-exit --test --test-update-snapshots \"build/tests/**/*.test.js\"", "prepare": "node --experimental-strip-types scripts/prepare.ts", diff --git a/src/DevToolsConnectionAdapter.ts b/src/DevToolsConnectionAdapter.ts index 77a47389b..e1f5d0bfb 100644 --- a/src/DevToolsConnectionAdapter.ts +++ b/src/DevToolsConnectionAdapter.ts @@ -4,10 +4,6 @@ * SPDX-License-Identifier: Apache-2.0 */ -<<<<<<< HEAD -import type {CDPConnection as devtools} from './third_party/index.js'; -======= ->>>>>>> 8e5e779 (build: bundle devtools frontend (#656)) import type * as puppeteer from './third_party/index.js'; import type {DevTools} from './third_party/index.js'; import {CDPSessionEvent} from './third_party/index.js'; diff --git a/src/DevtoolsUtils.ts b/src/DevtoolsUtils.ts index 0589e6f99..21db7e314 100644 --- a/src/DevtoolsUtils.ts +++ b/src/DevtoolsUtils.ts @@ -8,24 +8,7 @@ import {PuppeteerDevToolsConnection} from './DevToolsConnectionAdapter.js'; import {ISSUE_UTILS} from './issue-descriptions.js'; import {logger} from './logger.js'; import {Mutex} from './Mutex.js'; -<<<<<<< HEAD -import { - type Issue, - type AggregatedIssue, - type IssuesManagerEventTypes, - type SDKTarget as Target, - DebuggerModel, - Foundation, - TargetManager, - MarkdownIssueDescription, - Marked, - ProtocolClient, - Common, - I18n, -} from './third_party/index.js'; -======= import {DevTools} from './third_party/index.js'; ->>>>>>> 8e5e779 (build: bundle devtools frontend (#656)) import type { Browser, Page, diff --git a/src/McpContext.ts b/src/McpContext.ts index 5fe2587bc..b76c8d1e3 100644 --- a/src/McpContext.ts +++ b/src/McpContext.ts @@ -11,7 +11,6 @@ import path from 'node:path'; import {extractUrlLikeFromDevToolsTitle, urlsEqual} from './DevtoolsUtils.js'; import type {ListenerMap} from './PageCollector.js'; import {NetworkCollector, ConsoleCollector} from './PageCollector.js'; -import {type AggregatedIssue} from './third_party/index.js'; import {Locator} from './third_party/index.js'; import type {DevTools} from './third_party/index.js'; import type { diff --git a/src/McpResponse.ts b/src/McpResponse.ts index a1da08fda..f18a12f45 100644 --- a/src/McpResponse.ts +++ b/src/McpResponse.ts @@ -19,11 +19,7 @@ import { } from './formatters/networkFormatter.js'; import {formatSnapshotNode} from './formatters/snapshotFormatter.js'; import type {McpContext} from './McpContext.js'; -<<<<<<< HEAD -import {AggregatedIssue} from './third_party/index.js'; -======= import {DevTools} from './third_party/index.js'; ->>>>>>> 8e5e779 (build: bundle devtools frontend (#656)) import type { ConsoleMessage, ImageContent, diff --git a/src/PageCollector.ts b/src/PageCollector.ts index d81b0290d..4607f8af6 100644 --- a/src/PageCollector.ts +++ b/src/PageCollector.ts @@ -7,18 +7,10 @@ import {FakeIssuesManager} from './DevtoolsUtils.js'; import {logger} from './logger.js'; import type { + Target, CDPSession, ConsoleMessage, Protocol, - Target, - Common, -} from './third_party/index.js'; -import { - type AggregatedIssue, - IssueAggregatorEvents, - IssuesManagerEvents, - createIssuesFromProtocolIssue, - IssueAggregator, } from './third_party/index.js'; import {DevTools} from './third_party/index.js'; import { diff --git a/src/formatters/consoleFormatter.ts b/src/formatters/consoleFormatter.ts index a809c4e06..6111e3370 100644 --- a/src/formatters/consoleFormatter.ts +++ b/src/formatters/consoleFormatter.ts @@ -5,11 +5,7 @@ */ import type {McpContext} from '../McpContext.js'; -<<<<<<< HEAD -import {type AggregatedIssue} from '../third_party/index.js'; -======= import type {DevTools} from '../third_party/index.js'; ->>>>>>> 8e5e779 (build: bundle devtools frontend (#656)) export interface ConsoleMessageData { consoleMessageStableId: number; diff --git a/src/third_party/index.ts b/src/third_party/index.ts index 9324f524c..711856054 100644 --- a/src/third_party/index.ts +++ b/src/third_party/index.ts @@ -36,30 +36,4 @@ export { type ChromeReleaseChannel as BrowsersChromeReleaseChannel, } from '@puppeteer/browsers'; -<<<<<<< HEAD -export { - AgentFocus, - TraceEngine, - PerformanceTraceFormatter, - PerformanceInsightFormatter, - AggregatedIssue, - type Issue, - type IssuesManagerEventTypes, - type Target as SDKTarget, - type CDPConnection, - DebuggerModel, - Foundation, - TargetManager, - MarkdownIssueDescription, - Marked, - ProtocolClient, - Common, - I18n, - IssueAggregatorEvents, - IssuesManagerEvents, - createIssuesFromProtocolIssue, - IssueAggregator, -} from '../../node_modules/chrome-devtools-frontend/mcp/mcp.js'; -======= export * as DevTools from './devtools.js'; ->>>>>>> 8e5e779 (build: bundle devtools frontend (#656)) diff --git a/src/trace-processing/parse.ts b/src/trace-processing/parse.ts index b1373807d..7b152d853 100644 --- a/src/trace-processing/parse.ts +++ b/src/trace-processing/parse.ts @@ -5,16 +5,7 @@ */ import {logger} from '../logger.js'; -<<<<<<< HEAD -import { - AgentFocus, - TraceEngine, - PerformanceTraceFormatter, - PerformanceInsightFormatter, -} from '../third_party/index.js'; -======= import {DevTools} from '../third_party/index.js'; ->>>>>>> 8e5e779 (build: bundle devtools frontend (#656)) const engine = DevTools.TraceEngine.TraceModel.Model.createWithAllHandlers(); @@ -82,7 +73,7 @@ export async function parseRawTraceBuffer( const extraFormatDescriptions = `Information on performance traces may contain main thread activity represented as call frames and network requests. ${DevTools.PerformanceTraceFormatter.callFrameDataFormatDescription} - + ${DevTools.PerformanceTraceFormatter.networkDataFormatDescription}`; export function getTraceSummary(result: TraceResult): string { diff --git a/tests/DevtoolsUtils.test.ts b/tests/DevtoolsUtils.test.ts index bf1c9b291..24ac7ffb0 100644 --- a/tests/DevtoolsUtils.test.ts +++ b/tests/DevtoolsUtils.test.ts @@ -16,11 +16,7 @@ import { UniverseManager, } from '../src/DevtoolsUtils.js'; import {ISSUE_UTILS} from '../src/issue-descriptions.js'; -<<<<<<< HEAD -import {AggregatedIssue, DebuggerModel} from '../src/third_party/index.js'; -======= import {DevTools} from '../src/third_party/index.js'; ->>>>>>> 8e5e779 (build: bundle devtools frontend (#656)) import type {Browser, Target} from '../src/third_party/index.js'; import { diff --git a/tests/PageCollector.test.ts b/tests/PageCollector.test.ts index 76a4e4095..41e769c47 100644 --- a/tests/PageCollector.test.ts +++ b/tests/PageCollector.test.ts @@ -16,11 +16,7 @@ import { NetworkCollector, PageCollector, } from '../src/PageCollector.js'; -<<<<<<< HEAD -import {AggregatedIssue} from '../src/third_party/index.js'; -======= import {DevTools} from '../src/third_party/index.js'; ->>>>>>> 8e5e779 (build: bundle devtools frontend (#656)) import {getMockRequest, getMockBrowser} from './utils.js'; diff --git a/tests/tools/console.test.ts b/tests/tools/console.test.ts index 0b0d86062..1c2ca9344 100644 --- a/tests/tools/console.test.ts +++ b/tests/tools/console.test.ts @@ -9,11 +9,7 @@ import {before, describe, it} from 'node:test'; import {loadIssueDescriptions} from '../../src/issue-descriptions.js'; import {McpResponse} from '../../src/McpResponse.js'; -<<<<<<< HEAD -import {AggregatedIssue} from '../../src/third_party/index.js'; -======= import {DevTools} from '../../src/third_party/index.js'; ->>>>>>> 8e5e779 (build: bundle devtools frontend (#656)) import { getConsoleMessage, listConsoleMessages, diff --git a/tests/utils.ts b/tests/utils.ts index c632a8338..fb64156b4 100644 --- a/tests/utils.ts +++ b/tests/utils.ts @@ -20,11 +20,7 @@ import sinon from 'sinon'; import {McpContext} from '../src/McpContext.js'; import {McpResponse} from '../src/McpResponse.js'; import {stableIdSymbol} from '../src/PageCollector.js'; -<<<<<<< HEAD -import {AggregatedIssue} from '../src/third_party/index.js'; -======= import {DevTools} from '../src/third_party/index.js'; ->>>>>>> 8e5e779 (build: bundle devtools frontend (#656)) export function getTextContent( content: CallToolResult['content'][number],