实验性 WebDriver BiDi 支持

¥Experimental WebDriver BiDi support

WebDriver 双向 是一种新的跨浏览器自动化协议，目前正在开发中，旨在结合 WebDriver“经典”和 CDP 的优点。WebDriver BiDi 保证双向通信，默认情况下速度很快，并且包含底层控制。

¥WebDriver BiDi is a new cross-browser automation protocol currently under development, aiming to combine the best of both WebDriver “Classic” and CDP. WebDriver BiDi promises bi-directional communication, making it fast by default, and it comes packed with low-level control.

也可以看看：

¥See also:

• WebDriver 双向 - 跨浏览器自动化的未来

  ¥WebDriver BiDi - The future of cross-browser automation

• WebDriver BiDi：2023 年状态更新

  ¥WebDriver BiDi: 2023 status update

使用 Chrome 和 Firefox 实现自动化

¥Automate with Chrome and Firefox

Puppeteer 支持 Chrome 和 Firefox 的 WebDriver BiDi 自动化。

¥Puppeteer supports WebDriver BiDi automation with Chrome and Firefox.

Firefox 集成的功能已接近与之前基于 CDP 的方法相当。在 专门公告 中了解更多信息。

¥Firefox integration is nearing feature parity with its previous CDP-based approach. Learn more in the dedicated announcement.

衡量进展

¥Measuring progress

为了衡量 WebDriver BiDi 的功能，我们利用了综合 Puppeteer 测试套件

¥To gauge the capabilities of WebDriver BiDi, we utilized the comprehensive Puppeteer test suite

• 对于 Firefox，与 CDP 实现相比，目前有 60 个失败测试，而超过 82 个新测试成功利用了 WebDriver BiDi，展示了其不断增长的潜力。

  ¥For Firefox, there are currently under 60 failing tests compared to the CDP implementation, while over 82 new tests successfully utilize WebDriver BiDi, demonstrating its growing potential.

• 对于 Chrome，大约 68% 的测试通过 WebDriver BiDi，这表明与基于 CDP 的方法相比还有改进的空间。

  ¥For Chrome, around 68% of tests pass with WebDriver BiDi, indicating room for improvement compared to the CDP-based approach.

开始使用

¥Get started

下面是使用 WebDriver BiDi 启动 Firefox 或 Chrome 的示例：

¥Below is an example of launching Firefox or Chrome with WebDriver BiDi:

import puppeteer from 'puppeteer';

const browser = await puppeteer.launch({
  product: 'firefox', // or 'chrome'
  protocol: 'webDriverBiDi',
});
const page = await browser.newPage();
...
await browser.close();

这是迈向更加统一、高效的跨浏览器自动化体验的激动人心的一步。我们鼓励你与 Puppeteer 一起探索 WebDriver BiDi，并与我们一起塑造浏览器自动化的未来。

¥This is an exciting step towards a more unified and efficient cross-browser automation experience. We encourage you to explore WebDriver BiDi with Puppeteer and join us in shaping the future of browser automation.

WebDriver BiDi 支持的 Puppeteer 功能

¥Puppeteer features supported over WebDriver BiDi

• 浏览器和页面自动化

  ¥Browser and page automation

  • Browser.close

  • Frame.goto()（referer 和 referrerPolicy 除外）

    ¥Frame.goto() (except referer and referrerPolicy)

  • Page.bringToFront

  • Page.goBack()

  • Page.goForward()

  • Page.goto（referer 和 referrerPolicy 除外）

    ¥Page.goto (except referer and referrerPolicy)

  • Page.reload（ignoreCache 参数除外）

    ¥Page.reload (except for ignoreCache parameter)

  • Page.setViewport（仅限 width、height、deviceScaleFactor）

    ¥Page.setViewport (width, height, deviceScaleFactor only)

  • Puppeteer.launch

• 脚本评估：

  ¥Script evaluation:

  • JSHandle.evaluate

  • JSHandle.evaluateHandle

  • Page.evaluate

  • Page.exposeFunction

• 选择器 和 locators（ARIA 除外）：

  ¥Selectors and locators except for ARIA:

  • Page.$（Chrome 支持的 ARIA 选择器）

    ¥Page.$ (ARIA selectors supported in Chrome)

  • Page.$$（Chrome 支持的 ARIA 选择器）

    ¥Page.$$ (ARIA selectors supported in Chrome)

  • Page.$$eval（Chrome 支持的 ARIA 选择器）

    ¥Page.$$eval (ARIA selectors supported in Chrome)

  • Page.$eval（Chrome 支持的 ARIA 选择器）

    ¥Page.$eval (ARIA selectors supported in Chrome)

  • Page.waitForSelector（Chrome 支持的 ARIA 选择器）

    ¥Page.waitForSelector (ARIA selectors supported in Chrome)

• Input

  • ElementHandle.uploadFile

  • ElementHandle.click

  • Keyboard.down

  • Keyboard.press

  • Keyboard.sendCharacter

  • Keyboard.type

  • Keyboard.up

  • 鼠标事件（专用的 drag'n'drop API 方法除外）

    ¥Mouse events (except for dedicated drag'n'drop API methods)

  • Page.tap

  • 触摸屏。*

    ¥TouchScreen.*

• JavaScript 对话框拦截

  ¥JavaScript dialog interception

  • page.on('对话')

    ¥page.on('dialog')

  • 对话。*

    ¥Dialog.*

