cdp-tunnel 1.0.0

package/tests/playwright-demo.js

@@ -0,0 +1,45 @@
+const { chromium } = require('playwright');
+
+async function main() {
+  console.log('[Playwright] Connecting to http://localhost:9221...');
+  
+  const browser = await chromium.connectOverCDP('http://localhost:9221');
+  console.log('[Playwright] Connected!');
+  
+  const context = browser.contexts()[0];
+  const pages = context?.pages() || [];
+  console.log('[Playwright] Found', pages.length, 'page(s)');
+  
+  console.log('\n>>> 请现在打开配置页面查看状态:');
+  console.log('>>> chrome-extension://bchclccgjmihieacfmaelkpfjlghhoph/config-page-preview.html');
+  console.log('>>> 等待 10 秒...\n');
+  
+  await new Promise(r => setTimeout(r, 10000));
+  
+  console.log('[Playwright] Creating new page...');
+  const page = await context.newPage();
+  await page.goto('https://www.baidu.com');
+  console.log('[Playwright] New page URL:', page.url());
+  
+  console.log('\n>>> 新页面已创建，请查看配置页面是否显示');
+  console.log('>>> 等待 10 秒...\n');
+  
+  await new Promise(r => setTimeout(r, 10000));
+  
+  console.log('[Playwright] Scrolling...');
+  for (let i = 0; i < 3; i++) {
+    await page.evaluate(() => window.scrollBy(0, 100));
+    await new Promise(r => setTimeout(r, 500));
+    console.log('  Scrolled', i + 1);
+  }
+  
+  console.log('\n>>> 滚动完成，请查看配置页面');
+  console.log('>>> 等待 5 秒后关闭...\n');
+  
+  await new Promise(r => setTimeout(r, 5000));
+  
+  console.log('[Playwright] Done!');
+  await browser.close();
+}
+
+main().catch(console.error);

package/tests/playwright-interactive.js

