Node.js中如何实现带WebSocket能力的多浏览器实例用于社交应用测试？

技术选型 #

直接用Node.js生态的Puppeteer作为无头浏览器控制工具，完全满足无UI运行、多实例隔离的需求，同时可以通过Chrome DevTools Protocol（CDP）直接监听页面内的所有WebSocket生命周期事件，不需要侵入业务代码埋点。

核心实现步骤 #

• 依赖安装
  执行以下命令安装所需依赖：

  npm install puppeteer
  

• 多浏览器实例初始化
  每个浏览器实例配置独立的用户数据目录，避免不同账号的cookie、本地存储互相串扰，确保每个实例对应独立的账号会话：

  const puppeteer = require('puppeteer');
  // 按账号数量初始化对应数量的独立浏览器实例
  const initMultiBrowsers = async (accountCount) => {
    const browserList = [];
    for (let i = 0; i < accountCount; i++) {
      const browser = await puppeteer.launch({
        headless: 'new', // 启用新版无头模式，行为和有头浏览器完全一致
        userDataDir: `./tmp/user_session_${i}`, // 独立会话目录
        args: ['--no-sandbox', '--disable-setuid-sandbox']
      });
      browserList.push({
        browser,
        account: {
          username: `test_user_${i}`,
          password: 'test_pass'
        }
      });
    }
    return browserList;
  }
  

• 登录流程与WebSocket事件监听
  对每个浏览器实例单独执行登录逻辑，同时通过CDP监听WebSocket的创建、关闭事件，记录断开的状态码、触发时机用于后续校验：

  const bindWsMonitor = async (page, eventCollection) => {
    const cdpClient = await page.target().createCDPSession();
    await cdpClient.send('Network.enable');
    // 监听WebSocket创建
    cdpClient.on('Network.webSocketCreated', (params) => {
      eventCollection.push({
        type: 'connect',
        wsUrl: params.url,
        timestamp: Date.now()
      });
    });
    // 监听WebSocket关闭
    cdpClient.on('Network.webSocketClosed', (params) => {
      eventCollection.push({
        type: 'close',
        code: params.code,
        reason: params.reason,
        timestamp: Date.now()
      });
      // 可直接在此处加断言，判断关闭逻辑是否符合业务预期
    });
  }
  
  const runSingleAccountTest = async (browserInfo) => {
    const { browser, account } = browserInfo;
    const page = await browser.newPage();
    const wsEventList = [];
    await bindWsMonitor(page, wsEventList);
  
    // 执行登录：可直接注入cookie，也可模拟表单提交或调用登录接口
    await page.goto('你的应用访问地址');
    await page.evaluate((loginInfo) => {
      return fetch('/api/auth/login', {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify(loginInfo)
      });
    }, account);
    // 等待登录完成，WebSocket连接建立
    await page.waitForNetworkIdle({ idleTime: 1000 });
  
    return { page, wsEventList };
  }
  

• 核心场景测试逻辑
  针对你需要验证的三个场景分别编写测试逻辑：
  1. 关闭标签页场景：直接调用await page.close()，校验WebSocket是否触发正常断开，服务端是否正确清理该用户的在线状态
  2. 账号登出场景：模拟点击登出按钮或调用登出接口，校验WebSocket是否按业务约定主动断开，断开状态码是否符合预期，服务端是否同步清理登录态
  3. 退出群组场景：模拟用户退出群组操作，校验是否触发对应群组的WebSocket连接断开/退群通知推送，服务端是否正确移除该用户的群组成员资格
• 测试资源清理
  所有测试用例执行完成后，调用await browser.close()关闭所有浏览器实例，可同时删除临时生成的./tmp目录下的会话文件，避免占用磁盘空间。

注意事项 #

• 必须为每个浏览器实例配置独立的userDataDir，否则会共享会话存储导致账号登录状态冲突
• 如果不需要模拟完整的浏览器交互，仅测试WebSocket接口逻辑，可以直接用ws库模拟客户端连接，运行性能比无头浏览器更高
• 可以搭配Node自带的assert模块直接在事件监听逻辑中加校验规则，不符合预期直接抛出异常即可标记测试不通过

内容的提问来源于stack exchange，提问作者Michael Mammoliti