撰寫測試

簡介

Playwright 測試很簡單，它們：

• 會執行動作，以及
• 斷言狀態是否符合預期。

在執行動作之前無需等待任何事：Playwright 會在每個動作前，自動等待各種可動作性檢查通過。

在進行檢查時也不需要處理競態條件——Playwright 的斷言旨在描述最終需要被滿足的預期條件，並會自動重試直到滿足為止。

就是這樣！這些設計讓使用者在測試中不再需要擔心易碎的逾時與競態檢查。

您將學到

• 如何撰寫第一個測試
• 如何執行動作
• 如何使用斷言
• 測試如何在隔離環境中執行
• 如何使用測試掛勾

第一個測試

請看以下範例，了解如何撰寫一個測試。

MSTest

UnitTest1.cs

using System.Text.RegularExpressions;
using System.Threading.Tasks;
using Microsoft.Playwright;
using Microsoft.Playwright.NUnit;
using NUnit.Framework;

namespace PlaywrightTests;

[Parallelizable(ParallelScope.Self)]
[TestFixture]
public class ExampleTest : PageTest
{
    [Test]
    public async Task HasTitle()
    {
        await Page.GotoAsync("https://playwright.dev");

        // 期望標題「包含」某個子字串。
        await Expect(Page).ToHaveTitleAsync(new Regex("Playwright"));
    }

    [Test]
    public async Task GetStartedLink()
    {
        await Page.GotoAsync("https://playwright.dev");

        // 點擊「Get started」連結。
        await Page.GetByRole(AriaRole.Link, new() { Name = "Get started" }).ClickAsync();

        // 期望頁面具有名稱為 Installation 的標題。
        await Expect(Page.GetByRole(AriaRole.Heading, new() { Name = "Installation" })).ToBeVisibleAsync();
    } 
}

NUnit

UnitTest1.cs

using System.Text.RegularExpressions;
using System.Threading.Tasks;
using Microsoft.Playwright;
using Microsoft.Playwright.MSTest;
using Microsoft.VisualStudio.TestTools.UnitTesting;

namespace PlaywrightTests;

[TestClass]
public class ExampleTest : PageTest
{
    [TestMethod]
    public async Task HasTitle()
    {
        await Page.GotoAsync("https://playwright.dev");

        // 期望標題「包含」某個子字串。
        await Expect(Page).ToHaveTitleAsync(new Regex("Playwright"));
    }

    [TestMethod]
    public async Task GetStartedLink()
    {
        await Page.GotoAsync("https://playwright.dev");

        // 點擊「Get started」連結。
        await Page.GetByRole(AriaRole.Link, new() { Name = "Get started" }).ClickAsync();

        // 期望頁面具有名稱為 Installation 的標題。
        await Expect(Page.GetByRole(AriaRole.Heading, new() { Name = "Installation" })).ToBeVisibleAsync();
    } 
}

xUnit

UnitTest1.cs

using System.Text.RegularExpressions;
using Microsoft.Playwright;
using Microsoft.Playwright.Xunit;

namespace PlaywrightTests;

public class UnitTest1: PageTest
{
    [Fact]
    public async Task HasTitle()
    {
        await Page.GotoAsync("https://playwright.dev");

        // 期望標題「包含」某個子字串。
        await Expect(Page).ToHaveTitleAsync(new Regex("Playwright"));
    }

    [Fact]
    public async Task GetStartedLink()
    {
        await Page.GotoAsync("https://playwright.dev");

        // 點擊「Get started」連結。
        await Page.GetByRole(AriaRole.Link, new() { Name = "Get started" }).ClickAsync();

        // 期望頁面具有名稱為 Installation 的標題。
        await Expect(Page.GetByRole(AriaRole.Heading, new() { Name = "Installation" })).ToBeVisibleAsync();
    } 
}

xUnit v3

UnitTest1.cs

using System.Text.RegularExpressions;
using Microsoft.Playwright;
using Microsoft.Playwright.Xunit.v3;

namespace PlaywrightTests;