@@ -0,0 +1,261 @@
+const { chromium } = require('playwright');
+const readline = require('readline');
+
+const SERVER_URL = process.env.CDP_SERVER || 'http://localhost:9221';
+
+const clients = [];
+let currentClient = 0;
+
+async function createClient(name) {
+  console.log(`[${name}] Connecting to ${SERVER_URL}...`);
+  
+  const browser = await chromium.connectOverCDP(SERVER_URL);
+  const context = browser.contexts()[0];
+  
+  console.log(`[${name}] Connected!`);
+  
+  return {
+    name,
+    browser,
+    context,
+    pages: context?.pages() || [],
+    commandId: 1
+  };
+}
+
+async function main() {
+  console.log('\n=== Playwright Multi-Client Interactive Test ===\n');
+  console.log(`Server: ${SERVER_URL}\n`);
+  
+  const rl = readline.createInterface({
+    input: process.stdin,
+    output: process.stdout
+  });
+  
+  const commands = {
+    help: () => {
+      console.log(`
+Commands:
+  c <name>              - Create new client with name
+  l                     - List all clients
+  s <client> <page>     - Switch to client/page
+  n <url>               - Create new page with URL
+  g <url>               - Navigate current page to URL
+  scroll <distance>     - Scroll current page
+  click <selector>      - Click element on current page
+  type <selector> <text> - Type text into element
+  eval <code>           - Evaluate JavaScript
+  screenshot <file>     - Take screenshot
+  info                  - Show current page info
+  close <client>        - Close specific client
+  q                     - Quit
+`);
+    },
+    
+    list: () => {
+      console.log(`\nClients (${clients.length}):`);
+      clients.forEach((c, i) => {
+        console.log(`  [${i}] ${c.name} - ${c.pages.length} page(s)`);
+        c.pages.forEach((p, j) => {
+          console.log(`      Page ${j}: ${p.url()?.substring(0, 50)}`);
+        });
+      });
+      console.log('');
+    },
+    
+    create: async (name) => {
+      if (!name) {
+        console.log('Usage: c <name>');
+        return;
+      }
+      const client = await createClient(name);
+      clients.push(client);
+      currentClient = clients.length - 1;
+      console.log(`Created client "${name}", switched to it.\n`);
+    },
+    
+    switch: (clientIdx, pageIdx) => {
+      const ci = parseInt(clientIdx);
+      const pi = parseInt(pageIdx) || 0;
+      if (ci >= 0 && ci < clients.length) {
+        currentClient = ci;
+        console.log(`Switched to client ${ci}, page ${pi}\n`);
+      } else {
+        console.log('Invalid client index\n');
+      }
+    },
+    
+    newPage: async (url) => {
+      const client = clients[currentClient];
+      if (!client) {
+        console.log('No client selected. Use "c <name>" to create one.\n');
+        return;
+      }
+      const page = await client.context.newPage();
+      client.pages.push(page);
+      if (url) {
+        await page.goto(url);
+      }
+      console.log(`Created page ${client.pages.length - 1}: ${page.url()}\n`);
+    },
+    
+    goto: async (url) => {
+      const client = clients[currentClient];
+      const page = client?.pages[0];
+      if (!page) {
+        console.log('No page available.\n');
+        return;
+      }
+      await page.goto(url);
+      console.log(`Navigated to: ${page.url()}\n`);
+    },
+    
+    scroll: async (distance = 100) => {
+      const client = clients[currentClient];
+      const page = client?.pages[0];
+      if (!page) return;
+      await page.evaluate((d) => window.scrollBy(0, d), parseInt(distance));
+      console.log(`Scrolled ${distance}px\n`);
+    },
+    
+    click: async (selector) => {
+      const client = clients[currentClient];
+      const page = client?.pages[0];
+      if (!page) return;
+      await page.click(selector);
+      console.log(`Clicked: ${selector}\n`);
+    },
+    
+    type: async (selector, text) => {
+      const client = clients[currentClient];
+      const page = client?.pages[0];
+      if (!page) return;
+      await page.fill(selector, text);
+      console.log(`Typed into: ${selector}\n`);
+    },
+    
+    eval: async (code) => {
+      const client = clients[currentClient];
+      const page = client?.pages[0];
+      if (!page) return;
+      const result = await page.evaluate(code);
+      console.log(`Result:`, result, '\n');
+    },
+    
+    screenshot: async (filename = 'screenshot.png') => {
+      const client = clients[currentClient];
+      const page = client?.pages[0];
+      if (!page) return;
+      await page.screenshot({ path: `tests/${filename}` });
+      console.log(`Saved: tests/${filename}\n`);
+    },
+    
+    info: async () => {
+      const client = clients[currentClient];
+      const page = client?.pages[0];
+      if (!page) {
+        console.log('No page available.\n');
+        return;
+      }
+      console.log(`
+Client: ${client.name}
+Page URL: ${page.url()}
+Page Title: ${await page.title()}
+`);
+    },
+    
+    closeClient: async (idx) => {
+      const i = parseInt(idx);
+      if (i >= 0 && i < clients.length) {
+        await clients[i].browser.close();
+        console.log(`Closed client ${i}: ${clients[i].name}\n`);
+        clients.splice(i, 1);
+        if (currentClient >= clients.length) {
+          currentClient = Math.max(0, clients.length - 1);
+        }
+      }
+    },
+    
+    quit: async () => {
+      console.log('\nClosing all clients...');
+      for (const c of clients) {
+        await c.browser.close();
+      }
+      rl.close();
+      process.exit(0);
+    }
+  };
+  
+  console.log('Type "help" for commands.\n');
+  
+  rl.on('line', async (input) => {
+    const parts = input.trim().split(/\s+/);
+    const cmd = parts[0];
+    const args = parts.slice(1);
+    
+    try {
+      switch (cmd) {
+        case 'help':
+        case 'h':
+        case '?':
+          commands.help();
+          break;
+        case 'l':
+        case 'list':
+          commands.list();
+          break;
+        case 'c':
+          await commands.create(args[0]);
+          break;
+        case 's':
+          commands.switch(args[0], args[1]);
+          break;
+        case 'n':
+          await commands.newPage(args[0]);
+          break;
+        case 'g':
+          await commands.goto(args[0]);
+          break;
+        case 'scroll':
+          await commands.scroll(args[0]);
+          break;
+        case 'click':
+          await commands.click(args[0]);
+          break;
+        case 'type':
+          await commands.type(args[0], args[1]);
+          break;
+        case 'eval':
+          await commands.eval(args.join(' '));
+          break;
+        case 'screenshot':
+          await commands.screenshot(args[0]);
+          break;
+        case 'info':
+        case 'i':
+          await commands.info();
+          break;
+        case 'close':
+          await commands.closeClient(args[0]);
+          break;
+        case 'q':
+        case 'quit':
+        case 'exit':
+          await commands.quit();
+          break;
+        default:
+          console.log('Unknown command. Type "help" for commands.\n');
+      }
+    } catch (err) {
+      console.error('Error:', err.message, '\n');
+    }
+    
+    rl.prompt();
+  }).on('close', async () => {
+    await commands.quit();
+  });
+  
+  rl.prompt();
+}
+
+main().catch(console.error);

