WebDriver BiDi:2023 年狀態更新

Mathias Bynens
Mathias Bynens

本文將概略介紹 WebDriver BiDi 在 2023 年的最新功能。

什麼是 WebDriver BiDi?

WebDriver 是一種瀏覽器自動化通訊協定,定義為 W3C 標準,並在 ChromeDriver、GeckoDriver 和 WebKitDriver 中實作。

Chromium 也有專屬的瀏覽器自動化通訊協定:Chrome 開發人員工具說明書通訊協定 (CDP)。

這兩種通訊協定之間有一些基本差異:WebDriver 是可互通標準,但效率較低,且缺少 CDP 的功能。相較之下,CDP 的效率和效能更高,但互通性較低。

因此,W3C 瀏覽器測試和工具工作小組在 2020 年開始著手開發 WebDriver BiDi,這是一項新的標準瀏覽器自動化通訊協定,可彌補 WebDriver Classic 和 CDP 通訊協定之間的差距。兩全其美!如需更多背景資訊,請參閱「回顧過去:測試自動化技術的演進歷程」和「WebDriver BiDi:跨瀏覽器自動化技術的未來」。

WebDriver BiDi 的努力包括標準化工作、建立網路平台測試,以及為不同瀏覽器引擎導入相關功能。

我們目前處於哪個階段?

2022 年,Chrome/ChromeDriver 106Firefox 102 都已支援 WebDriver BiDi 標準。

自此之後,WebDriver BiDi 已在熱門架構中獲得採用,並透過開放開發人員最需要的功能 (例如記錄支援),解決開發人員最常遇到的問題。

由 WebDriver BiDi 提供支援的記錄功能

常見的用途是自動驗證網頁載入時沒有任何主控台記錄、警告或錯誤,也沒有任何未偵測到的 JavaScript 例外狀況。另一個用途是,您可能想編寫自動化測試,檢查網頁是否會在預期情況下記錄警告或擲回例外狀況。這些問題無法透過 WebDriver Classic 解決,因為這項工具不是雙向。而 WebDriver BiDi 現已可實現這項功能。

以下是使用 Selenium JavaScript 語言繫結功能實作第二個用途的範例:

import * as assert from 'node:assert';
import { Builder, LogInspector } from 'selenium-webdriver';
import chrome from 'selenium-webdriver/chrome.js';

const driver = new Builder()
  .forBrowser('chrome')
  .setChromeOptions(new chrome.Options().enableBidi())
  .build();

const inspector = await LogInspector(driver);
await inspector.onConsoleEntry((entry) => {
  console.log(`Console message received: [${
    entry.type}][${entry.level}] ${entry.text}`);
});

await driver.get('https://www.selenium.dev/selenium/web/bidi/logEntryAdded.html');
await driver.findElement({ id: 'consoleLog' }).click();

await driver.quit();

以下是使用 Puppeteer 實驗性 WebDriver BiDi 支援的範例:

import puppeteer from 'puppeteer';

const browser = await puppeteer.launch({
  protocol: 'webDriverBiDi',
  headless: 'new',
});

const context = await browser.createIncognitoBrowserContext();
const page = await context.newPage();

page.on('console', (message) => {
  console.log(`Console message received: [${
    message.type()
  }] ${message.text()}`);
});

await page.goto(`https://www.selenium.dev/selenium/web/bidi/logEntryAdded.html`);
await page.evaluate(() => {
  document.querySelector('#consoleLog').click();
});

await browser.close();

您也可以透過其他抽象化功能 (例如 WebdriverIO) 使用相同功能。

共用的公開路線圖

我們仍在與其他瀏覽器供應商和參與 W3C 工作小組的業界利益相關者合作,進一步完善 WebDriver BiDi 規格。這個團隊最近同意採用共同路線圖,將即將推出的規格和實作工作,與明確的使用者端端對端用途進行對齊。

互通性

由於工作小組共同指定更多功能,我們也為 WebDriver BiDi 通訊協定建立網路平台測試。這個共用測試套件可協助我們驗證實作項目的正確性和互通性。您可以在 WPT 資訊主頁上查看各種瀏覽器的最新測試結果。

支援 WebDriver BiDi:您可以提供哪些協助?

您是否期待 WebDriver BiDi 帶來的瀏覽器自動化未來?你可以透過以下方式表達支持:

  • 成為早期測試人員和採用者,協助塑造 WebDriver BiDi 的未來。
  • 快分享這個好消息!使用 #WebDriverBiDi 主題標記,在社群媒體上分享專案。
  • 尋求支援。提交功能要求,或向您喜愛的工具詢問他們是否有採用 WebDriver BiDi 的計畫。
  • 參與規格討論