الاستفادة من ميزات WebDriver BiDi: التشغيل الآلي في Chrome وFirefox مع Puppeteer

جيسلين يين

يتحدث Puppeteer الآن إلى Firefox! 🎉 مهلاً، أليس كذلك؟ 🎉 لنتحدث بالتفصيل عن بروتوكول WebDriver BiDi، وهو البروتوكول الجديد في Puppeteer ونكتشف ما يعنيه هذا التطور المثير لسير عمل التشغيل الآلي في Firefox.

WebDriver BiDi هو بروتوكول جديد موحّد للتشغيل التلقائي على جميع المتصفِّحات ويجمع بين أفضل ميزات WebDriver الكلاسيكي وبروتوكول Chrome DevTools (CDP). تعد هذه الخدمة بإمكانيات اتصال ثنائي الاتجاه، ما يتيح استخدام أتمتة أكثر فعالية وكفاءة، بالإضافة إلى عناصر تحكّم دقيقة. يمكنك تتبُّع مستوى التقدّم في خارطة الطريق الرسمية.

منذ التحديث السابق الذي أجريناه على الحالة، واصلنا العمل عن كثب مع مجموعة عمل الأدوات الخاصة باختبار المتصفح والأدوات في W3C. ينفذ Puppeteer الآن ميزات مثل تسجيل الدخول وأحداث الشبكة وعمليات إرسال النماذج، وذلك بفضل التطورات في WebDriver BiDi.

عرض الرمز

يعرض النص البرمجي Puppeteer التالي WebDriver BiDi بشكل عملي، ويعمل بسلاسة على Chrome وFirefox:

  1. شغِّل المتصفح الذي اخترته باستخدام إعداد البروتوكول.
  2. رصد رسائل وحدة التحكّم بحثًا عن الأخطاء.
  3. انتقِل إلى صفحة ويب وعيِّن أبعاد إطار العرض، ثم انقر على أحد الأزرار.
  4. تحقَّق من محتوى النص وأكد على المساواة.
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();

مستوى تقدم WebDriver BiDi في Puppeteer

لقياس إمكانات WebDriver BiDi في Puppeteer، استخدمنا حزمة اختبار Puppeteer الشاملة. على الرغم من أنّ استخدام Puppeteer وWebDriver BiDi لا يزال جاريًا ولا يحتوي على كل الميزات التي يميّزها Puppeteer عن Chrome وCDP حتى الآن، نريد أن نعطيك صورة واضحة عن مواقف الأمور.

فايرفوكس:

  • وصلت واجهة WebDriver BiDi إلى مستوى من الجودة المناسب لتنفيذ مهام التشغيل الآلي العملية. نجحت Mozilla في نقل اختبارات Puppeteer بتنسيق pdf.js من Firefox وCDP إلى Firefox وWebDriver BiDi.
  • نجح استخدام أكثر من 55% من الاختبارات مع WebDriver BiDi، ما يدل على تزايد وظائفه.
  • وعلى وجه التحديد، يستخدم أكثر من 82 اختبارًا جديدًا واجهة WebDriver BiDi بكفاءة، ما يمهد الطريق لمزيد من التحسينات.

متصفِّح Chrome:

  • يحقّق Chrome حاليًا معدّل نجاح بنسبة% 68 من خلال استخدام WebDriver BiDi، ما يدل على أنّ وظائفه يمكن الاعتماد عليها بشكل موثوق. وعلى الرغم من أنّ هناك مجالاً لإجراء مزيد من التحسين مقارنةً بالمنهج المستند إلى بروتوكول CDP، فإنّ هذا إجراء تطورات مستقبلية واعدة ومشوّقة.

لا تزال بعض الميزات، مثل الوصول إلى ملفات تعريف الارتباط واعتراض طلبات الشبكة وميزات المحاكاة المحددة والأذونات، خاضعة للتوحيد النشط. سيتم دمجها في Puppeteer عندما تصبح جاهزة. في الوقت الحالي، يمكنك الاطّلاع على القائمة الكاملة لميزات Puppeteer المتوافقة مع WebDriver BiDi.

ألم يكن برنامج Puppeteer متوافقًا مع Firefox؟

بينما عرضت Puppeteer سابقًا دعمًا تجريبيًا لمتصفح Firefox باستخدام تنفيذ محدود وغير عبر المتصفحات لـ CDP، إلا أنها عانىت من قيود ولم تكن حلاً مستدامًا.

يعالج تطبيق الإصدار التجريبي الجديد من Firefox وWebDriver BiDi هذه المشاكل.

نعلم أنّه قد يكون لديك أسئلة إضافية مثل:

  • هل سيتوقف دعم برنامج CDP من Firefox؟
  • هل جميع ميزات Puppeteer متاحة؟

للحصول على إجابات تفصيلية ومزيد من المعلومات، يمكنك الاطّلاع على الإعلان الخاص من Firefox.

أوقات ممتعة في المستقبل

لقد كان الاختبار على جميع المتصفّحات أحد أهم احتياجات المطوّرين، لذلك نحن متحمّسون لقيادة عملية دمج WebDriver BiDi في Puppeteer، ما يمثّل نقطة تحوّل نحو تجربة أتمتة أكثر سلاسة وفعالية على جميع المتصفّحات. ننصحك باستكشاف WebDriver BiDi مع Puppeteer.

بالنظر إلى المستقبل، سيصبح WebDriver BiDi هو البروتوكول التلقائي لتطبيق Puppeteer، ما يمهد الطريق لتقديم تجربة مبرمَجة متسقة وفعّالة.

بالنسبة إلى أي مشاكل تواجهها عند إجراء اختبارات Puppeteer باستخدام WebDriver BiDi، يمكنك فتح المشاكل في أداة تتبُّع مشاكل Puppeteer.