使用 Selenium 進行 UI 測試

發行項
04/04/2024

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

在發行管線中執行使用者介面（UI）測試是偵測非預期變更的絕佳方式，而且不需要困難。本主題描述在持續部署發行和測試自動化期間使用 Selenium 來測試您的網站。執行UI測試時適用的特殊考慮會在UI測試考慮中討論。

一般而言，您會在組建工作流程中執行單元測試，並在您的應用程式部署至 QA 環境之後，於發行工作流程中執行功能（UI）測試。

如需 Selenium 瀏覽器自動化的詳細資訊，請參閱：

建立測試專案

由於 Selenium 測試沒有範本，開始使用最簡單的方法是使用單元測試範本。這會自動新增測試架構參考，並可讓您從Visual Studio測試總管執行和檢視結果。

在 Visual Studio 中，開啟 [ 檔案 ] 選單，然後選擇 [ 新增專案]，然後選擇 [ 測試 ]，然後選取 [ 單元測試專案]。或者，開啟方案的快捷方式功能表，然後選擇 [新增]、[新增專案] 和 [單元測試專案]。
建立項目之後，請新增瀏覽器用來執行測試的 Selenium 和瀏覽器驅動程序參考。開啟單元測試專案的快捷方式功能表，然後選擇 [ 管理 NuGet 套件]。將下列套件新增至您的專案：
- Selenium.WebDriver
- Selenium.Firefox.WebDriver
- Selenium.WebDriver.ChromeDriver
- Selenium.WebDriver.IEDriver

建立您的測試。例如，下列程式代碼會建立名為 MySeleniumTests 的預設類別，以在 Bing.com 網站上執行簡單的測試。將 TheBingSearchTest 函式的內容取代為測試 Web 應用程式或網站所需的 Selenium 程式代碼。將 SetupTest 函式中的瀏覽器指派變更為您想要用於測試的瀏覽器。

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();
    }
  }
}

使用測試總管在本機執行 Selenium 測試，並檢查它是否正常運作。

定義組建管線

您將需要持續整合（CI）建置管線來建置 Selenium 測試。如需詳細資訊，請參閱建置適用於 Windows 的 .NET 傳統型應用程式。

建立 Web 應用程式

您將需要 Web 應用程式進行測試。您可以使用現有的應用程式，或在持續部署（CD）發行管線中部署一個應用程式。上述範例程式代碼會針對 Bing.com 執行測試。如需如何設定自己的發行管線來部署 Web 應用程式的詳細資訊，請參閱部署至 Azure Web Apps。

決定您將如何部署及測試您的應用程式

您可以使用 Azure 中的 Microsoft 裝載代理程式，或您在目標伺服器上安裝的自我裝載代理程式，來部署及測試您的應用程式。

使用 Microsoft 裝載的代理程式時，您應該使用預安裝在 Windows 代理程式上的 Selenium Web 驅動程式（名為 Hosted VS 20xx 的代理程式），因為它們與安裝在 Microsoft 裝載代理程式映射上的瀏覽器版本相容。包含這些驅動程式的資料夾路徑可以從名為 IEWebDriver （Internet Explorer）、 ChromeWebDriver （Google Chrome）和 GeckoWebDriver （Firefox）的環境變數取得。驅動程式不會預安裝在其他代理程式上，例如Linux、Ubuntu和macOS代理程式。另請參閱 UI測試考慮。
使用 您在目標伺服器上部署的自我裝載代理程式 時，代理程式必須設定為以互動方式執行並啟用自動登入。請參閱建置和發行代理程式和 UI測試考慮。

在發行中包含測試

如果您沒有部署 Web 應用程式的現有發行管線：
- 在 Azure DevOps 的 [Azure Pipelines] 區段中開啟 [發行] 頁面，或在 TFS 中開啟 [建置和發行] 中樞（請參閱入口網站導覽），然後選擇+圖示，然後選擇 [建立發行管線]。
- 選取 [Azure App 服務部署範本]，然後選擇 [套用]。
- 在 [管線] 索引標籤的 [成品] 區段中，選擇 [+ 新增]。選取您的組建成品，然後選擇 [ 新增]。
- 在 [管線] 索引標籤的 [成品] 區段中，選擇 [持續部署觸發程式] 圖示。在 [持續部署觸發程式] 窗格中，啟用觸發程式，以便從每個組建建立新版本。新增預設分支的篩選。
- 開啟 [工作] 索引標籤，選取 [階段 1] 區段，然後輸入您的訂用帳戶資訊，以及您要在其中部署應用程式和測試的 Web 應用程式名稱。這些設定會套用至部署 Azure App 服務 工作。
如果您要將應用程式和測試部署到裝載代理程式的目標電腦未安裝 Visual Studio 的環境：
- 在發行管線的 [工作] 索引標籤中，選擇 + [在代理程序上執行] 區段中的圖示。 選取 Visual Studio Test Platform Installer 工作，然後選擇 [新增]。保留所有設定的預設值。
  
  您可以使用 [搜尋] 文本框，更輕鬆地找到工作。
在發行管線的 [工作] 索引標籤中，選擇 + [在代理程序上執行] 區段中的圖示。 選取 Visual Studio 測試工作，然後選擇 [新增]。
如果您將 Visual Studio Test Platform Installer 工作新增至管線，請將 Visual Studio 測試工作的 [執行選項] 區段中的 [測試平臺版本] 設定變更為 [工具安裝程式安裝]。

如何? 從組建管線將參數傳遞至我的測試程序代碼？
儲存發行管線並啟動新版本。您可以排入新的 CI 組建佇列，或從發行管線中的 [發行] 下拉式清單中選擇 [建立發行] 來執行此操作。
若要檢視測試結果，請從 [發行 ] 頁面開啟發行摘要，然後選擇 [ 測試] 連結。