diff --git a/packages/connection/src/common/proxy.ts b/packages/connection/src/common/proxy.ts
index 136083fa08..52c15bcd63 100644
--- a/packages/connection/src/common/proxy.ts
+++ b/packages/connection/src/common/proxy.ts
@@ -1,6 +1,8 @@
 import { ApplicationError } from '@opensumi/ide-core-common';
 import type { MessageConnection } from '@opensumi/vscode-jsonrpc/lib/common/connection';
 
+import { getCapturer, generateUniqueId } from './utils';
+
 export abstract class RPCService<T = any> {
   rpcClient?: T[];
   rpcRegistered?: boolean;
@@ -98,17 +100,46 @@ export class RPCProxy {
             if (prop.startsWith('on')) {
               if (isSingleArray) {
                 connection.sendNotification(prop, [...args]);
+                getCapturer() &&
+                  getCapturer()({
+                    type: 'sendNotification',
+                    serviceMethod: prop,
+                    arguments: args,
+                  });
               } else {
                 connection.sendNotification(prop, ...args);
+                getCapturer() &&
+                  getCapturer()({
+                    type: 'sendNotification',
+                    serviceMethod: prop,
+                    arguments: args,
+                  });
               }
 
               resolve(null);
             } else {
               let requestResult: Promise<any>;
+              // generate a unique requestId to associate request and requestResult
+              const requestId = generateUniqueId();
+
               if (isSingleArray) {
                 requestResult = connection.sendRequest(prop, [...args]) as Promise<any>;
+                getCapturer() &&
+                  getCapturer()({
+                    type: 'sendRequest',
+                    requestId,
+                    serviceMethod: prop,
+                    arguments: args,
+                  });
               } else {
                 requestResult = connection.sendRequest(prop, ...args) as Promise<any>;
+                getCapturer() &&
+                  getCapturer()({
+                    type: 'sendRequest',
+                    requestId,
+                    serviceMethod: prop,
+                    arguments: args,
+                  });
               }
 
               requestResult
@@ -126,8 +157,22 @@ export class RPCProxy {
                       const applicationError = ApplicationError.fromJson(result.error.code, result.error.data);
                       error.cause = applicationError;
                     }
+                    getCapturer() &&
+                      getCapturer()({
+                        type: 'requestResult',
+                        status: 'fail',
+                        requestId,
+                        error: result.data,
+                      });
                     reject(error);
                   } else {
+                    getCapturer() &&
+                      getCapturer()({
+                        type: 'requestResult',
+                        status: 'success',
+                        requestId,
+                        data: result.data,
+                      });
                     resolve(result.data);
                   }
                 });
@@ -162,9 +207,51 @@ export class RPCProxy {
       const methods = this.getServiceMethod(service);
       methods.forEach((method) => {
         if (method.startsWith('on')) {
-          connection.onNotification(method, (...args) => this.onNotification(method, ...args));
+          connection.onNotification(method, (...args) => {
+            getCapturer() &&
+              getCapturer()({
+                type: 'onNotification',
+                serviceMethod: method,
+                arguments: args,
+              });
+            this.onNotification(method, ...args);
+          });
         } else {
-          connection.onRequest(method, (...args) => this.onRequest(method, ...args));
+          connection.onRequest(method, (...args) => {
+            // *** capturer ***
+            const requestId = generateUniqueId();
+            getCapturer() &&
+              getCapturer()({
+                type: 'onRequest',
+                requestId,
+                serviceMethod: method,
+                arguments: args,
+              });
+            // ****************
+            const result = this.onRequest(method, ...args);
+            // *** capturer ***
+            result
+              .then((result) => {
+                getCapturer() &&
+                  getCapturer()({
+                    type: 'onRequestResult',
+                    status: 'success',
+                    requestId,
+                    data: result.data,
+                  });
+              })
+              .catch((err) => {
+                getCapturer() &&
+                  getCapturer()({
+                    type: 'onRequestResult',
+                    status: 'fail',
+                    requestId,
+                    error: err.data,
+                  });
+              });
+            // ****************
+            return result;
+          });
         }
 
         if (cb) {
@@ -174,9 +261,28 @@ export class RPCProxy {
 
       connection.onRequest((method) => {
         if (!this.proxyService[method]) {
-          return {
+          // *** capturer ***
+          const requestId = generateUniqueId();
+          getCapturer() &&
+            getCapturer()({
+              type: 'onRequest',
+              requestId,
+              serviceMethod: method,
+            });
+          // ****************
+          const result = {
             data: NOTREGISTERMETHOD,
           };
+          // *** capturer ***
+          getCapturer() &&
+            getCapturer()({
+              type: 'onRequestResult',
+              status: 'fail',
+              requestId,
+              error: result.data,
+            });
+          // ****************
+          return result;
         }
       });
     }
diff --git a/packages/connection/src/common/utils.ts b/packages/connection/src/common/utils.ts
index 91d1405015..ae3be474c7 100644
--- a/packages/connection/src/common/utils.ts
+++ b/packages/connection/src/common/utils.ts
@@ -5,3 +5,20 @@ export function stringify(obj: any): string {
 export function parse(input: string, reviver?: (this: any, key: string, value: any) => any): any {
   return JSON.parse(input, reviver);
 }
+
+declare global {
+  interface Window {
+    __opensumi_devtools: any;
+  }
+}
+
+export function getCapturer() {
+  if (typeof window !== 'undefined' && window.__opensumi_devtools && window.__opensumi_devtools.capture) {
+    return window.__opensumi_devtools.capture;
+  }
+  return;
+}
+
+export function generateUniqueId() {
+  return Date.now().toString(36) + Math.random().toString(36).substr(2);
+}
diff --git a/packages/connection/src/node/connect.ts b/packages/connection/src/node/connect.ts
index 1cc31dafe3..683eec5064 100644
--- a/packages/connection/src/node/connect.ts
+++ b/packages/connection/src/node/connect.ts
@@ -6,7 +6,6 @@ import {
   createMessageConnection,
 } from '@opensumi/vscode-jsonrpc/lib/node/main';
 
-
 export function createSocketConnection(socket: net.Socket) {
   return createMessageConnection(new SocketMessageReader(socket), new SocketMessageWriter(socket));
 }
diff --git a/tools/electron/src/main/index.ts b/tools/electron/src/main/index.ts
index 537f95710f..98424ce846 100644
--- a/tools/electron/src/main/index.ts
+++ b/tools/electron/src/main/index.ts
@@ -1,6 +1,6 @@
 import { join } from 'path';
 
-import { app } from 'electron';
+import { app, session } from 'electron';
 
 import { URI } from '@opensumi/ide-core-common';
 import { ElectronMainApp } from '@opensumi/ide-core-electron-main';
@@ -31,4 +31,10 @@ const electronApp = new ElectronMainApp({
 
 electronApp.init().then(() => {
   electronApp.loadWorkspace();
+
+  const devtronPath = join(require('os').homedir(), 'Projects/ASOC2022/devtron');
+  session.defaultSession.loadExtension(devtronPath);
+
+  const opensumicrxPath = join(require('os').homedir(), 'Projects/ASOC2022/opensumi/opensumi-devtools/build');
+  session.defaultSession.loadExtension(opensumicrxPath);
 });