public class UnitTest1: PageTest
{
    [Fact]
    public async Task HasTitle()
    {
        await Page.GotoAsync("https://playwright.dev");

        // 期望標題「包含」某個子字串。
        await Expect(Page).ToHaveTitleAsync(new Regex("Playwright"));
    }

    [Fact]
    public async Task GetStartedLink()
    {
        await Page.GotoAsync("https://playwright.dev");

        // 點擊「Get started」連結。
        await Page.GetByRole(AriaRole.Link, new() { Name = "Get started" }).ClickAsync();

        // 期望頁面具有名稱為 Installation 的標題。
        await Expect(Page.GetByRole(AriaRole.Heading, new() { Name = "Installation" })).ToBeVisibleAsync();
    } 
}

動作

導覽

大多數測試會先導覽到某個 URL。之後，測試就能與頁面元素互動。

await Page.GotoAsync("https://playwright.dev");

Playwright 會等待頁面達到載入狀態後再繼續。進一步了解 Page.GotoAsync() 的選項。

互動

執行動作從定位元素開始。Playwright 使用定位器 API 來達成。定位器代表一種隨時在頁面上尋找元素的方法，了解更多可用定位器的不同類型。Playwright 會在執行動作前等待元素變得可動作，因此不需要手動等待它變成可用。

// 建立一個定位器。
var getStarted = Page.GetByRole(AriaRole.Link, new() { Name = "Get started" });

// 點擊它。
await getStarted.ClickAsync();

在大多數情況下，會寫成一行：

await Page.GetByRole(AriaRole.Link, new() { Name = "Get started" }).ClickAsync();

基本動作

以下是最常見的 Playwright 動作。注意還有更多可用動作，務必查看 Locator API 以深入了解。

動作	描述
Locator.CheckAsync()	勾選核取方塊
Locator.ClickAsync()	點擊元素
Locator.UncheckAsync()	取消勾選核取方塊
Locator.HoverAsync()	將滑鼠懸停在元素上
Locator.FillAsync()	填入表單欄位、輸入文字
Locator.FocusAsync()	聚焦元素
Locator.PressAsync()	按下單一按鍵
Locator.SetInputFilesAsync()	選取要上傳的檔案
Locator.SelectOptionAsync()	在下拉選單中選擇選項

斷言

Playwright 提供名為 Expect 的非同步函式，用於斷言並等待直到預期條件被滿足。

await Expect(Page).ToHaveTitleAsync(new Regex("Playwright"));

以下是最常見的非同步斷言。請注意還有更多斷言可供使用：

斷言	描述
Expect(Locator).ToBeCheckedAsync()	核取方塊已勾選
Expect(Locator).ToBeEnabledAsync()	控制項已啟用
Expect(Locator).ToBeVisibleAsync()	元素可見
Expect(Locator).ToContainTextAsync()	元素包含文字
Expect(Locator).ToHaveAttributeAsync()	元素具有屬性
Expect(Locator).ToHaveCountAsync()	元素清單具有指定長度
Expect(Locator).ToHaveTextAsync()	元素符合文字
Expect(Locator).ToHaveValueAsync()	輸入元素具有值
Expect(Page).ToHaveTitleAsync()	頁面具有標題
Expect(Page).ToHaveURLAsync()	頁面具有 URL

測試隔離

Playwright 的 NUnit、MSTest、xUnit 與 xUnit v3 測試框架基底類別會為每個測試提供各自的 Page 實例，以相互隔離。藉由瀏覽器情境（Browser Context），頁面在測試之間彼此隔離，相當於全新的瀏覽器設定檔。即使在同一個瀏覽器中同時執行多個測試，每個測試也都會獲得乾淨的環境。

MSTest

UnitTest1.cs

using System.Threading.Tasks;
using Microsoft.Playwright.NUnit;
using NUnit.Framework;

namespace PlaywrightTests;

[Parallelizable(ParallelScope.Self)]
[TestFixture]
public class ExampleTest : PageTest
{
    [Test]
    public async Task BasicTest()
    {
        await Page.GotoAsync("https://playwright.dev");
    }
}

NUnit

UnitTest1.cs

