debug相关功能的学习代码

hello-chrome/background.js

@@ -12,6 +12,86 @@ chrome.runtime.onConnect.addListener((port) => {
 chrome.runtime.onMessage.addListener((message) => {
   console.log("runtime onMessage: ", message)
 })
+
+chrome.debugger.onEvent.addListener((source, method, params) => {
+  // console.log("debugger onEvent: ", source, method, params)
+})
+chrome.action.onClicked.addListener((tab) => {
+  debugger
+  // 使用devtools协议链接到页面
+  chrome.debugger.attach({ tabId: tab.id }, "1.0", () => {
+    chrome.debugger.sendCommand({ tabId: tab.id }, "Debugger.enable", {}, () => { });
+    return;
+    debugger;
+    // 启动调试器
+    chrome.debugger.sendCommand({ tabId: tab.id }, "Debugger.enable", {}, () => {
+      debugger;
+      // chrome.debugger.sendCommand({ tabId: tab.id }, "Debugger.getScriptSource", (scripts) => {
+      //   console.log(scripts);
+      //   debugger
+      // })
+      chrome.debugger.sendCommand(
+        { tabId: tab.id, },
+        "Runtime.evaluate",
+        { expression: "window.abc=()=>{console.log(1)}" },
+        (result) => {
+          debugger
+          if (result && result.result && result.result.objectId) {
+            console.log(result.result);
+
+            chrome.debugger.sendCommand(
+              {
+                tabId: tab.id,
+                method: "Debugger.searchInContentScripts",
+                params: {
+                  query: "abc",
+                }
+              }, (result) => {
+                debugger
+              })
+            return;
+            // 获取func
+            chrome.debugger.sendCommand(
+              {
+                tabId: tab.id,
+                method: "Debugger.searchInContentScripts",
+                params: {
+                  query: "window.abc",
+                }
+              },
+              "Debugger.searchInContentScripts",
+              { functionId: result.result.objectId },
+              (location) => {
+                debugger
+                console.log(location);
+                if (location) {
+                  // 调整到函数
+                  chrome.debugger.sendCommand(
+                    { tabId: tab.id, },
+                    "Debugger.setBreakpoint",
+                    {
+                      location: location.locations[0],
+                    },
+                    (brk) => {
+                      debugger
+                      console.log(brk);
+                    }
+                  )
+
+                }
+
+              }
+            )
+          }
+        }
+      );
+
+
+    });
+
+
+  });
+})
 // chrome.tabs.onConnect.addListener((port) => {
 //   console.log("tabs onConnect: ", port)
 //   port.onMessage.addListener((message) => {

hello-chrome/devtools.html

@@ -8,5 +8,6 @@
     devtools
     <button id="send2bg">send to background</button>
     <div id="text"></div>
+    <img src="https://fanyi-cdn.cdn.bcebos.com/static/cat/asset/logo.2481f256.png" /> 
   </body>
 </html>

hello-chrome/devtools.js

@@ -31,6 +31,10 @@ if (send2bg) {
 console.log('href: ', window.location.href);
 console.log(chrome.devtools);
 console.log(chrome.devtools.inspectedWindow.tabId);
+chrome.devtools.panels.setOpenResourceHandler((res) => {
+  debugger;
+  console.log(res);
+})
 chrome.devtools.panels.create("Hello World", "icon.png", "devtools.html", (panel) => {
   console.log("panel created");
   panel.onShown.addListener((win, b) => {
@@ -47,8 +51,16 @@ chrome.devtools.panels.create("Hello World", "icon.png", "devtools.html", (panel
       console.log(e);
     })
   });
+  // panel.createStatusBarButton({})
+  // panel.show();
+
   panel.onHidden.addListener((a, b) => {
     console.log("panel hidden", a, b);
+    // setTimeout(() => {
+    //   debugger;
+
+    //   panel.show();
+    // }, 3 * 1000);
   });
   panel.onSearch.addListener((query) => {
     console.log("panel search", query);

hello-chrome/manifest.json

@@ -1,58 +1,60 @@
 {
-    "manifest_version": 3,
-    "description": "hello world",
-    "icons": {
-        "48": "./icons/48.png"
-    },
-    "devtools_page": "devtools.html",
-    "content_scripts": [
-        {
-            "matches": [
-                "<all_urls>"
-            ],
-            "js": [
-                "content.js"
-            ],
-            "run_at": "document_end",
-            "all_frames": true
-        }
-    ],
-    "options_ui": {
-        "page": "options.html",
-        "browser_style": true
-    },
-    "name": "helloworld",
-    "version": "2.1.0",
-    "host_permissions": [
-        "wss://*/*",
-        "ws://*/*",
-        "activeTab",
-        "<all_urls>",
-        "*://*/*",
-        "tabs",
-        "http://*/*",
-        "https://*/*",
-        "audio",
-        "system.cpu",
-        "clipboardRead",
-        "clipboardWrite",
-        "system.memory",
-        "processes",
-        "tabs",
-        "storage",
-        "nativeMessaging",
-        "contextMenus",
-        "notifications"
-    ],
-    "action": {
-        "default_popup": "popup.html",
-        "default_icon": {
-            "48": "./icons/48.png"
-        },
-        "default_title": "hello-world"
-    },
-    "background": {
-        "service_worker": "background.js",
-        "type": "module"
+  "manifest_version": 3,
+  "description": "hello world",
+  "icons": {
+    "48": "./icons/48.png"
+  },
+  "devtools_page": "devtools.html",
+  "content_scripts": [
+    {
+      "matches": [
+        "<all_urls>"
+      ],
+      "js": [
+        "content.js"
+      ],
+      "run_at": "document_end",
+      "all_frames": true
     }
+  ],
+  "options_ui": {
+    "page": "options.html",
+    "browser_style": true
+  },
+  "name": "helloworld",
+  "version": "2.1.0",
+  "permissions": [
+    "tabs",
+    "debugger"
+  ],
+  "host_permissions": [
+    "wss://*/*",
+    "ws://*/*",
+    "<all_urls>",
+    "*://*/*",
+    "tabs",
+    "http://*/*",
+    "https://*/*",
+    "audio",
+    "system.cpu",
+    "clipboardRead",
+    "clipboardWrite",
+    "system.memory",
+    "processes",
+    "tabs",
+    "storage",
+    "nativeMessaging",
+    "contextMenus",
+    "notifications"
+  ],
+  "action": {
+    "default_icon": {
+      "48": "./icons/48.png"
+    },
+    "default_title": "hello-world"
+  },
+  "background": {
+    "service_worker": "background.js",
+    "type": "module"
+  }
 }