feat: read elements from DevTools UI

Author: OrKoN

src/McpContext.ts

@@ -378,35 +378,56 @@ export class McpContext implements Context {
     return this.#pageToDevToolsPage.get(page);
   }
 
-  async getDevToolsData(): Promise<undefined | {requestId?: number}> {
+  async getDevToolsData(): Promise<
+    undefined | {requestId?: number; uid?: string}
+  > {
     try {
       const selectedPage = this.getSelectedPage();
       const devtoolsPage = this.getDevToolsPage(selectedPage);
       if (devtoolsPage) {
-        const cdpRequestId = await devtoolsPage.evaluate(async () => {
-          // @ts-expect-error no types
-          const UI = await import('/bundled/ui/legacy/legacy.js');
-          // @ts-expect-error no types
-          const SDK = await import('/bundled/core/sdk/sdk.js');
-          const request = UI.Context.Context.instance().flavor(
-            SDK.NetworkRequest.NetworkRequest,
-          );
-          return request?.requestId();
-        });
-        if (!cdpRequestId) {
-          this.logger('no context request');
-          return;
-        }
-        const request = this.#networkCollector.find(selectedPage, request => {
-          // @ts-expect-error id is internal.
-          return request.id === cdpRequestId;
-        });
-        if (!request) {
-          this.logger('no collected request for ' + cdpRequestId);
+        const {cdpRequestId, cdpBackendNodeId} = await devtoolsPage.evaluate(
+          async () => {
+            // @ts-expect-error no types
+            const UI = await import('/bundled/ui/legacy/legacy.js');
+            // @ts-expect-error no types
+            const SDK = await import('/bundled/core/sdk/sdk.js');
+            const request = UI.Context.Context.instance().flavor(
+              SDK.NetworkRequest.NetworkRequest,
+            );
+            const node = UI.Context.Context.instance().flavor(
+              SDK.DOMModel.DOMNode,
+            );
+            return {
+              cdpRequestId: request?.requestId(),
+              cdpBackendNodeId: node?.backendNodeId(),
+            };
+          },
+        );
+        const resolveNetworkRequestId = () => {
+          if (!cdpRequestId) {
+            this.logger('no context request');
+            return;
+          }
+          const request = this.#networkCollector.find(selectedPage, request => {
+            // @ts-expect-error id is internal.
+            return request.id === cdpRequestId;
+          });
+          if (!request) {
+            this.logger('no collected request for ' + cdpRequestId);
+            return;
+          }
+          return this.#networkCollector.getIdForResource(request);
+        };
+        const resolveNodeUid = (): string | undefined => {
+          if (!cdpBackendNodeId) {
+            this.logger('no cdpBackendNodeId');
+            return;
+          }
           return;
-        }
+        };
         return {
-          requestId: this.#networkCollector.getIdForResource(request),
+          requestId: resolveNetworkRequestId(),
+          uid: resolveNodeUid(),
         };
       } else {
         this.logger('no devtools page deteched');