Test de l’interface utilisateur avec Selenium

Azure DevOps Services | Azure DevOps Server 2022 | Azure DevOps Server 2019

L’exécution de tests d’interface utilisateur dans le cadre du pipeline de mise en production est un excellent moyen de détecter les changements inattendus, et ne devrait pas présenter de difficultés particulières. Cette rubrique décrit l’utilisation de Selenium pour tester votre site web pendant une automatisation des tests et mise en production de déploiement continu. Les considérations spéciales qui s’appliquent lors de l’exécution de tests d’interface utilisateur sont abordées dans Considérations relatives aux tests de l’interface utilisateur.

En règle générale, vous exécutez des tests unitaires dans votre flux de travail de build et des tests fonctionnels (IU) dans votre flux de travail de mise en production après le déploiement de votre application (généralement dans un environnement d’assurance qualité).

Pour plus d’informations sur l’automatisation du navigateur Selenium, consultez :

Créer votre projet de test

Comme il n’existe aucun modèle pour le test Selenium, le moyen le plus simple de commencer est d’utiliser le modèle Test unitaire. Cela ajoute automatiquement les références du framework de test, et vous permet d’exécuter et d’afficher les résultats à partir de l’Explorateur de tests Visual Studio.

  1. Dans Visual Studio, ouvrez le menu Fichier, choisissez Nouveau projet, Tester, puis sélectionnez Projet de test unitaire. Vous pouvez également ouvrir le menu contextuel de la solution et choisir Ajouter, Nouveau projet, puis Projet de test unitaire.

  2. Une fois le projet créé, ajoutez les références de pilote de navigateur et Selenium utilisées par le navigateur pour exécuter les tests. Ouvrez le menu contextuel du projet de test unitaire et choisissez Gérer les packages NuGet. Ajoutez les packages suivants à votre projet :

    • Selenium.WebDriver
    • Selenium.Firefox.WebDriver
    • Selenium.WebDriver.ChromeDriver
    • Selenium.WebDriver.IEDriver

    Ajout des packages de pilotes de navigateur à votre solution

  3. Créez vos tests. Par exemple, le code suivant crée une classe par défaut nommée MySeleniumTests qui effectue un test simple sur le site web Bing.com. Remplacez le contenu de la fonction TheBingSearchTest par le code Selenium requis pour tester votre application web ou votre site web. Remplacez l’attribution de navigateur dans la fonction SetupTest par le navigateur que vous souhaitez utiliser pour le test.

    using System;
    using System.Text;
    using Microsoft.VisualStudio.TestTools.UnitTesting;
    using OpenQA.Selenium;			
    using OpenQA.Selenium.Firefox;	
    using OpenQA.Selenium.Chrome;	
    using OpenQA.Selenium.IE;
    
    namespace SeleniumBingTests
    {
      /// <summary>
      /// Summary description for MySeleniumTests
      /// </summary>
      [TestClass]
      public class MySeleniumTests
      {
        private TestContext testContextInstance;
        private IWebDriver driver;
        private string appURL;
    
        public MySeleniumTests()
        {
        }
    
        [TestMethod]
        [TestCategory("Chrome")]
        public void TheBingSearchTest()
        {
          driver.Navigate().GoToUrl(appURL + "/");
          driver.FindElement(By.Id("sb_form_q")).SendKeys("Azure Pipelines");
          driver.FindElement(By.Id("sb_form_go")).Click();
          driver.FindElement(By.XPath("//ol[@id='b_results']/li/h2/a/strong[3]")).Click();
          Assert.IsTrue(driver.Title.Contains("Azure Pipelines"), "Verified title of the page");
        }
    
        /// <summary>
        ///Gets or sets the test context which provides
        ///information about and functionality for the current test run.
        ///</summary>
        public TestContext TestContext
        {
          get
          {
            return testContextInstance;
          }
          set
          {
            testContextInstance = value;
          }
        }
    
        [TestInitialize()]
        public void SetupTest()
        {
          appURL = "http://www.bing.com/";
    
          string browser = "Chrome";
          switch(browser)
          {
            case "Chrome":
              driver = new ChromeDriver();
              break;
            case "Firefox":
              driver = new FirefoxDriver();
              break;
            case "IE":
              driver = new InternetExplorerDriver();
              break;
            default:
              driver = new ChromeDriver();
              break;
          }
    
        }
    
        [TestCleanup()]
        public void MyTestCleanup()
        {
          driver.Quit();
        }
      }
    }
    
  4. Exécutez le test Selenium localement à l’aide de l’Explorateur de tests et vérifiez qu’il fonctionne.

Définir votre pipeline de build

