feat: expose DevTools as a target (#10812)

packages/puppeteer-core/src/common/Browser.ts

@@ -45,6 +45,7 @@ import {
   PageTarget,
   CDPTarget,
   WorkerTarget,
+  DevToolsTarget,
 } from './Target.js';
 import {TargetManager, TargetManagerEmittedEvents} from './TargetManager.js';
 import {TaskQueue} from './TaskQueue.js';
@@ -340,6 +341,18 @@ export class CDPBrowser extends BrowserBase {
       this.#targetManager,
       createSession
     );
+    if (targetInfo.url?.startsWith('devtools://')) {
+      return new DevToolsTarget(
+        targetInfo,
+        session,
+        context,
+        this.#targetManager,
+        createSession,
+        this.#ignoreHTTPSErrors,
+        this.#defaultViewport ?? null,
+        this.#screenshotTaskQueue
+      );
+    }
     if (this.#isPageTargetCallback(targetForFilter)) {
       return new PageTarget(
         targetInfo,

packages/puppeteer-core/src/common/Target.ts

@@ -299,6 +299,11 @@ export class PageTarget extends CDPTarget {
   }
 }
 
+/**
+ * @internal
+ */
+export class DevToolsTarget extends PageTarget {}
+
 /**
  * @internal
  */

test/src/headful.spec.ts

@@ -340,6 +340,26 @@ const serviceWorkerExtensionPath = path.join(
       ]);
       await browser.close();
     });
+    it('should expose DevTools as a page', async () => {
+      const browser = await launchBrowser(
+        Object.assign({devtools: true}, headfulOptions)
+      );
+      const context = await browser.createIncognitoBrowserContext();
+      const [target] = await Promise.all([
+        browser.waitForTarget((target: {url: () => string | string[]}) => {
+          return target.url().includes('devtools://');
+        }),
+        context.newPage(),
+      ]);
+      const page = await target.page();
+      expect(
+        await page?.evaluate(() => {
+          // @ts-expect-error wrong context.
+          return Boolean(DevToolsAPI);
+        })
+      ).toBe(true);
+      await browser.close();
+    });
   });
 
   describe('Page.bringToFront', function () {