Automatisation avec WebDriver BiDi désormais disponible dans BrowserStack

Matthias Rohmer
Matthias Rohmer

Au cours des trois dernières années, l'équipe d'automatisation du navigateur Chrome a collaboré avec d'autres grands fournisseurs de navigateurs et d'outils comme BrowserStack pour créer WebDriver BiDi, un nouveau protocole d'automatisation des navigateurs qui permet des workflows d'automatisation bidirectionnelles entre les navigateurs. Ces workflows n'étaient auparavant possibles qu'avec le protocole propriétaire Chrome DevTools dans les navigateurs basés sur Chromium.

Aujourd'hui marque une étape importante de cet effort commun, car WebDriver BiDi est enfin prêt à être utilisé en production par les développeurs, à commencer par BrowserStack.

Selenium et BrowserStack

Récemment, BrowserStack est devenu un partenaire de développement officiel de Selenium, un framework d'automatisation de navigateur mature et Open Source qui a également contribué à WebDriver BiDi. Ce partenariat témoigne de l'investissement continu de BrowserStack dans un écosystème de test florissant. BrowserStack emploie également plusieurs principaux responsables de Selenium.

Selenium Grid fait partie du projet Selenium. Il vous permet d'exécuter des tests sur plusieurs appareils en parallèle. Cependant, configurer une grille vous-même, acquérir et gérer des dizaines d'appareils différents, et les maintenir disponibles peut s'avérer difficile, voire impossible pour certains.

Les solutions Selenium Grid hébergées telles que BrowserStack peuvent vous aider à exécuter plus facilement vos tests sur de nombreuses plates-formes et appareils différents, sans les gérer vous-même.

WebDriver BiDi sur Selenium Grid

Selenium est basé sur la norme WebDriver (notez l'absence de BiDi), mais il est compatible expérimentalement avec WebDriver BiDi depuis un certain temps. À partir d'aujourd'hui, vous pouvez utiliser les commandes BiDi WebDriver en production sur la grille Selenium hébergée de BrowserStack.

Cela permet enfin d'utiliser des fonctionnalités telles que l'interception des requêtes, l'émulation avancée et la gestion des événements du navigateur en temps réel, et pas seulement dans Chrome, mais dans tous les navigateurs compatibles avec WebDriver BiDi.

L'exemple suivant montre comment écouter les événements de journal, à l'aide de WebDriver BiDi sur BrowserStack. Les journaux capturés sont ensuite également disponibles à l'inspection sur automate.browserstack.com:

const webdriver = require('selenium-webdriver');

// Insert credentials from https://www.browserstack.com/accounts/profile/details
const USERNAME = '<YOUR_USERNAME>';
const ACCESS_KEY = '<YOUR_ACCESS_KEY>';

(async () => {
  const driver = await (new webdriver.Builder()
    .withCapabilities({
      browserName: 'chrome',
      'bstack:options': {
        seleniumVersion: '4.22.0',
        seleniumBidi: true, // Enable WebDriver BiDi.
      },
    })
    .usingServer(
      `https://${USERNAME}:${ACCESS_KEY}@hub-cloud.browserstack.com/wd/hub`
    )
    .build());

  // Add a listener for log events.
  await driver.script().addConsoleMessageHandler((logEntry) => {
    console.log(logEntry.text);
  });

  await driver.get(
    'https://www.selenium.dev/selenium/web/bidi/logEntryAdded.html'
  );

  // Trigger a console log on the demo page.
  await driver.findElement({ id: 'consoleLog' }).click();
  await driver.quit();

  // Inspect logs on automate.browserstack.com!
})();

BrowserStack n'est que le début

L'équipe d'automatisation du navigateur Chrome félicite l'équipe BrowserStack pour le lancement de la compatibilité avec WebDriver BiDi aujourd'hui. Nous avons également hâte de voir la compatibilité avec WebDriver BiDi s'étendre à BrowserStack, à d'autres outils tels que Selenium, ainsi qu'à d'autres navigateurs principaux dans les semaines à venir.

Si cette annonce vous a donné envie de tester, mais que vous n'avez pas encore commencé votre parcours, n'hésitez pas à consulter notre cours "Learn Testing" sur web.dev.