如何用Playwright程序化点击Chrome扩展图标激活扩展？

方法1：直接打开扩展的弹出页面（Popup） #

Chrome扩展的弹出窗口本质是独立网页，可通过扩展ID拼接Popup的URL，用Playwright打开该页面模拟点击扩展图标的操作，步骤如下：

1. 获取扩展ID
   在现有代码访问chrome://extensions/页面后，通过page.evaluate()提取已加载扩展的ID：

// 启用开发者模式后，添加这段代码获取扩展ID
const extensionId = await page.evaluate(() => {
  const extensions = document.querySelectorAll('extensions-item');
  for (const item of extensions) {
    // 替换为你的扩展名称，精准匹配目标扩展
    if (item.shadowRoot.querySelector('#name').textContent.includes('audio-capture-extension')) {
      return item.getAttribute('id');
    }
  }
});
console.log('扩展ID:', extensionId);

2. 打开扩展Popup页面
   查看扩展manifest.json中default_popup定义的路径（如popup.html），拼接成完整URL后用上下文打开：

// 替换为你扩展实际的Popup文件路径
const popupUrl = `chrome-extension://${extensionId}/popup.html`;
const popupPage = await context.newPage();
await popupPage.goto(popupUrl);

// 可继续操作Popup内元素，比如点击激活按钮
// await popupPage.getByRole('button', { name: '开始捕获' }).click();

方法2：利用Chrome调试协议（CDP）触发扩展图标点击 #

若Popup页面无法满足需求，可通过Playwright的CDP接口直接触发扩展图标点击事件：

// 获取Zoom会议页面的目标对象
const target = await context.waitForTarget(t => t.url().includes('zoom.us'));
const page = await target.page();

// 替换为你的扩展ID，触发图标点击
await page.context().crx.sendCommand('browserAction.click', {
  extensionId: '你的扩展ID',
  tabId: await page.target().page().evaluate(() => chrome.devtools.inspectedWindow.tabId)
});

方法3：使用扩展快捷键触发 #

如果你的扩展在manifest.json中配置了命令快捷键（commands字段），可直接模拟快捷键操作：

// 替换为扩展实际的激活快捷键
await page.keyboard.press('Control+Shift+A');

整合到现有代码的完整示例 #

const extensionPath = require('path').join(__dirname, 'audio-capture-extension');

const context = await chromium.launchPersistentContext("", {
  headless: false,
  args:[`--load-extension=${extensionPath}`, `--disable-extensions-except=${extensionPath}`]
});

try {
  const page = await context.newPage();
  await page.goto('chrome://extensions/')
  await page.waitForSelector('extensions-manager');
  const toggle = await page.$('#devMode')
  await page.waitForTimeout(1000)
  const isChecked = await toggle.getAttribute('aria-pressed');
  console.log(isChecked)
  if(isChecked == "false") {
      await page.click('#devMode');
  }
  await page.waitForTimeout(2000);

  // 获取扩展ID
  const extensionId = await page.evaluate(() => {
    const extensions = document.querySelectorAll('extensions-item');
    for (const item of extensions) {
      if (item.shadowRoot.querySelector('#name').textContent.includes('audio-capture-extension')) {
        return item.getAttribute('id');
      }
    }
  });
  console.log('扩展ID:', extensionId);

  const page2 = await context.newPage();
  await page2.goto('https://something.zoom.us/wc/98335327999/join?pwd=aWZEeklZUE1FR2lXaGhrTHZ65Jcwdz09');
  await page2.getByPlaceholder('Your Name').click();
  await page2.getByPlaceholder('Your Name').fill('Test User');
  await page2.getByRole('button', { name: 'Join' }).click();

  await page2.waitForTimeout(5000);

  // 打开扩展Popup页面模拟激活
  const popupUrl = `chrome-extension://${extensionId}/popup.html`;
  const popupPage = await context.newPage();
  await popupPage.goto(popupUrl);

  // 这里添加Popup内需要执行的操作

  await page.waitForTimeout(1000*60*5); 
  await page.getByText('Joining Meeting...').click();
} catch (error) {
  console.error('操作出错:', error);
  await context.close();
}

内容的提问来源于stack exchange，提问作者Nishaant Sharma