WebDriver BiDi を Firefox、Chrome、Puppeteer で本番環境に対応

Matthias Rohmer
Matthias Rohmer

先週、Google は BrowserStack と共同で、WebDriver BiDi が BrowserStack で本番環境に対応したことを発表しました。今週の WebDriver BiDi の夏は Firefox 129 と Puppeteer 23 で、WebDriver BiDi の本番環境に対応したサポートが受けられます。

Mozilla は、4 年以上にわたり WebDriver BiDi の強力な協力者であり、最初は新しい標準の策定を支援し、その後 Firefox に段階的に実装し、Firefox WebDriver ニュースレターで進捗状況をきちんと記録してきました。

Firefox で WebDriver BiDi が本番環境に対応したことで、バージョン 23 以降の Puppeteer は、WebDriver BiDi を介して Firefox を安定的にサポートしています。これにより、Chrome と同じ簡潔な API を使用して Firefox を自動化できます。Puppeteer の Chrome DevTools プロトコル(CDP)のサポートは変更されません。

Firefox、CDP、Puppeteer

Puppeteer は、Chrome DevTools プロトコル(CDP)を使用して Chromium ベースのブラウザを自動化する、信頼性の高いデベロッパー向けツールです。2019 年に Puppeteer は Firefox の試験運用版のサポートを開始しました。

これを実現するため、Mozilla は Firefox で CDP のサブセットを実装し、保守しています。このソリューションでは、Puppeteer API を使用して Firefox を自動化できましたが、いくつかの注意点がありました。

  • 名前が示すように、CDP は Chrome の DevTools で使用され、DevTools の要件に合わせて変更する必要があります。
  • CDP は共有された公開仕様で標準化されておらず、Firefox で維持するには継続的なコミュニケーションと労力が必要でした。
  • Firefox には CDP のサブセットしか実装されていないため、Puppeteer では Firefox で API が完全に機能することを保証できず、ユーザーに混乱を招いていました。

過去数年間、Mozilla と協力してこのサポートを維持してきましたが、これは永続的な解決策ではないと常に認識していました。このパートナーシップに基づき、他の主要なブラウザ ベンダーやツール ベンダーとともに、WebDriver BiDi を作成しました。

チームワークで夢を現実に

Firefox チームは、Firefox に WebDriver BiDi を実装するために懸命に取り組んできました。同時に、Puppeteer チームは、Puppeteer API 全体に WebDriver BiDi のサポートを拡大しています。両チームが目指した目標は、本番環境の自動化ユースケースに必要なすべての API を Puppeteer の WebDriver BiDi で使用できるようにし、Chrome と Firefox の両方でサポートを確実にすることでした。

過去数か月間の合格テスト数を示す共有チーム ダッシュボード。
過去数か月間の合格テスト数を示す共有チーム ダッシュボード。

これにより、Puppeteer ユーザーは、Puppeteer インスタンスを起動するときに browser 構成キーを指定して、自動化に Firefox または Chrome を選択できます。

import puppeteer from 'puppeteer';

const firefoxBrowser = await puppeteer.launch({
  browser: 'firefox', // WebDriver BiDi is used by default in Firefox.
});
const page = await firefoxBrowser.newPage();
...
await firefoxBrowser.close();

const chromeBrowser = await puppeteer.launch({
  browser: 'chrome',  
  protocol: 'webDriverBiDi', // CDP would be used by default for Chrome.
});
const page = await chromeBrowser.newPage();
...
await chromeBrowser.close();

Firefox 129 の新機能と Mozilla による WebDriver BiDi に関する作業の詳細については、関連する Mozilla Hacks のブログ投稿をご覧ください。

今後の CDP のサポート

上のコード スニペットから、Puppeteer で WebDriver BiDi を使用して Chrome を自動化するには、protocol を明示的に webDriverBiDi に設定する必要があることがわかります。これは、Chrome では Puppeteer がデフォルトで CDP を使用するためです。これは、既存の自動化を中断しないようにするためだけでなく、Chrome の機能に特化した自動化を引き続きサポートするためです。

Firefox での CDP のサポートは Firefox 129 で非推奨になり、2024 年末に削除される予定です。Firefox で CDP のサポートに依存する既存の自動化がある場合は、WebDriver BiDi に移行することを強くおすすめします。それが不可能な場合は、ユースケースを dev-webdriver@mozilla.org にお問い合わせください。