cdp-tunnel 2.9.1 → 2.9.2

package/extension-new/background.js

@@ -338,6 +338,15 @@ importScripts('features/automation-badge.js');
     });
   });
 
+  function getCdpAddress(wsUrl, mode) {
+    var match = (wsUrl || '').match(/:\/\/([^\/]+):(\d+)/);
+    if (!match) return '';
+    var host = match[1];
+    var port = parseInt(match[2], 10);
+    if (mode === 'takeover') port += 1;
+    return 'http://' + host + ':' + port;
+  }
+
   chrome.runtime.onInstalled.addListener(function(details) {
     Logger.info('[Runtime] Extension installed/updated:', details.reason);
     State.persist(null, false);
@@ -466,7 +475,8 @@ importScripts('features/automation-badge.js');
               status = 'error';
             }
           }
-          return { id: conn.id, tag: conn.tag, url: conn.url, mode: conn.mode || 'create', status: status, attachedCount: attachedCount };
+          var cdpAddress = getCdpAddress(conn.url, conn.mode || 'create');
+          return { id: conn.id, tag: conn.tag, url: conn.url, mode: conn.mode || 'create', status: status, attachedCount: attachedCount, cdpAddress: cdpAddress };
         });
         sendResponse({ connections: list });
       });

package/extension-new/config-page-preview.html

@@ -283,6 +283,37 @@
       font-family: 'Monaco', 'Menlo', monospace;
     }
 