package/tests/playwright-multi-demo.js

@@ -0,0 +1,60 @@
+const { chromium } = require('playwright');
+
+const SERVER_URL = process.env.CDP_SERVER || 'http://localhost:9221';
+
+async function main() {
+  console.log('\n=== 多客户端测试 ===\n');
+  console.log('服务器地址:', SERVER_URL);
+  console.log('\n提示: 所有客户端连接同一个端点，服务器自动分配不同的 clientId\n');
+  
+  const clients = [];
+  
+  // 创建 3 个客户端
+  for (let i = 1; i <= 3; i++) {
+    console.log(`[Client ${i}] 连接中...`);
+    const browser = await chromium.connectOverCDP(SERVER_URL);
+    const context = browser.contexts()[0];
+    clients.push({ id: i, browser, context, pages: [] });
+    console.log(`[Client ${i}] 已连接!`);
+  }
+  
+  console.log('\n>>> 请打开配置页面查看 3 个 CDP 客户端:');
+  console.log('>>> chrome-extension://bchclccgjmihieacfmaelkpfjlghhoph/config-page-preview.html');
+  console.log('>>> 等待 15 秒...\n');
+  
+  await new Promise(r => setTimeout(r, 15000));
+  
+  // 每个客户端创建一个页面
+  for (const client of clients) {
+    console.log(`[Client ${client.id}] 创建页面...`);
+    const page = await client.context.newPage();
+    await page.goto('https://www.baidu.com');
+    client.pages.push(page);
+  }
+  
+  console.log('\n>>> 3 个页面已创建，等待 10 秒...\n');
+  await new Promise(r => setTimeout(r, 10000));
+  
+  // 并发操作
+  console.log('>>> 并发滚动测试...\n');
+  await Promise.all(clients.map(async (client) => {
+    for (let i = 0; i < 3; i++) {
+      await client.pages[0].evaluate(() => window.scrollBy(0, 100));
+      console.log(`[Client ${client.id}] 滚动 ${i + 1}`);
+      await new Promise(r => setTimeout(r, 300));
+    }
+  }));
+  
+  console.log('\n>>> 测试完成，等待 5 秒后关闭...\n');
+  await new Promise(r => setTimeout(r, 5000));
+  
+  // 关闭所有客户端
+  for (const client of clients) {
+    console.log(`[Client ${client.id}] 关闭...`);
+    await client.browser.close();
+  }
+  
+  console.log('\n所有客户端已关闭。');
+}
+
+main().catch(console.error);

package/tests/playwright-multi.js

