Share via

UI test with Selenium (UI-test met Selenium)

  • Artikel

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

Het uitvoeren van gebruikersinterfacetests als onderdeel van de release-pijplijn is een uitstekende manier om onverwachte wijzigingen te detecteren en hoeft niet moeilijk te zijn. In dit artikel wordt beschreven hoe u Selenium gebruikt om uw website te testen tijdens een continue implementatierelease en testautomatisering. Speciale overwegingen die van toepassing zijn bij het uitvoeren van UI-tests, worden besproken in overwegingen bij het testen van de gebruikersinterface.

Normaal gesproken voert u eenheidstests uit in uw buildwerkstroom en functionele (UI)-tests in uw releasewerkstroom nadat uw app is geïmplementeerd (meestal in een QA-omgeving).

Zie voor meer informatie over Selenium-browserautomatisering:

Uw testproject maken

Omdat er geen sjabloon is voor Selenium-tests, is de eenvoudigste manier om aan de slag te gaan met het gebruik van de moduletestsjabloon. Hiermee worden automatisch de testframeworkverwijzingen toegevoegd en kunt u de resultaten uitvoeren en bekijken vanuit Visual Studio Test Explorer.

  1. Open in Visual Studio het menu Bestand en kies Nieuw project, kies Vervolgens Test en selecteer Eenheidstestproject. U kunt ook het snelmenu voor de oplossing openen en vervolgens Nieuw project toevoegen en vervolgens Eenheidstestproject kiezen.

  2. Nadat het project is gemaakt, voegt u de verwijzingen van het Selenium- en browserstuurprogramma toe die door de browser worden gebruikt om de tests uit te voeren. Open het snelmenu voor het eenheidstestproject en kies NuGet-pakketten beheren. Voeg de volgende pakketten toe aan uw project:

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

    De stuurprogrammapakketten van de browser toevoegen aan uw oplossing

  3. Maak uw tests. Met de volgende code wordt bijvoorbeeld een standaardklasse gemaakt met de naam MySeleniumTests die een eenvoudige test uitvoert op de Bing.com website. Vervang de inhoud van de functie TheBingSearchTest door de Selenium-code die is vereist om uw web-app of website te testen. Wijzig de browsertoewijzing in de functie SetupTest in de browser die u voor de test wilt gebruiken.

    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. Voer de Selenium-test lokaal uit met Test Explorer en controleer of deze werkt.

Uw build-pijplijn definiëren

U hebt een build-pijplijn voor continue integratie (CI) nodig waarmee uw Selenium-tests worden gebouwd. Zie Uw .NET-bureaublad-app bouwen voor Windows voor meer informatie.

Uw web-app maken

U hebt een web-app nodig om te testen. U kunt een bestaande app gebruiken of een app implementeren in uw cd-releasepijplijn (continue implementatie). In het vorige codevoorbeeld worden tests uitgevoerd op Bing.com. Zie Implementeren in Azure Web Apps voor meer informatie over het instellen van uw eigen release-pijplijn voor het implementeren van een web-app.

Bepalen hoe u uw app implementeert en test

U kunt uw app implementeren en testen met behulp van de door Microsoft gehoste agent in Azure of een zelf-hostende agent die u op de doelservers installeert.

  • Wanneer u de door Microsoft gehoste agent gebruikt, moet u de Selenium-webstuurprogramma's gebruiken die vooraf zijn geïnstalleerd op de Windows-agents (agents met de naam Hosted VS 20xx), omdat deze compatibel zijn met de browserversies die zijn geïnstalleerd op de door Microsoft gehoste agentinstallatiekopieën. De paden naar de mappen met deze stuurprogramma's kunnen worden verkregen uit de omgevingsvariabelen met de naam IEWebDriver (Internet Explorer), ChromeWebDriver (Google Chrome) en GeckoWebDriver (Firefox). De stuurprogramma's zijn niet vooraf geïnstalleerd op andere agents, zoals Linux-, Ubuntu- en macOS-agents. Zie ook overwegingen voor het testen van de gebruikersinterface.

  • Wanneer u een zelf-hostende agent gebruikt die u op uw doelservers implementeert, moeten agents worden geconfigureerd om interactief te worden uitgevoerd met autologon ingeschakeld. Zie overwegingen voor het testen van build- en releaseagents en gebruikersinterfaces.

De test opnemen in een release

  1. Als u geen bestaande release-pijplijn hebt waarmee uw web-app wordt geïmplementeerd:

    • Open de pagina Releases in de sectie Azure Pipelines in Azure DevOps of de Build & Release Hub in TFS (zie de navigatie van de webportal) en kies het + pictogram en kies vervolgens Release-pijplijn maken.

      Een nieuwe release-pijplijn maken

    • Selecteer de sjabloon Azure-app Service-implementatie en kies Toepassen.

    • Kies + Toevoegen in de sectie Artefacten van het tabblad Pijplijn. Selecteer uw buildartefacten en kies Toevoegen.

      De artefacten selecteren

    • Kies het pictogram Continue implementatietrigger in de sectie Artefacten van het tabblad Pijplijn . Schakel in het deelvenster Continue implementatietrigger de trigger in, zodat er vanuit elke build een nieuwe release wordt gemaakt. Voeg een filter toe voor de standaardbranch.

      Continue implementatie configureren

    • Open het tabblad Taken , selecteer de sectie Fase 1 en voer uw abonnementsgegevens en de naam in van de web-app waar u de app en tests wilt implementeren. Deze instellingen worden toegepast op de taak Implementeren Azure-app Service.

      De variabelen configureren

  2. Als u uw app implementeert en test naar omgevingen waar de doelcomputers waarop de agents worden gehost, geen Visual Studio hebben geïnstalleerd:

    • Kies op het tabblad Taken van de release-pijplijn het + pictogram in de sectie Uitvoeren op agent . Selecteer de taak Visual Studio Test Platform Installer en kies Toevoegen. Laat alle instellingen op de standaardwaarden staan.

      Een Visual Studio Test Platform Installer-taak toevoegen

      U kunt een taak gemakkelijker vinden met behulp van het zoektekstvak.

  3. Kies op het tabblad Taken van de release-pijplijn het + pictogram in de sectie Uitvoeren op agent . Selecteer de Visual Studio Test-taak en kies Toevoegen.

    Een Visual Studio-testtaak toevoegen

  4. Als u de taak Visual Studio Test Platform Installer aan uw pijplijn hebt toegevoegd, wijzigt u de instelling voor de versie van het testplatform in de sectie Uitvoeringsopties van de Visual Studio Test-taak in Geïnstalleerd door hulpprogramma's.

    De testplatformversie instellen

    Hoe kan ik parameters doorgeven aan mijn testcode vanuit een build-pijplijn?

  5. Sla de release-pijplijn op en start een nieuwe release. U kunt dit doen door een nieuwe CI-build in de wachtrij te plaatsen of door Release maken te kiezen in de vervolgkeuzelijst Release in de release-pijplijn.

    Een nieuwe release maken

  6. Als u de testresultaten wilt bekijken, opent u het releaseoverzicht op de pagina Releases en kiest u de koppeling Tests .

Volgende stappen

Testresultaten bekijken