如何使用Puppeteer统计已打开的浏览器窗口数量而非标签页数量
区分独立浏览器窗口与同窗口标签页的实现方法
由原窗口点击触发的弹出窗口默认与原窗口共享浏览器上下文,因此
browser.browserContexts()这类基于上下文区分的API无法实现需求。
自动化测试场景(Playwright/Puppeteer/Selenium)
- 第一步:调用框架API获取所有打开的页面/窗口句柄:
- Playwright:
const allPages = context.pages() - Puppeteer:
const allPages = await browser.pages() - Selenium:
Set<String> allHandles = driver.getWindowHandles()
- Playwright:
- 第二步:对比不同页面的操作系统级窗口属性,同窗口下的所有标签页会共享完全相同的外层窗口尺寸、屏幕坐标,独立窗口的属性会存在差异,你可以直接在页面上下文执行以下JS代码拿到判断结果:
function isStandaloneNewWindow() { // 排除无opener的独立打开窗口,可根据需求调整逻辑 if (!window.opener || window.opener.closed) return false return ( window.screenX !== window.opener.screenX || window.screenY !== window.opener.screenY || window.outerWidth !== window.opener.outerWidth || window.outerHeight !== window.opener.outerHeight ) }
- 极端场景兼容:如果遇到用户手动将两个独立窗口调整为完全相同的尺寸和坐标的情况,可以调用框架的窗口移动API,将当前窗口偏移1px后再检测原窗口的坐标是否同步变化,独立窗口的坐标不会互相影响,检测完成后还原窗口位置即可,全程对用户无感知。
前端原生实现场景
- 可以在新窗口加载的页面中直接引入上述JS逻辑,通过
postMessage将判断结果发送给原窗口即可。 - 注意不要依赖
target="_blank"属性判断打开形式,该属性的打开行为会受浏览器配置、用户按键(按住Shift点击会强制打开新窗口)的影响,判断结果不可靠。
内容的提问来源于stack exchange,提问作者Trinity
相关产品推荐
相关产品推荐