@@ -0,0 +1,85 @@
+const { chromium } = require('playwright');
+
+const SERVER_URL = process.env.CDP_SERVER || 'http://localhost:9221';
+const NUM_CLIENTS = parseInt(process.env.NUM_CLIENTS) || 2;
+
+async function createClient(clientId) {
+  console.log(`[${clientId}] Connecting to ${SERVER_URL}...`);
+  
+  const browser = await chromium.connectOverCDP(SERVER_URL);
+  console.log(`[${clientId}] Connected!`);
+  
+  const context = browser.contexts()[0];
+  const pages = context?.pages() || [];
+  console.log(`[${clientId}] Found ${pages.length} page(s)`);
+  
+  return {
+    id: clientId,
+    browser,
+    context,
+    pages,
+    async createPage(url) {
+      console.log(`[${clientId}] Creating new page: ${url}`);
+      const page = await this.context.newPage();
+      await page.goto(url);
+      this.pages.push(page);
+      return page;
+    },
+    async scroll(pageIndex = 0, distance = 100) {
+      const page = this.pages[pageIndex];
+      if (page) {
+        console.log(`[${clientId}] Scrolling page ${pageIndex}...`);
+        await page.evaluate((d) => window.scrollBy(0, d), distance);
+      }
+    },
+    async click(pageIndex = 0, selector) {
+      const page = this.pages[pageIndex];
+      if (page) {
+        console.log(`[${clientId}] Clicking "${selector}" on page ${pageIndex}...`);
+        await page.click(selector);
+      }
+    },
+    async close() {
+      console.log(`[${clientId}] Closing...`);
+      await this.browser.close();
+    }
+  };
+}
+
+async function main() {
+  console.log(`\n=== Starting ${NUM_CLIENTS} Playwright clients ===\n`);
+  
+  const clients = [];
+  
+  for (let i = 0; i < NUM_CLIENTS; i++) {
+    const clientId = `client-${i + 1}`;
+    const client = await createClient(clientId);
+    clients.push(client);
+  }
+  
+  console.log('\n=== All clients connected ===\n');
+  
+  await Promise.all(clients.map(async (client, idx) => {
+    await client.createPage(`https://www.baidu.com`);
+    await client.pages[client.pages.length - 1].waitForTimeout(1000 * (idx + 1));
+  }));
+  
+  console.log('\n=== Testing concurrent scroll ===\n');
+  
+  await Promise.all(clients.map(async (client) => {
+    for (let i = 0; i < 3; i++) {
+      await client.scroll(0, 100);
+      await new Promise(r => setTimeout(r, 500));
+    }
+  }));
+  
+  console.log('\n=== Test completed ===\n');
+  
+  for (const client of clients) {
+    await client.close();
+  }
+  
+  console.log('All clients closed.');
+}
+
+main().catch(console.error);

package/tests/playwright-single.js

@@ -0,0 +1,41 @@
+const { chromium } = require('playwright');
+
+const SERVER_URL = process.env.CDP_SERVER || 'http://localhost:9221';
+
+async function main() {
+  console.log(`[Playwright] Connecting to ${SERVER_URL}...`);
+  
+  const browser = await chromium.connectOverCDP(SERVER_URL);
+  
+  console.log('[Playwright] Connected!');
+  
+  const contexts = browser.contexts();
+  console.log(`[Playwright] Found ${contexts.length} context(s)`);
+  
+  const pages = contexts[0]?.pages() || [];
+  console.log(`[Playwright] Found ${pages.length} page(s)`);
+  
+  if (pages.length > 0) {
+    const page = pages[0];
+    console.log(`[Playwright] First page URL: ${page.url()}`);
+    
+    console.log('[Playwright] Scrolling...');
+    await page.evaluate(() => window.scrollBy(0, 100));
+    
+    console.log('[Playwright] Taking screenshot...');
+    await page.screenshot({ path: 'tests/screenshot-playwright.png' });
+  }
+  
+  console.log('[Playwright] Creating new page...');
+  const newPage = await contexts[0].newPage();
+  await newPage.goto('https://www.baidu.com');
+  console.log(`[Playwright] New page URL: ${newPage.url()}`);
+  
+  await newPage.waitForTimeout(2000);
+  
+  console.log('[Playwright] Done!');
+  
+  await browser.close();
+}
+
+main().catch(console.error);

package/tests/screenshot-config.js