using System.Threading.Tasks;
using Microsoft.Playwright.MSTest;
using Microsoft.VisualStudio.TestTools.UnitTesting;

namespace PlaywrightTests;

[TestClass]
public class ExampleTest : PageTest
{
    [TestMethod]
    public async Task BasicTest()
    {
        await Page.GotoAsync("https://playwright.dev");
    }
}

xUnit

UnitTest1.cs

using Microsoft.Playwright;
using Microsoft.Playwright.Xunit;

namespace PlaywrightTests;

public class UnitTest1: PageTest
{
    [Fact]
    public async Task BasicTest()
    {
        await Page.GotoAsync("https://playwright.dev");
    }
}

xUnit v3

UnitTest1.cs

using Microsoft.Playwright;
using Microsoft.Playwright.Xunit.v3;

namespace PlaywrightTests;

public class UnitTest1: PageTest
{
    [Fact]
    public async Task BasicTest()
    {
        await Page.GotoAsync("https://playwright.dev");
    }
}

使用測試掛勾

MSTest

可以使用 SetUp/TearDown 來準備並清理測試環境：

UnitTest1.cs

using System.Threading.Tasks;
using Microsoft.Playwright.NUnit;
using NUnit.Framework;

namespace PlaywrightTests;

[Parallelizable(ParallelScope.Self)]
[TestFixture]
public class ExampleTest : PageTest
{
    [Test]
    public async Task MainNavigation()
    {
        // 斷言使用 expect API。
        await Expect(Page).ToHaveURLAsync("https://playwright.dev/");
    }

    [SetUp]
    public async Task SetUp()
    {
        await Page.GotoAsync("https://playwright.dev");
    }
}

NUnit

可以使用 TestInitialize/TestCleanup 來準備並清理測試環境：

UnitTest1.cs

using System.Threading.Tasks;
using Microsoft.Playwright.MSTest;
using Microsoft.VisualStudio.TestTools.UnitTesting;

namespace PlaywrightTests;

[TestClass]
public class ExampleTest : PageTest
{
    [TestMethod]
    public async Task MainNavigation()
    {
        // 斷言使用 expect API。
        await Expect(Page).ToHaveURLAsync("https://playwright.dev/");
    }

    [TestInitialize]
    public async Task TestInitialize()
    {
        await Page.GotoAsync("https://playwright.dev");
    }
}

xUnit

可以使用 InitializeAsync/DisposeAsync 來準備並清理測試環境：

UnitTest1.cs

using Microsoft.Playwright;
using Microsoft.Playwright.Xunit;

namespace PlaywrightTests;

public class UnitTest1: PageTest
{
    [Fact]
    public async Task MainNavigation()
    {
        // 斷言使用 expect API。
        await Expect(Page).ToHaveURLAsync("https://playwright.dev/");
    }

    override public async Task InitializeAsync()
    {
        await base.InitializeAsync();
        await Page.GotoAsync("https://playwright.dev");
    }

    public override async Task DisposeAsync()
    {
        Console.WriteLine("每個測試後的清理");
        await base.DisposeAsync();
    }
}

xUnit v3

You can use InitializeAsync/DisposeAsync to prepare and clean up your test environment:

UnitTest1.cs

using Microsoft.Playwright;
using Microsoft.Playwright.Xunit.v3;

namespace PlaywrightTests;

public class UnitTest1: PageTest
{
    [Fact]
    public async Task MainNavigation()
    {
            // Assertions use the expect API.
        await Expect(Page).ToHaveURLAsync("https://playwright.dev/");
    }

    override public async Task InitializeAsync()
    {
        await base.InitializeAsync();
        await Page.GotoAsync("https://playwright.dev");
    }

    public override async Task DisposeAsync()
    {
        Console.WriteLine("每個測試後的清理");
        await base.DisposeAsync();
    }
}

接下來做什麼

• 執行單一測試、多個測試、有視窗模式
• 使用 Codegen 產生測試
• 查看測試追蹤
• 在 CI 上執行測試
• 深入了解 MSTest、NUnit、xUnit 或 xUnit v3 的基底類別