Puppeteer 現在可以和 Firefox 交談了！🎉? 但是等不及了嗎？🤔? 讓我們深入探討 Puppeteer 中新通訊協定的 WebDriver BiDi，並探索這次令人期待的 Firefox 自動化工作流程發展所帶來的影響。
WebDriver BiDi 是全新的標準化跨瀏覽器自動化通訊協定，結合了 WebDriver Classic 和 Chrome DevTools Protocol (CDP) 的優勢。這個版本可以支援雙向通訊，帶來更有效率、更強大的自動化功能，以及精細的控管機制。你可以在官方發展藍圖中追蹤進度。
從先前的狀態更新開始，我們持續與 W3C 瀏覽器測試和工具工作小組密切合作。多虧了 WebDriver BiDi 的進展，Puppeteer 現在可以導入記錄、網路活動和表單提交等功能。
顯示程式碼
下列 Puppeteer 指令碼示範 WebDriver BiDi 的實際運作情形，並且在 Chrome 和 Firefox 中順暢運作：
- 透過通訊協定設定啟動所選瀏覽器。
- 監控主控台訊息是否有錯誤。
- 前往網頁、設定可視區域的尺寸，然後按一下按鈕。
- 驗證文字內容並聲明相等性。
import * as assert from 'node:assert';
import puppeteer from 'puppeteer';
// Arrange: Launch browser with WebDriver BiDi
const browser = await puppeteer.launch({
protocol: 'webDriverBiDi',
product: 'firefox', // or 'chrome'
});
const context = await browser.createIncognitoBrowserContext();
const page = await context.newPage();
// Arrange: Monitor console messages
page.on('console', message => {
if (message.type() != 'error') return;
console.log('RECEIVED: %s', message.text());
});
// Action
await page.setViewport({width: 600, height: 1041});
await page.goto('https://coffee-cart.app/?breakable=1');
const coffee = await page.waitForSelector('[data-test="Espresso"]');
await coffee.click();
// Assert
const checkout = await page.$('[data-test="checkout"]');
const total = await checkout.evaluate(el => el.textContent);
assert.equal(total, 'Total: $10.00');
browser.close();
Puppeteer 中的 WebDriver BiDi 進度
為了評估 Puppeteer 中 WebDriver BiDi 的功能，我們使用全方位的 Puppeteer 測試套件。Puppeteer 和 WebDriver BiDi 的導入作業仍在開發階段，目前並未提供 Puppeteer 和 Chrome 及 CDP 的所有美妙鈴鐺。
Firefox:
- WebDriver BiDi 已達適合實際自動化作業的品質。Mozilla 已成功將 Puppeteer 測試的 pdf.js 從 Firefox 和 CDP 移植到 Firefox 和 WebDriver BiDi。
- 超過 55% 的測試已成功使用 WebDriver BiDi 通過，顯示持續成長的功能。
- 值得注意的是，有超過 82 項新測試有效運用 WebDriver BiDi，為進一步強化功能提供基礎。
Chrome：
- Chrome 目前採用 WebDriver BiDi 的通過率為 68%，這代表了這項功能可靠。相較於以 CDP 為基礎的做法，還有更進一步的最佳化空間，但這項前景值得期待的未來發展。
部分功能仍在啟用中，例如 Cookie 存取權、網路要求攔截、特定模擬功能和權限。等一切就緒後，即可整合至 Puppeteer。在此期間，請參閱 WebDriver BiDi 支援的 Puppeteer 功能完整清單。
Puppeteer 尚未支援 Firefox 嗎？
雖然 Puppeteer 先前只透過有限且非跨瀏覽器導入 CDP 的方式，提供 Firefox 實驗性支援，但受到一些限制的影響，並非永續解決方案。
實驗性的 Firefox 和 WebDriver BiDi 實作解決了這些問題。
我們瞭解您可能還有其他疑問，例如：
- Firefox 的 CDP 支援服務即將停用嗎？
- 是否支援所有 Puppeteer 功能？
如需更多資訊，請參閱 Firefox 公告！
前方的精彩時光
跨瀏覽器測試已是最重要的開發人員需求之一，因此我們很高興能帶領 WebDriver BiDi 的整合服務成為 Puppeteer，大力改善跨瀏覽器自動化體驗。我們建議您使用 Puppeteer 探索 WebDriver BiDi。
未來，WebDriver BiDi 將成為 Puppeteer 的預設通訊協定，提供一致且強大的自動化體驗。
如果在透過 WebDriver BiDi 執行 Puppeteer 測試時遇到任何問題，請在我們的 Puppeteer Issue Tracker 中開啟問題。