@@ -0,0 +1,35 @@
+const { chromium } = require('playwright');
+
+async function main() {
+  console.log('启动浏览器...');
+  
+  const browser = await chromium.launch({ headless: false });
+  const context = await browser.newContext({
+    viewport: { width: 1400, height: 900 }
+  });
+  const page = await context.newPage();
+  
+  // 打开配置页面
+  const configUrl = 'chrome-extension://bchclccgjmihieacfmaelkpfjlghhoph/config-page-preview.html';
+  console.log('打开配置页面:', configUrl);
+  
+  await page.goto(configUrl);
+  await page.waitForTimeout(2000);
+  
+  // 截图
+  const screenshotPath = 'docs/config-page-screenshot.png';
+  await page.screenshot({ 
+    path: screenshotPath, 
+    fullPage: true 
+  });
+  console.log('截图已保存:', screenshotPath);
+  
+  console.log('\n请在浏览器中查看配置页面，然后手动截图');
+  console.log('等待 30 秒...');
+  
+  await page.waitForTimeout(30000);
+  
+  await browser.close();
+}
+
+main().catch(console.error);

package/tests/test-client.js

@@ -0,0 +1,89 @@
+const WebSocket = require('ws');
+
+const SERVER_URL = process.argv[2] || 'ws://localhost:9221';
+const CLIENT_ID = process.argv[3] || 'test-client-1';
+
+console.log(`[Test Client ${CLIENT_ID}] Connecting to ${SERVER_URL}...`);
+
+const ws = new WebSocket(SERVER_URL);
+
+ws.on('open', () => {
+  console.log(`[Test Client ${CLIENT_ID}] Connected!`);
+  
+  ws.send(JSON.stringify({
+    type: 'identify',
+    clientId: CLIENT_ID
+  }));
+  
+  console.log(`[Test Client ${CLIENT_ID}] Sent identify message`);
+  
+  console.log(`[Test Client ${CLIENT_ID}] Enabling Target domain...`);
+  ws.send(JSON.stringify({
+    id: 1,
+    method: 'Target.setDiscoverTargets',
+    params: { discover: true }
+  }));
+  
+  setTimeout(() => {
+    console.log(`[Test Client ${CLIENT_ID}] Getting targets...`);
+    ws.send(JSON.stringify({
+      id: 2,
+      method: 'Target.getTargets',
+      params: {}
+    }));
+  }, 1000);
+  
+  setTimeout(() => {
+    console.log(`[Test Client ${CLIENT_ID}] Creating new page...`);
+    ws.send(JSON.stringify({
+      id: 3,
+      method: 'Target.createTarget',
+      params: { url: 'https://www.baidu.com' }
+    }));
+  }, 2000);
+});
+
+ws.on('message', (data) => {
+  try {
+    const msg = JSON.parse(data.toString());
+    
+    if (msg.method && msg.method.startsWith('Target.')) {
+      console.log(`[Test Client ${CLIENT_ID}] Event: ${msg.method}`, 
+        msg.params?.targetInfo?.url || msg.params?.targetId || '');
+    } else if (msg.id) {
+      console.log(`[Test Client ${CLIENT_ID}] Response to #${msg.id}:`, 
+        msg.result ? 'success' : msg.error);
+      if (msg.result && msg.result.targetInfos) {
+        console.log(`  Targets: ${msg.result.targetInfos.length}`);
+        msg.result.targetInfos.forEach(t => {
+          console.log(`    - ${t.type}: ${t.url || t.title}`);
+        });
+      }
+      if (msg.result && msg.result.targetId) {
+        console.log(`  Created target: ${msg.result.targetId}`);
+      }
+    } else {
+      console.log(`[Test Client ${CLIENT_ID}] Message:`, msg.type || msg.method);
+    }
+  } catch (e) {
+    console.log(`[Test Client ${CLIENT_ID}] Raw message:`, data.toString().substring(0, 100));
+  }
+});
+
+ws.on('close', () => {
+  console.log(`[Test Client ${CLIENT_ID}] Disconnected`);
+});
+
+ws.on('error', (err) => {
+  console.error(`[Test Client ${CLIENT_ID}] Error:`, err.message);
+});
+
+process.on('SIGINT', () => {
+  console.log(`\n[Test Client ${CLIENT_ID}] Closing...`);
+  ws.close();
+  process.exit(0);
+});
+
+console.log('\nUsage: node test-client.js [server_url] [client_id]');
+console.log('Example: node test-client.js ws://localhost:9221 client-1');
+console.log('\nPress Ctrl+C to exit\n');