build: bundle devtools frontend

Author: OrKoN

package.json

@@ -17,7 +17,7 @@
     "start": "npm run build && node build/src/index.js",
     "start-debug": "DEBUG=mcp:* DEBUG_COLORS=false npm run build && node build/src/index.js",
     "test:node20": "node --require ./build/tests/setup.js --test-reporter spec --test-force-exit --test build/tests",
-    "test": "npm run build && node --require ./build/tests/setup.js --no-warnings=ExperimentalWarning --test-reporter spec --test-force-exit --test \"build/tests/**/*.test.js\"",
+    "test": "npm run build && node --require ./build/tests/setup.js --no-warnings=ExperimentalWarning --experimental-print-required-tla --test-reporter spec --test-force-exit --test \"build/tests/**/*.test.js\"",
     "test:only": "npm run build && node --require ./build/tests/setup.js --no-warnings=ExperimentalWarning --test-reporter spec --test-force-exit --test --test-only \"build/tests/**/*.test.js\"",
     "test:only:no-build": "node --require ./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 --require ./build/tests/setup.js --no-warnings=ExperimentalWarning --test-force-exit --test --test-update-snapshots \"build/tests/**/*.test.js\"",

rollup.config.mjs

@@ -20,6 +20,7 @@
  */
 
 import path from 'node:path';
+import fs from 'node:fs';
 
 import commonjs from '@rollup/plugin-commonjs';
 import json from '@rollup/plugin-json';
@@ -95,6 +96,35 @@ const bundleDependency = (
               }
               return arr.join('\n');
             });
+
+            // Manual license handling for chrome-devtools-frontend third_party
+            const tsConfig = JSON.parse(fs.readFileSync(path.join(process.cwd(), 'tsconfig.json'), 'utf-8'));
+             const thirdPartyDirectories = tsConfig.include.filter(location => {
+              return location.includes(
+                'node_modules/chrome-devtools-frontend/front_end/third_party',
+              );
+            });
+
+            const manualLicenses = [];
+            // Add chrome-devtools-frontend main license
+            const cdtfLicensePath = path.join(process.cwd(), 'node_modules/chrome-devtools-frontend/LICENSE');
+            if (fs.existsSync(cdtfLicensePath)) {
+              manualLicenses.push(['Name: chrome-devtools-frontend', 'License: Apache-2.0', '', fs.readFileSync(cdtfLicensePath, 'utf-8')].join('\n'));
+            }
+
+            for (const thirdPartyDir of thirdPartyDirectories) {
+              const fullPath = path.join(process.cwd(), thirdPartyDir);
+              const licenseFile = path.join(fullPath, 'LICENSE');
+              if (fs.existsSync(licenseFile)) {
+                 const name = path.basename(thirdPartyDir);
+                 manualLicenses.push([`Name: ${name}`, `License: Custom`, '', fs.readFileSync(licenseFile, 'utf-8').replaceAll('\r', '')].join('\n'));
+              }
+            }
+            
+            if (manualLicenses.length > 0) {
+              stringified_dependencies.push(...manualLicenses);
+            }
+
             const divider =
               '\n\n-------------------- DEPENDENCY DIVIDER --------------------\n\n';
             return stringified_dependencies.join(divider);

scripts/post-build.ts

@@ -7,8 +7,6 @@
 import * as fs from 'node:fs';
 import * as path from 'node:path';
 
-import tsConfig from '../tsconfig.json' with {type: 'json'};
-
 import {sed} from './sed.ts';
 
 const BUILD_DIR = path.join(process.cwd(), 'build');
@@ -22,28 +20,6 @@ function writeFile(filePath: string, content: string): void {
   fs.writeFileSync(filePath, content, 'utf-8');
 }
 
