Google chrome extension 如何测试&x27;devtools chrome扩展插件';使用谷歌木偶?

Google chrome extension 如何测试&x27;devtools chrome扩展插件';使用谷歌木偶?,google-chrome-extension,puppeteer,Google Chrome Extension,Puppeteer,我开发了一个插件,它是google开发者工具的一部分。它在开发者工具中有自己的面板。它还拦截请求,并为用户提供一些UI。我想自动测试这个插件。有没有办法让GooglePuppeter打开正确的开发工具面板并执行操作 你可以试试这样的东西 const browser = await puppeteer.launch({ devtools: true }); const targets = await browser.targets(); // find Devtools target URL c

我开发了一个插件,它是google开发者工具的一部分。它在开发者工具中有自己的面板。它还拦截请求,并为用户提供一些UI。我想自动测试这个插件。有没有办法让GooglePuppeter打开正确的开发工具面板并执行操作

你可以试试这样的东西

const browser = await puppeteer.launch({ devtools: true });
const targets = await browser.targets();

// find Devtools target URL
const devtoolsUrl = targets
    .map(({ _targetInfo }) => _targetInfo.url)
    .find((url) => url.indexOf('chrome-devtools://') !== -1);

// load the Devtools page in a new tab
const page = await browser.newPage();
await page.goto(devtoolsUrl);

// click on Network tab
const networkTab = await page.evaluateHandle(`document.querySelector('#-blink-dev-tools > div.widget.vbox.root-view > div > div.widget.vbox.insertion-point-sidebar > div > div').shadowRoot.querySelector('#tab-network');`);
await networkTab.click();

基于此。我已经试过了,效果很好,检查一下,这只是一个解决办法,因为它只是加载静态面板,里面没有数据。我们无法与当前页面的devtools的live面板交互。