Puppeteer parle maintenant à Firefox ! 🎉 Attendez, n'est-ce pas déjà ? 🤔 Examinons WebDriver BiDi, le nouveau protocole de Puppeteer, et ce que ce développement passionnant implique pour le workflow d'automatisation de Firefox.
WebDriver BiDi est un nouveau protocole d'automatisation internavigateurs standardisé qui associe le meilleur de WebDriver Classic et du Chrome DevTools Protocol (CDP). Elle promet une communication bidirectionnelle, permettant une automatisation plus efficace et plus performante, ainsi qu'un contrôle précis. Vous pouvez suivre sa progression sur la feuille de route officielle.
Depuis notre précédente mise à jour, nous avons continué de collaborer étroitement avec le groupe de travail du W3C sur les outils et les tests des navigateurs. Grâce aux avancées de WebDriver BiDi, Puppeteer implémente désormais des fonctionnalités telles que la journalisation, les événements réseau et l'envoi de formulaires.
Montrez-moi le code
Le script Puppeteer suivant présente WebDriver BiDi en action, et fonctionne parfaitement avec Chrome et Firefox:
- Lancez le navigateur de votre choix avec le paramètre de protocole.
- Surveillez les messages de la console pour détecter les erreurs.
- Accédez à une page Web, définissez les dimensions de la fenêtre d'affichage et cliquez sur un bouton.
- Vérifier le contenu du texte et affirmer l'égalité
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();
Progression de WebDriver BiDi dans Puppeteer
Pour évaluer les capacités de WebDriver BiDi dans Puppeteer, nous avons utilisé la suite de tests Puppeteer complète. Bien que l'implémentation de BiDi pour Puppeteer et WebDriver soit encore en cours de développement et qu'elle ne bénéficie pas encore de toutes les fonctionnalités de Puppeteer avec Chrome et CDP, nous souhaitons vous donner une idée précise de la situation.
Firefox :
- WebDriver BiDi a atteint un niveau de qualité adapté aux tâches d'automatisation pratiques. Mozilla a transféré avec succès les tests Puppeteer pour pdf.js de Firefox et de CDP vers Firefox et WebDriver BiDi.
- Plus de 55% des tests réussissent avec WebDriver BiDi, ce qui prouve l'évolution de ses fonctionnalités.
- Plus de 82 nouveaux tests utilisent efficacement WebDriver BiDi, ce qui ouvre la voie à d'autres améliorations.
Chrome :
- Chrome atteint actuellement un taux de réussite de 68% avec WebDriver BiDi, ce qui démontre sa fiabilité. Bien que l'approche basée sur la CDP puisse être optimisée davantage, cette évolution prometteuse est prometteuse.
Certaines fonctionnalités telles que l'accès aux cookies, l'interception des requêtes réseau, des fonctionnalités d'émulation spécifiques et les autorisations sont toujours en cours de normalisation active. Elles seront intégrées à Puppeteer dès qu'elles seront prêtes. En attendant, consultez la liste complète des fonctionnalités Puppeteer compatibles avec WebDriver BiDi.
Puppeteer ne prenait-il pas en charge Firefox ?
Alors que Puppeteer proposait auparavant une compatibilité expérimentale pour Firefox en utilisant une implémentation limitée et non multinavigateur de CDP, cette solution souffrait de limites et n'était pas une solution durable.
La nouvelle implémentation expérimentale de BiDi pour Firefox et WebDriver permet de résoudre ces problèmes.
Vous vous posez peut-être d'autres questions, par exemple:
- La compatibilité CDP de Firefox sera-t-elle supprimée ?
- Toutes les fonctionnalités de Puppeteer sont-elles prises en charge ?
Pour obtenir des réponses détaillées et d'autres informations, consultez l'annonce dédiée de Firefox !
Prochaines périodes prometteuses
Les tests multinavigateurs constituent l'un des principaux besoins des développeurs. Nous sommes donc ravis de mener l'intégration de WebDriver BiDi dans Puppeteer, qui marque un tournant vers une expérience d'automatisation multinavigateur plus fluide et efficace. Nous vous encourageons à découvrir WebDriver BiDi avec Puppeteer.
À terme, WebDriver BiDi deviendra le protocole par défaut de Puppeteer, ouvrant la voie à une expérience d'automatisation cohérente et renforcée.
Si vous rencontrez des problèmes lors de l'exécution de tests Puppeteer avec WebDriver BiDi, consultez les problèmes à résoudre dans notre Issue Tracker de Puppeteer.