WebDriver BiDi'nin gücünden yararlanın: Puppeteer ile Chrome ve Firefox otomasyonu

Puppeteer artık Firefox ile konuşabiliyor. 🎉 Ama bu zaten olmadı mı? 🤔 Puppeteer'daki yeni protokol olan WebDriver BiDi'yi inceleyelim ve bu heyecan verici gelişmenin Firefox otomasyon iş akışı için ne anlama geldiğini keşfedelim.

WebDriver BiDi, WebDriver Classic ve Chrome Geliştirici Araçları Protokolü'nün (CDP) en iyi özelliklerini birleştiren yeni bir standartlaştırılmış tarayıcılar arası otomasyon protokolüdür. İki yönlü iletişim sunarak daha verimli ve daha yetenekli otomasyon ve ayrıntılı kontrol sağlar. İlerleme durumunu resmi yol haritasından takip edebilirsiniz.

Önceki durum güncellememizden bu yana W3C Tarayıcı Testi ve Araçları Çalışma Grubu ile yakın bir şekilde çalışmaya devam ettik. Puppeteer, WebDriver BiDi'deki gelişmeler sayesinde artık günlüğe kaydetme, ağ etkinlikleri ve form gönderimleri gibi özellikleri uygulayabiliyor.

Kodu göster

Aşağıdaki Puppeteer komut dosyası, WebDriver BiDi'yi iş başında gösterir ve Chrome ile Firefox'ta sorunsuz bir şekilde çalışır:

  1. Protokol ayarıyla seçtiğiniz tarayıcıyı başlatın.
  2. Hatalar için konsol mesajlarını izleyin.
  3. Bir web sayfasına gidin, görüntü alanı boyutlarını ayarlayın ve bir düğmeyi tıklayın.
  4. Metin içeriğini doğrulayın ve eşitliği doğrulayın.
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'da WebDriver BiDi'nin ilerleme durumu

Puppeteer'da WebDriver BiDi'nin yeteneklerini ölçmek için kapsamlı Puppeteer test paketini kullandık. Puppeteer ve WebDriver BiDi uygulaması hâlâ geliştirme aşamasında olduğundan ve Chrome ile CDP'de Puppeteer'ın tüm özelliklerine henüz sahip olmadığından, mevcut durumun net bir resmini size sunmak istiyoruz.

Firefox:

  • WebDriver BiDi, pratik otomasyon görevleri için uygun bir kalite düzeyine ulaştı. Mozilla, pdf.js için Puppeteer testlerini Firefox ve CDP'den Firefox ve WebDriver BiDi'ye başarıyla taşımıştır.
  • Testlerin% 55'inden fazlası WebDriver BiDi ile başarıyla geçiyor. Bu da işlevinin arttığını gösteriyor.
  • 82'den fazla yeni testin WebDriver BiDi'yi verimli bir şekilde kullanması, daha fazla iyileştirmenin önünü açtı.

Chrome:

  • Chrome şu anda WebDriver BiDi ile% 68'lik bir başarı oranı elde ederek güvenilir işlevsellik sergilemektedir. CDP tabanlı yaklaşıma kıyasla daha fazla optimizasyona yer olsa da bu, gelecekte heyecan verici gelişmelerin habercisi.

Çerez erişimi, ağ isteği müdahalesi, belirli emülasyon özellikleri ve izinler gibi belirli özellikler hâlâ aktif standartlaştırma sürecindedir. Hazır olduklarında Puppeteer'a entegre edilecekler. Bu sırada, WebDriver BiDi tarafından desteklenen Puppeteer özelliklerinin tam listesine göz atın.

Puppeteer zaten Firefox'u desteklemiyor muydu?

Puppeteer, daha önce CDP'nin sınırlı ve tarayıcılar arası olmayan bir uygulamasını kullanarak Firefox için deneysel destek sunuyordu. Ancak bu destek, sınırlamalara sahipti ve sürdürülebilir bir çözüm değildi.

Yeni deneysel Firefox ve WebDriver BiDi uygulaması bu sorunları giderir.

Aşağıdaki gibi başka sorularınız olabileceğinin farkındayız:

  • Firefox'un CDP desteği kaldırılıyor mu?
  • Tüm Puppeteer özellikleri desteklenir mi?

Ayrıntılı yanıtlar ve daha fazla bilgi için Firefox'un özel duyurusuna göz atın.

Heyecan verici günler bizi bekliyor

Tarayıcılar arası test, geliştiricilerin en önemli ihtiyaçlarından biri olmuştur. Bu yüzden, WebDriver BiDi'nin Puppeteer'a entegre edilmesine yardımcı olmaktan heyecan duyuyoruz. Bu, daha sorunsuz ve verimli bir tarayıcılar arası otomasyon deneyimine yönelik bir dönüm noktasıdır. Puppeteer ile WebDriver BiDi'yi keşfetmenizi öneririz.

Gelecekte WebDriver BiDi, tutarlı ve güçlü bir otomasyon deneyiminin yolunu açarak Puppeteer için varsayılan protokol haline gelecek.

WebDriver BiDi ile Puppeteer testleri çalıştırırken karşılaştığınız sorunlar için Puppeteer sorun izleyicimizde sorun kaydı açın.