• 截图（并非所有参数都支持）

  ¥Screenshots (not all parameters are supported)

  • Page.screenshot（支持参数 clip、encoding、fullPage）

    ¥Page.screenshot (supported parameters clip, encoding, fullPage)

• PDF 生成（并非所有参数都支持）

  ¥PDF generation (not all parameters are supported)

  • Page.pdf（仅支持 format、height、landscape、margin、pageRanges、printBackground、scale、width）

    ¥Page.pdf (only format, height, landscape, margin, pageRanges, printBackground, scale, width are supported)

  • Page.createPDFStream（仅支持 format、height、landscape、margin、pageRanges、printBackground、scale、width）

    ¥Page.createPDFStream (only format, height, landscape, margin, pageRanges, printBackground, scale, width are supported)

• 权限（仅在 Chrome 中支持）

  ¥Permissions (Supported in Chrome only)

  • BrowserContext.clearPermissionOverrides()

  • BrowserContext.overridePermissions()

WebDriver BiDi 尚不支持 Puppeteer 功能

¥Puppeteer features not yet supported over WebDriver BiDi

• 请求拦截

  ¥Request interception

  • HTTPRequest.abort()

  • HTTPRequest.abortErrorReason()

  • HTTPRequest.client()

  • HTTPRequest.continue()

  • HTTPRequest.continueRequestOverrides()

  • HTTPRequest.failure()

  • HTTPRequest.finalizeInterceptions()

  • HTTPRequest.interceptResolutionState()

  • HTTPRequest.isInterceptResolutionHandled()

  • HTTPRequest.response()

  • HTTPRequest.responseForRequest()

  • Page.setRequestInterception()

• 各种模拟（Chrome 支持大多数）

  ¥Various emulations (most are supported with Chrome)

  • Page.emulate()（仅在 Chrome 中支持）

    ¥Page.emulate() (supported only in Chrome)

  • Page.emulateCPUThrotdling()（仅在 Chrome 中支持）

    ¥Page.emulateCPUThrottling() (supported only in Chrome)

  • Page.emulateIdleState()（仅在 Chrome 中支持）

    ¥Page.emulateIdleState() (supported only in Chrome)

  • Page.emulateMediaFeatures()（仅在 Chrome 中支持）

    ¥Page.emulateMediaFeatures() (supported only in Chrome)

  • Page.emulateMediaType()（仅在 Chrome 中支持）

    ¥Page.emulateMediaType() (supported only in Chrome)

  • Page.emulateTimezone()（仅在 Chrome 中支持）

    ¥Page.emulateTimezone() (supported only in Chrome)

  • Page.emulateVisionDeficiency()（仅在 Chrome 中支持）

    ¥Page.emulateVisionDeficiency() (supported only in Chrome)

  • Page.setBypassCSP()（仅在 Chrome 中支持）

    ¥Page.setBypassCSP() (supported only in Chrome)

  • Page.setCacheEnabled()（仅在 Chrome 中支持）

    ¥Page.setCacheEnabled() (supported only in Chrome)

  • Page.setGeolocation()（仅在 Chrome 中支持）

    ¥Page.setGeolocation() (supported only in Chrome)

  • Page.setJavaScriptEnabled()（仅在 Chrome 中支持）

    ¥Page.setJavaScriptEnabled() (supported only in Chrome)

• CDP 特定功能

  ¥CDP-specific features

  • Page.createCDPSession()（仅在 Chrome 中支持）

    ¥Page.createCDPSession() (supported only in Chrome)

• 跟踪（仅在 Chrome 中支持）

  ¥Tracing (supported only in Chrome)

• Coverage (supported only in Chrome)

• 辅助功能（仅在 Chrome 中支持）

  ¥Accessibility (supported only in Chrome)

• 其他方法：

  ¥Other methods:

  • Browser.userAgent()

  • Frame.isOOPFrame()

  • Frame.waitForDevicePrompt()

  • HTTPResponse.buffer()

  • HTTPResponse.fromServiceWorker()

  • HTTPResponse.securityDetails()

  • Input.drag()

  • Input.dragAndDrop()

  • Input.dragOver()

  • Input.drop()

  • Page.authenticate()

  • Page.cookies()

  • Page.deleteCookie()

  • Page.emulateNetworkConditions()

  • Page.isDragInterceptionEnabled()

  • Page.isJavaScriptEnabled()（仅在 Chrome 中支持）

    ¥Page.isJavaScriptEnabled() (supported only in Chrome)

  • Page.isServiceWorkerBypassed()

  • Page.metrics()

  • Page.queryObjects()（仅在 Chrome 中支持）

    ¥Page.queryObjects() (supported only in Chrome)

  • Page.screencast()（仅在 Chrome 中支持）

    ¥Page.screencast() (supported only in Chrome)

  • Page.setBypassServiceWorker()

  • Page.setCookie()

  • Page.setDragInterception()

  • Page.setExtraHTTPHeaders()

  • Page.setOfflineMode()

  • Page.setUserAgent()

  • Page.waitForDevicePrompt()

  • Page.waitForFileChooser()

  • Page.workers()

  • PageEvent.popup

  • PageEvent.WorkerCreated

  • PageEvent.WorkerDestroyed

  • Target.opener()