+    .conn-config-cdp {
+      font-size: 11px;
+      color: #374151;
+      font-family: 'Monaco', 'Menlo', monospace;
+      margin-top: 2px;
+      display: flex;
+      align-items: center;
+      gap: 4px;
+    }
+
+    .conn-config-cdp .cdp-addr {
+      color: #2563eb;
+      font-weight: 600;
+      cursor: pointer;
+    }
+
+    .conn-config-cdp .btn-copy-cdp {
+      border: none;
+      background: transparent;
+      cursor: pointer;
+      font-size: 12px;
+      padding: 0 4px;
+      opacity: 0.5;
+      transition: opacity 0.2s;
+      line-height: 1;
+    }
+
+    .conn-config-cdp .btn-copy-cdp:hover {
+      opacity: 1;
+    }
+
     .conn-config-item .btn-delete {
       padding: 4px 10px;
       border: none;

package/extension-new/config-page.js

@@ -95,13 +95,15 @@
     connections.forEach(function(conn) {
       var statusClass = getStatusClass(conn.id, conn.enabled);
       var isActive = conn.enabled && statusClass === 'connected';
+      var cdpAddr = getCdpAddress(conn.url, conn.mode);
       html +=
         '<div class="conn-config-item' + (isActive ? ' active' : '') + '" data-id="' + conn.id + '">' +
           '<input type="checkbox" class="conn-toggle" data-id="' + conn.id + '"' + (conn.enabled ? ' checked' : '') + ' title="启用/禁用">' +
           '<span class="status-dot ' + statusClass + '" title="' + statusClass + '"></span>' +
           '<div class="conn-config-info">' +
             '<div class="conn-config-tag">' + (conn.mode === 'takeover' ? '🔗 ' : '🆕 ') + escapeHtml(conn.tag) + '</div>' +
-            '<div class="conn-config-url" title="' + escapeAttr(conn.url) + '">' + escapeHtml(conn.url) + '</div>' +
+            '<div class="conn-config-url" title="' + escapeAttr(conn.url) + '">WS:  ' + escapeHtml(conn.url) + '</div>' +
+            (cdpAddr ? '<div class="conn-config-cdp">CDP: <span class="cdp-addr" data-cdp="' + escapeAttr(cdpAddr) + '">' + escapeHtml(cdpAddr) + '</span> <button class="btn-copy-cdp" data-cdp="' + escapeAttr(cdpAddr) + '" title="复制 CDP 地址">📋</button></div>' : '') +
           '</div>' +
           '<button class="btn-delete" data-id="' + conn.id + '" title="删除">删除</button>' +
         '</div>';
@@ -297,6 +299,15 @@
     return (s || '').replace(/&/g, '&amp;').replace(/"/g, '&quot;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
   }
 
+  function getCdpAddress(wsUrl, mode) {
+    var match = (wsUrl || '').match(/:\/\/([^\/]+):(\d+)/);
+    if (!match) return '';
+    var host = match[1];
+    var port = parseInt(match[2], 10);
+    if (mode === 'takeover') port += 1;
+    return 'http://' + host + ':' + port;
+  }
+
   function init() {
     if (typeof chrome !== 'undefined' && chrome.storage) {
       chrome.storage.local.get(['autoMute'], function(result) {
@@ -365,6 +376,17 @@
   });
 
   elements.connConfigList.addEventListener('click', function(e) {
+    var copyBtn = e.target.closest('.btn-copy-cdp');
+    if (copyBtn) {
+      var addr = copyBtn.dataset.cdp;
+      if (addr) {
+        navigator.clipboard.writeText(addr).then(function() {
+          showToast('已复制: ' + addr);
+        });
+      }
+      return;
+    }
+
     var toggleEl = e.target.closest('.conn-toggle');
     if (toggleEl) {
       var connId = toggleEl.dataset.id;

package/extension-new/manifest.json

@@ -1,7 +1,7 @@
 {
   "manifest_version": 3,
   "name": "CDP Bridge",
-  "version": "2.9.1",
+  "version": "2.9.2",
   "description": "Chrome DevTools Protocol Bridge for Playwright/Puppeteer automation",
   "permissions": [
     "debugger",

package/extension-new/popup.html

@@ -23,6 +23,12 @@ body { width: 320px; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI',
 .conn-tag { font-weight: 600; font-size: 13px; color: #e0e0e0; }
 .conn-url { color: #888; font-size: 11px; font-family: 'SF Mono', Menlo, monospace; word-break: break-all; margin-top: 3px; line-height: 1.4; }
 
+.conn-cdp { color: #4a9eff; font-size: 11px; font-family: 'SF Mono', Menlo, monospace; margin-top: 2px; display: flex; align-items: center; gap: 2px; }
+.conn-cdp-label { color: #888; }
+.conn-cdp-value { font-weight: 600; }
+.conn-cdp-copy { background: none; border: none; cursor: pointer; font-size: 11px; padding: 0 2px; opacity: 0.5; transition: opacity 0.15s; }
+.conn-cdp-copy:hover { opacity: 1; }
+
 .empty-hint { text-align: center; padding: 16px 10px; color: #777; font-size: 12px; }
 
 .stats-row { display: flex; gap: 16px; padding: 8px 0; font-size: 12px; color: #aaa; }

package/extension-new/popup.js

@@ -14,6 +14,15 @@
     });
   }
 
+  function getCdpAddress(wsUrl, mode) {
+    var match = (wsUrl || '').match(/:\/\/([^\/]+):(\d+)/);
+    if (!match) return '';
+    var host = match[1];
+    var port = parseInt(match[2], 10);
+    if (mode === 'takeover') port += 1;
+    return 'http://' + host + ':' + port;
+  }
+
   function renderConnectionList(connections) {
     connectionList.innerHTML = '';
 
@@ -43,10 +52,42 @@
 
       var url = document.createElement('div');
       url.className = 'conn-url';
-      url.textContent = conn.url;
+      url.textContent = 'WS:  ' + conn.url;
 
       item.appendChild(header);
       item.appendChild(url);
+
+      var cdpAddr = conn.cdpAddress || getCdpAddress(conn.url, conn.mode);
+      if (cdpAddr) {
+        var cdpRow = document.createElement('div');
+        cdpRow.className = 'conn-cdp';
+
+        var cdpLabel = document.createElement('span');
+        cdpLabel.className = 'conn-cdp-label';
+        cdpLabel.textContent = 'CDP: ';
+
+        var cdpValue = document.createElement('span');
+        cdpValue.className = 'conn-cdp-value';
+        cdpValue.textContent = cdpAddr;
+
+        var copyBtn = document.createElement('button');
+        copyBtn.className = 'conn-cdp-copy';
+        copyBtn.textContent = '📋';
+        copyBtn.title = '复制';
+        copyBtn.addEventListener('click', function(ev) {
+          ev.stopPropagation();
+          navigator.clipboard.writeText(cdpAddr).then(function() {
+            copyBtn.textContent = '✓';
+            setTimeout(function() { copyBtn.textContent = '📋'; }, 1200);
+          });
+        });
+
+        cdpRow.appendChild(cdpLabel);
+        cdpRow.appendChild(cdpValue);
+        cdpRow.appendChild(copyBtn);
+        item.appendChild(cdpRow);
+      }
+
       connectionList.appendChild(item);
     });
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cdp-tunnel",
-  "version": "2.9.1",
+  "version": "2.9.2",
   "description": "Bridge Chrome's debugger API to WebSocket — control your existing browser with Playwright/Puppeteer via CDP",
   "main": "server/proxy-server.js",
   "bin": "./cli/index.js",