محرك الدمى أم السيلينيوم: أيهما أفضل للأتمتة؟

أصبح الاختبار الآلي جزءًا أساسيًا من تطوير الويب الحديث. نظرًا لأن تطبيقات الويب أصبحت أكثر تعقيدًا، لم يعد اختبار كل ميزة يدويًا ممكنًا. تسمح أدوات الاختبار الآلي للمطورين بكتابة اختبارات تحاكي تفاعلات المستخدم والتحقق من أن التطبيق يعمل كما هو متوقع.

اثنان من الأدوات الأكثر شيوعًا لاختبار المتصفح الآلي هما Puppeteer وSelenium. يمكن لكليهما تشغيل المتصفح، والانتقال إلى صفحات الويب، والتفاعل مع العناصر الموجودة على الصفحة، وتقديم تأكيدات حول محتوى الصفحة. ومع ذلك، هناك بعض الاختلافات الرئيسية التي تجعل كل أداة أكثر ملاءمة لسيناريوهات اختبار معينة.

في هذا الدليل الشامل، سنقوم بمقارنة Puppeteer وSelenium لمساعدتك في تحديد الخيار المناسب لاحتياجاتك.

ما هو الدمى؟

العرائس هي مكتبة Node تم تطويرها بواسطة فريق Chrome. يوفر واجهة برمجة تطبيقات عالية المستوى للتحكم في Chrome بدون رأس عبر بروتوكول DevTools.

يعمل محرك الدمى بدون رأس بشكل افتراضي، ولكن يمكن تهيئته لتشغيل Chrome أو Chromium بالكامل (بدون مقطوعة الرأس).

بعض الملامح الرئيسية لمحرك الدمى:

• يولد لقطات الشاشة وملفات PDF للصفحات
• يزحف إلى موقع لاستخراج المحتوى
• أتمتة إرسال النموذج واختبار واجهة المستخدم وإدخال لوحة المفاتيح
• لتمكين الاختبار سريع الاستجابة من خلال ضبط مضاهاة الجهاز
• يسمح بتنفيذ متصفح جافا سكريبت
• واجهة برمجة التطبيقات (API) لأحداث المتصفح مثل سجلات التنقل ووحدة التحكم
• يدعم تثبيت التمديد

يدعم Puppeteer المتصفحات المستندة إلى Chromium فقط مثل Chrome وMicrosoft Edge. لا يعمل مع Firefox أو Safari.

ما هو السيلينيوم؟

عنصر السيلينيوم عبارة عن مجموعة مفتوحة المصدر من الأدوات لأتمتة متصفحات الويب. لقد كان موجودًا لفترة أطول من Puppeteer وله مؤيدون من بائعي متصفحات متعددين.

يدعم السيلينيوم لغات متعددة بما في ذلك Java وC# وPython وJavaScript وRuby. يمكنه أتمتة Chrome وFirefox وEdge وSafari على منصات سطح المكتب. يدعم السيلينيوم أيضًا متصفحات الأجهزة المحمولة لاختبارات Android وiOS.

مميزات السيلينيوم:

• عبر متصفح التوافق
• قدرات الاختبار المحمول
• IDE للتسجيل والتشغيل
• شبكة لتوزيع الاختبارات على أجهزة متعددة
• التكامل مع العديد من متسابقي الاختبار مثل JUnit وTestNG وMocha
• مجتمع كبير من المستخدمين عبر الصناعات

على عكس Puppeteer، لا يسمح Selenium بتنفيذ JavaScript للمتصفح أو العمل مباشرة مع DevTools.

مقارنة بناء الجملة

يستخدم Puppeteer واجهة برمجة تطبيقات موجزة تُقرأ مثل الكود الكاذب. على سبيل المثال:

// Navigate to a URL
await page.goto(‘https://www.example.com‘);

// Get an element 
const button = await page.$(‘#submit-button‘); 

// Click the button  
await button.click();

يستخدم السيلينيوم واجهة برمجة تطبيقات أكثر تفصيلاً:

// Launch browser
WebDriver driver = new ChromeDriver();

// Navigate to URL
driver.get("https://www.example.com");

// Find element
WebElement button = driver.findElement(By.id("submit-button"));

// Click element  
button.click(); 

تبدو واجهة برمجة تطبيقات Puppeteer أكثر سهولة في الاستخدام وأسهل في القراءة. يؤدي استخدام بناء الجملة غير المتزامن/الانتظار إلى تقليل تداخل رد الاتصال. بشكل عام، يتطلب Puppeteer كودًا معياريًا أقل من السيلينيوم.

إطلاق المتصفحات

لتشغيل مثيل المتصفح، يستخدم Puppeteer:

const browser = await puppeteer.launch();

مع السيلينيوم، عليك تهيئة فئة محددة من برامج التشغيل:

// Launch Chrome  
WebDriver driver = new ChromeDriver();

// Launch Firefox
WebDriver driver = new FirefoxDriver(); 

يقوم Puppeteer بتشغيل Chromium فقط، بينما يدعم Selenium متصفحات متعددة. بالنسبة للاختبار عبر المتصفحات، يعد السيلينيوم خيارًا أفضل.

تحديد موقع العناصر

يجد محرك الدمى العناصر باستخدام:

// Get element by CSS selector
const el = await page.$(‘.className‘);

// Get element by XPath  
const el = await page.$x(‘//xpath‘); 

يحدد السيلينيوم العناصر من خلال محددات مواقع WebDriver:

// Find by CSS
WebElement el = driver.findElement(By.cssSelector(".className"));

// Find by XPath
WebElement el = driver.findElement(By.xpath("//xpath"));

توفر كلتا الأداتين مجموعة واسعة من إستراتيجيات تحديد المواقع مثل المعرف والفئة والنص والتسلسل الهرمي لـ DOM. بشكل عام، اختيار العنصر واضح ومباشر في كليهما.

التفاعل مع العناصر

للتفاعل مع العناصر الموجودة على الصفحة، يستخدم محرك الدمى:

// Type into an input  
await page.type(‘#input‘, ‘Hello world‘);

// Click a button
await button.click(); 

// Select an option
await page.select(‘#dropdown‘, ‘option2‘);

رمز السيلينيوم المكافئ هو:

// Type text  
driver.findElement(By.id("input")).sendKeys("Hello world");

// Click button
button.click();

// Select option
Select dropdown = new Select(driver.findElement(By.id("dropdown")));
dropdown.selectByVisibleText("option2");

تبدو واجهة برمجة تطبيقات Puppeteer أكثر إحكاما وتعبيرا. يتطلب السيلينيوم نموذجًا معياريًا إضافيًا لبعض التفاعلات مثل اختيار القوائم المنسدلة.

صفحة الملاحة

للانتقال إلى الصفحات، يستخدم محرك الدمى:

// Navigate to URL 
await page.goto(‘https://example.com‘);

// Click a link
await page.click(‘a.page2‘); 

// Go back
await page.goBack();

وفي السيلينيوم:

// Open URL
driver.get("https://example.com");

// Click link
driver.findElement(By.cssSelector("a.page2")).click();

// Go back  
driver.navigate().back();

طرق التنقل متشابهة جدًا بين الأداتين. يقوم محرك الدمى بإزالة بعض الإسهاب حول أوامر برنامج التشغيل المتداخلة في السيلينيوم.

تنفيذ جافا سكريبت

إحدى المزايا الرئيسية لـ Puppeteer هي القدرة على تنفيذ JavaScript للمتصفح مباشرة:

// Set a cookie 
await page.evaluate(() => {
  document.cookie = "foo=bar"; 
});

// Get an element‘s text 
const text = await page.evaluate(el => el.textContent, element);

لا يوفر السيلينيوم طرقًا لتشغيل JavaScript مباشرةً. يجب عليك استخدام تقنيات الحل البديل مثل إدخال البرامج النصية في الصفحات.

في انتظار العناصر

يمكن أن تستغرق تطبيقات الويب بعض الوقت لتحميل المحتوى ديناميكيًا باستخدام JavaScript. تحتاج الاختبارات الآلية إلى الانتظار حتى تصبح العناصر جاهزة قبل التفاعل معها.

محرك الدمى يجعلك تكتب الانتظار يدويًا:

// Wait for selector to be visible
await page.waitForSelector(‘.element‘); 

// Wait for navigation to complete
await page.waitForNavigation();

يحتوي السيلينيوم على فترات انتظار صريحة وضمنية:

// Implicit wait 
driver.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS);

// Explicit wait  
WebDriverWait wait = new WebDriverWait(driver, 10);
wait.until(ExpectedConditions.visibilityOfElementLocated(By.cssSelector(".element")));

إن وجود فترات انتظار مدمجة قابلة للتكوين يجعل من السهل التعامل مع مشكلات التوقيت في السيلينيوم. يتطلب محرك الدمى انتظار البرمجة النصية يدويًا.

توليد لقطات الشاشة

يمكن لكلتا الأداتين التقاط لقطات شاشة للصفحات أثناء الاختبار.

مثال لمحرك الدمى:

// Take a screenshot 
await page.screenshot({path: ‘page.png‘});

مثال السيلينيوم:

// Capture screenshot
File screenshot = ((TakesScreenshot)driver).getScreenshotAs(OutputType.FILE);

قدرات لقطة الشاشة متشابهة جدًا. تعد واجهة برمجة تطبيقات Puppeteer أكثر وضوحًا إلى حد ما.

إنشاء ملفات PDF

بالإضافة إلى لقطات الشاشة، يمكن لـ Puppeteer إنشاء ملفات PDF للصفحات:

// Generate PDF
await page.pdf({path: ‘page.pdf‘});

هذه الميزة ليست مدمجة في السيلينيوم. ستحتاج إلى أداة مساعدة مخصصة لطباعة الصفحات إلى ملف PDF باستخدام السيلينيوم.

التعامل مع النوافذ المنبثقة

للتعامل مع التنبيهات والمطالبات والنوافذ المنبثقة للمتصفح، يوفر Puppeteer معلومات الصفحة dialog حدث:

page.on(‘dialog‘, dialog => {
  console.log(dialog.message());
  dialog.accept(); 
});

يستخدم السيلينيوم واجهة التنبيه للتفاعل مع النوافذ المنبثقة:

// Switch to alert
Alert alert = driver.switchTo().alert();  

// Get text
String text = alert.getText();

// Accept alert
alert.accept();

يمكن لكلتا الأداتين التعامل مع نوافذ JS المنبثقة أثناء التشغيل الآلي. تبدو واجهة برمجة تطبيقات السيلينيوم أكثر صقلًا للعمل مع النوافذ المنبثقة.

الاختبار الموازي

يمكن أن يؤدي إجراء الاختبارات بالتوازي إلى تسريع عملية تنفيذ الاختبار بشكل كبير.

لا يدعم محرك الدمى الاختبار الموازي بشكل مباشر. يجب عليك تنسيق التنفيذ المتوازي من خلال عداء اختبار منفصل.

تسمح شبكة السيلينيوم بتوزيع الاختبارات بالتوازي عبر أجهزة متعددة. وهذا يجعل من السهل قياس اختبارات السيلينيوم.

سجلات المتصفح

يمكن أن يكون الوصول إلى سجلات المتصفح مفيدًا لتصحيح أخطاء الاختبارات وفحص نشاط الشبكة.

يسمح Puppeteer بالتقاط وحدة تحكم المتصفح وسجلات الشبكة:

// Listen for console logs
page.on(‘console‘, msg => {
  console.log(‘Page Log:‘, msg.text()); 
}); 

// Get network request logs
const requests = browser.on(‘request‘, request => {
  request.url(); // Log URLs
});

لا يوفر السيلينيوم طرقًا للوصول مباشرة إلى سجلات المتصفح. سيتعين عليك البحث عن حلول بديلة للحصول على سجلات وحدة التحكم أو الشبكة.

محاكاة وكيل المستخدم

من المهم اختبار كيفية استجابة موقع الويب للأجهزة المختلفة ووكلاء المستخدم.

يُسهل برنامج Puppeteer انتحال سلاسل وكيل المستخدم:

await page.setUserAgent(‘Custom User Agent‘);

لا يسمح السيلينيوم بتعيين وكلاء المستخدم بشكل مباشر. قد يتطلب هذا تكوين ملفات تعريف المتصفح.

تدقيقات الأداء

يدمج محرك الدمى أدوات لتحليل أداء الصفحة:

// Audit performance 
const metrics = await page.audit({
  disableJavaScript: true // Test without JavaScript 
});

// Log metrics
metrics.totalByteWeight; // Total page weight

سوف يتطلب تدقيق الأداء جلب أدوات إضافية مع السيلينيوم. محرك الدمى يبنيها بشكل صحيح.

مقارنة التسعير

أحد الاختلافات الرئيسية بين Puppeteer وSelenium هو قيود الاستخدام التجاري.

Puppeteer مفتوح المصدر ومجاني للاستخدام. يمكنك استخدامه تجاريا دون أي قيود.

السيلينيوم مفتوح المصدر أيضًا. ومع ذلك، فإن ثنائيات Selenium WebDriver الرسمية مرخصة للاستخدام غير التجاري فقط. للاستخدام التجاري، تحتاج إلى الحصول على ترخيص من بائع السيلينيوم BrowserStack.

وهذا يمكن أن يجعل Puppeteer مفضلاً للفرق التي ترغب في استخدام حل التشغيل الآلي تجاريًا دون أي تكاليف ترخيص.

اختبار مقطوعة الرأس

يشير اختبار مقطوعة الرأس إلى تشغيل متصفح دون أي واجهة مستخدم مرئية. يوفر بيئة خفيفة الوزن للاختبار.

يقوم محرك الدمى بتشغيل Chrome في وضع بدون رأس بشكل افتراضي، مما يجعله مثاليًا للاختبار بدون رأس.

يمكن أيضًا تكوين السيلينيوم ليعمل بدون رأس باستخدام خيارات مثل:

chromeOptions.addArguments("--headless"); 

لذا فإن كلا الأداتين تسمحان باختبار بدون رأس، مع جعل محرك الدمى منها تجربة افتراضية جاهزة للاستخدام.

التكامل المستمر

يعد تكامل CI/CD أمرًا مهمًا لأتمتة تنفيذ الاختبار على تغييرات التعليمات البرمجية.

محرك الدمى من تلقاء نفسه لا يوفر أي قدرات مدمجة في CI/CD. تحتاج إلى توصيله بأدوات CI مثل Jenkins وCircleCI وما إلى ذلك.

يوفر السيلينيوم تكاملًا أصليًا مع خطوط أنابيب CI/CD عبر شبكة السيلينيوم. وهذا يسمح بتوزيع الاختبارات بسهولة على البنية التحتية لـ CI.

اختبار المحمول

بينما تركز كلتا الأداتين على اختبار الويب، توفر السيلينيوم بالإضافة إلى ذلك دعمًا للاختبار عبر الأجهزة المحمولة.

يتيح مشروع Selenium Appium أتمتة تطبيقات الهاتف المحمول الأصلية على منصات Android وiOS. لا يدعم Puppeteer اختبار تطبيقات الهاتف المحمول.

منحنى التعلم

بالنسبة للمطورين المطلعين على JavaScript وNode.js، يعد Puppeteer أمرًا بديهيًا للغاية لبدء الاستخدام. يعكس تصميم واجهة برمجة التطبيقات (API) بشكل وثيق مفاهيم DOM API.

يتمتع السيلينيوم بمنحنى تعليمي أكثر حدة حيث يتعين عليك تعلم واجهة برمجة تطبيقات WebDriver الخاصة بالسيلينيوم. لكن تجربة Java تساعد على زيادة السرعة.

بشكل عام، يعد Puppeteer أبسط وأسهل في اختياره لأولئك الذين لديهم خلفية في تطوير الويب.

قدرات التصحيح

يعد استكشاف أخطاء الاختبارات الفاشلة وإصلاحها جزءًا مهمًا من أتمتة الاختبار.

يسمح Puppeteer بتعيين نقاط التوقف وتصحيح الأخطاء مباشرة في Chrome DevTools لتصحيح الأخطاء بسهولة:

await page.pause(); // Pause execution

لا يحتوي السيلينيوم على تصحيح أخطاء مضمن. يجب عليك الاعتماد على بيانات السجل أو أدوات تصحيح الأخطاء الخارجية.

دعم المتصفح

القيد الرئيسي في Puppeteer هو أنه يدعم فقط المتصفحات المستندة إلى Chromium. لذلك لا يمكنك استخدامه للاختبار على Firefox أو Safari.

يدعم السيلينيوم متصفحات Chrome وFirefox وEdge وSafari مما يتيح إجراء اختبار حقيقي عبر المتصفحات. إذا كانت تغطية الاختبار عبر المتصفحات أولوية، فمن المرجح أن يكون السيلينيوم هو الخيار الأفضل.

مجتمع مفتوح المصدر

لقد كان السيلينيوم موجودًا منذ أكثر من عقد من الزمان ويدعمه مجتمع كبير. هناك مؤتمرات ومجموعات مستخدمين ومنتدى أسئلة وأجوبة نشط مخصص للسيلينيوم.

كمشروع أحدث، يمتلك Puppeteer مجتمعًا أصغر بكثير. لكن بيئة العمل الخاصة بالمطورين والزخم الذي تقوده Google قد يسمحان لها باللحاق بالركب بمرور الوقت.

هل يجب عليك استخدام محرك الدمى أو السيلينيوم؟

الآن بعد أن قمنا بمقارنة الأداتين، كيف يمكنك أن تقرر ما إذا كنت ستستخدم محرك الدمى أو السيلينيوم؟

فيما يلي بعض العوامل الرئيسية التي يجب مراعاتها:

• دعم المتصفح – إذا كنت بحاجة إلى اختبار متعدد المتصفحات، فإن السيلينيوم هو الخيار الأفضل. بالنسبة لاختبارات Chrome فقط، يعد Puppeteer خيارًا جيدًا.

• اختبار المحمول – يدعم السيلينيوم الويب المحمول واختبار التطبيقات الأصلية. محرك الدمى هو سطح المكتب فقط.

• التصحيح - تكامل DevTools المدمج في Puppeteer يجعل تصحيح الأخطاء أسهل.

• عبر منصة - بالنسبة لأتمتة اختبار Java وC#، يتمتع السيلينيوم بدعم أفضل. محرك الدمى يركز على JS/Node.

• نوع التطبيق - محرك الدمى مناسب تمامًا لاختبار المنتجعات الصحية وتطبيقات الويب الأصغر. يتكيف السيلينيوم بشكل أفضل مع تطبيقات المؤسسات الأكبر حجمًا مع عمليات تكامل خلفية واسعة النطاق.

• الاستخدام التجاري – يمكن للفرق التي ترغب في استخدام الأتمتة تجاريًا دون قيود الترخيص الاستفادة من محرك الدمى.

• راحة البرمجة - بالنسبة للمختبرين القادمين من خلفية DevOps وJavaScript، قد يكون لدى Puppeteer منحنى تعليمي أقل. يمكن لمستخدمي Java زيادة سرعة استخدام السيلينيوم.

• الاستثمار التراثي – إذا كان لديك بالفعل عدد كبير من اختبارات السيلينيوم، فمن المحتمل أن يكون من المنطقي الاستمرار في تحسينها بدلاً من البدء من جديد باستخدام محرك الدمى من الصفر.

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