Vous aurez besoin d’un pipeline de build d’intégration continue (CI) qui génère vos tests Selenium. Pour plus d’informations, consultez Créer votre application de bureau .NET pour Windows.

Créer votre application web

Vous aurez besoin d’une application web pour le test. Vous pouvez utiliser une application existante ou en déployer une dans votre pipeline de mise en production de déploiement continu (CD). L’exemple de code ci-dessus exécute des tests sur Bing.com. Pour plus d’informations sur la configuration de votre propre pipeline de mise en production pour déployer une application web, consultez Déployer sur Azure Web Apps.

Décidez comment déployer et tester votre application

Vous pouvez déployer et tester votre application à l’aide de l’agent hébergé par Microsoft dans Azure, ou d’un agent auto-hébergé que vous installez sur les serveurs cibles.

  • Lorsque vous utilisez l’agent hébergé par Microsoft, vous devez utiliser les pilotes web Selenium préinstallés sur les agents Windows (agents nommés Hosted VS 20xx), car ils sont compatibles avec les versions de navigateur installées sur les images de l’agent hébergé par Microsoft. Les chemins des dossiers contenant ces pilotes peuvent être obtenus à partir des variables d’environnement nommées IEWebDriver (Internet Explorer), ChromeWebDriver (Google Chrome) et GeckoWebDriver (Firefox). Les pilotes ne sont pas préinstallés sur d’autres agents tels que les agents Linux, Ubuntu et macOS. Consultez également Considérations relatives au test de l’interface utilisateur.

  • Lorsque vous utilisez un agent auto-hébergé que vous déployez sur vos serveurs cibles, les agents doivent être configurés pour s’exécuter de manière interactive avec ouverture de session automatique activée. Consultez Agents de build et de mise en production et Considérations relatives aux tests de l’interface utilisateur.

Inclure le test dans une mise en production

  1. Si vous n’avez pas de pipeline de mise en production existant qui déploie votre application web :

    • Ouvrez la page Mises en production de la section Azure Pipelines dans Azure DevOps ou le hub Construction et mise en production dans TFS (voir Navigation du portail web), choisissez l’icône +, puis choisissez Créer un pipeline de mise en production.

      Création d’un pipeline de mise en production

    • Sélectionnez le modèle Déploiement Azure App Service, puis choisissez Appliquer.

    • Dans la section Artefacts de l’onglet Pipeline, choisissez + Ajouter. Sélectionnez vos artefacts de build, puis choisissez Ajouter.

      Sélection des artefacts

    • Choisissez l’icône Déclencheur de déploiement continu dans la section Artefacts de l’onglet Pipeline. Dans le volet Déclencheur de déploiement continu, activez le déclencheur afin qu’une nouvelle mise en production soit créée à partir de chaque build. Ajoutez un filtre pour la branche par défaut.

      Configuration du déploiement continu

    • Ouvrez l’onglet Tâches, sélectionnez la section Phase 1, puis entrez les informations de votre abonnement et le nom de l’application web dans laquelle vous souhaitez déployer l’application et les tests. Ces paramètres sont appliqués à la tâche Déployer Azure App Service.

      Configuration des variables

  2. Si vous déployez votre application et vos tests dans des environnements où Visual Studio n’est pas installé sur les machines cibles qui hébergent les agents :

    • Sous l’onglet Tâches du pipeline de mise en production, choisissez l’icône + dans la section Exécuter sur l’agent. Sélectionnez la tâche Visual Studio Test Platform Installer, puis Ajouter. Laissez tous les paramètres à leurs valeurs par défaut.

      Ajout d’une tâche Visual Studio Test Platform Installer

      Pour faciliter la recherche de tâche, utilisez la zone de texte de recherche.

  3. Sous l’onglet Tâches du pipeline de mise en production, choisissez l’icône + dans la section Exécuter sur l’agent. Sélectionnez la tâche Visual Studio Test, puis Ajouter.

    Ajout d’une tâche Visual Studio Test

  4. Si vous avez ajouté la tâche Visual Studio Test Platform Installer à votre pipeline, modifiez le paramètre Version de la plateforme de test dans la section Options d’exécution de la tâche Visual Studio Test sur Installé par le programme d’installation des outils.

    Définition de la version de la plateforme de test

    Comment faire pour transmettre des paramètres à mon code de test à partir d’un pipeline de build ?

  5. Enregistrez le pipeline de mise en production et démarrez une nouvelle mise en production. Vous pouvez pour cela mettre en file d’attente une nouvelle build CI ou choisir Créer une mise en production dans la liste déroulante Mise en production dans le pipeline de mise en production.

    Création d’une mise en production

  6. Pour afficher les résultats des tests, ouvrez le récapitulatif de la mise en production à partir de la page Mises en production et choisissez le lien Tests.

Étapes suivantes