-/**
- * Ensures that licenses for third party files we use gets copied into the build/ dir.
- */
-function copyThirdPartyLicenseFiles() {
-  const thirdPartyDirectories = tsConfig.include.filter(location => {
-    return location.includes(
-      'node_modules/chrome-devtools-frontend/front_end/third_party',
-    );
-  });
-
-  for (const thirdPartyDir of thirdPartyDirectories) {
-    const fullPath = path.join(process.cwd(), thirdPartyDir);
-    const licenseFile = path.join(fullPath, 'LICENSE');
-    if (!fs.existsSync(licenseFile)) {
-      console.error('No LICENSE for', path.basename(thirdPartyDir));
-    }
-
-    const destinationDir = path.join(BUILD_DIR, thirdPartyDir);
-    const destinationFile = path.join(destinationDir, 'LICENSE');
-    fs.copyFileSync(licenseFile, destinationFile);
-  }
-}
 
 function main(): void {
   const devtoolsThirdPartyPath =
@@ -113,22 +89,6 @@ export const experiments = {
   sed(clientFile, globalAssignment, '');
   sed(clientFile, registerCommands, '');
 
-  const devtoolsLicensePath = path.join(
-    'node_modules',
-    'chrome-devtools-frontend',
-    'LICENSE',
-  );
-  const devtoolsLicenseFileSource = path.join(
-    process.cwd(),
-    devtoolsLicensePath,
-  );
-  const devtoolsLicenseFileDestination = path.join(
-    BUILD_DIR,
-    devtoolsLicensePath,
-  );
-  fs.copyFileSync(devtoolsLicenseFileSource, devtoolsLicenseFileDestination);
-
-  copyThirdPartyLicenseFiles();
   copyDevToolsDescriptionFiles();
 }
 

src/DevToolsConnectionAdapter.ts

@@ -4,8 +4,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import type {CDPConnection as devtools} from '../node_modules/chrome-devtools-frontend/mcp/mcp.js';
-
+import type {CDPConnection as devtools} from './third_party/index.js';
 import type * as puppeteer from './third_party/index.js';
 import {CDPSessionEvent} from './third_party/index.js';
 

src/DevtoolsUtils.ts

@@ -4,11 +4,15 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
+import {PuppeteerDevToolsConnection} from './DevToolsConnectionAdapter.js';
+import {ISSUE_UTILS} from './issue-descriptions.js';
+import {logger} from './logger.js';
+import {Mutex} from './Mutex.js';
 import {
   type Issue,
   type AggregatedIssue,
   type IssuesManagerEventTypes,
-  type Target,
+  type SDKTarget as Target,
   DebuggerModel,
   Foundation,
   TargetManager,
@@ -17,12 +21,7 @@ import {
   ProtocolClient,
   Common,
   I18n,
-} from '../node_modules/chrome-devtools-frontend/mcp/mcp.js';
-
-import {PuppeteerDevToolsConnection} from './DevToolsConnectionAdapter.js';
-import {ISSUE_UTILS} from './issue-descriptions.js';
-import {logger} from './logger.js';
-import {Mutex} from './Mutex.js';
+} from './third_party/index.js';
 import type {
   Browser,
   Page,

src/McpContext.ts

@@ -8,11 +8,10 @@ import fs from 'node:fs/promises';
 import os from 'node:os';
 import path from 'node:path';
 
-import {type AggregatedIssue} from '../node_modules/chrome-devtools-frontend/mcp/mcp.js';
-
 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 {
   Browser,

src/McpResponse.ts

@@ -4,8 +4,6 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import {AggregatedIssue} from '../node_modules/chrome-devtools-frontend/mcp/mcp.js';
-
 import {mapIssueToMessageObject} from './DevtoolsUtils.js';
 import type {ConsoleMessageData} from './formatters/consoleFormatter.js';
 import {
@@ -21,6 +19,7 @@ import {
 } from './formatters/networkFormatter.js';
 import {formatSnapshotNode} from './formatters/snapshotFormatter.js';
 import type {McpContext} from './McpContext.js';
+import {AggregatedIssue} from './third_party/index.js';
 import type {
   ConsoleMessage,
   ImageContent,

src/PageCollector.ts

@@ -4,24 +4,21 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import type {
-  AggregatedIssue,
-  Common,
-} from '../node_modules/chrome-devtools-frontend/mcp/mcp.js';
-import {
-  IssueAggregatorEvents,
-  IssuesManagerEvents,
-  createIssuesFromProtocolIssue,
-  IssueAggregator,
-} from '../node_modules/chrome-devtools-frontend/mcp/mcp.js';
-
 import {FakeIssuesManager} from './DevtoolsUtils.js';
 import {logger} from './logger.js';
 import type {
   CDPSession,
   ConsoleMessage,
   Protocol,
   Target,
+  Common,
+} from './third_party/index.js';
+import {
+  type AggregatedIssue,
+  IssueAggregatorEvents,
+  IssuesManagerEvents,
+  createIssuesFromProtocolIssue,
+  IssueAggregator,
 } from './third_party/index.js';
 import {
   type Browser,

src/formatters/consoleFormatter.ts

@@ -4,8 +4,8 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import type {AggregatedIssue} from '../../node_modules/chrome-devtools-frontend/mcp/mcp.js';
 import type {McpContext} from '../McpContext.js';
+import {type AggregatedIssue} from '../third_party/index.js';
 
 export interface ConsoleMessageData {
   consoleMessageStableId: number;

src/third_party/index.ts

@@ -35,3 +35,31 @@ export {
   Browser as BrowserEnum,
   type ChromeReleaseChannel as BrowsersChromeReleaseChannel,
 } from '@puppeteer/browsers';
+
+export {
+  AgentFocus,
+  TraceEngine,
+  PerformanceTraceFormatter,
+  PerformanceInsightFormatter,
+  // Issue is a type in some contexts, but let's export it as is if it's a class or if we can use export type?
+  // Use export type for pure types if possible, or just export { ... }
+  // The users act as if they are values (classes) mostly, except explicit type imports.
+  // Re-exporting everything as value allows both (if they are values).
+  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';