玩转浏览器自动化（9）使用 Playwright.NUnit 编写测试

在之前的章节中，我们介绍了使用 NUnit 编写测试的基本知识。在这一章中，我们将向大家介绍 Playwright 所提供的 NUnit 扩展包。这个扩展包包含了一些扩展方法，可以让编写 Playwright 测试更加简单。这些扩展方法可以在 Microsoft.Playwright.NUnit 命名空间中找到。为了使用这些扩展方法，我们需要在开发者 PowerShell 窗口运行下面的命令来安装 Microsoft.Playwright.NUnit 包：

dotnet add package Microsoft.Playwright.NUnit

现在，让我们深入了解一下如何使用 Microsoft.Playwright.NUnit 包中的扩展方法来编写 Playwright 测试。.

测试基类

Microsoft.Playwright.NUnit 提供了多个基类用于在不同级别下创建测试：

PlaywrightTest 对象为每个测试提供了一个 Playwright 实例，方便测试启动和停止多个浏览器。该对象提供了 Playwright、BrowserName 和 BrowserType 属性，分别用于获取 Playwright 实例、当前测试所使用的浏览器类型名称和浏览器类型实例。

如果需要创建浏览器实例并可以创建任意多的浏览器上下文，可以使用 BrowserTest 类。每个测试方法将获得一个浏览器实例，并可以创建任意多的浏览器上下文。每个测试方法负责清理它创建的所有浏览器上下文。

如果需要测试多页场景，可以使用 ContextTest 类。每个测试方法将获得一个浏览器上下文实例，并可以创建任意多的页面。使用 ContextTest 作为测试基类是测试需要多个选项卡的多页场景的最简单方法。

如果需要编写全功能的 Playwright 测试，可以使用 PageTest 类。每个测试方法将获得一个页面实例。使用 PageTest 作为测试基类是编写全功能 Playwright 测试的最简单方法。

下面是一个使用 PageTest 编写的测试示例，测试访问百度首页并检查标题是否正确：

[TestFixture]
public class PageTests : PageTest
{
[Test]
public async Task NavigateToBaidu_TitleIsIsCorrect()
{
await Page.GotoAsync("https://www.baidu.com");

    var title = await Page.InnerTextAsync("title");  

    Assert.That(title, Is.EqualTo("百度一下，你就知道"));  
}  
} 

断言

Playwright for NET 提供了丰富的创建断言的方便方法，这些断言将等待并重试元素，直到满足预期的条件，让测试变得更加准确和可靠。

以下是一些常用的断言方法：

• Expect(Locator).ToBeCheckedAsync(options)：判断单选/复选框是否被选中。
• Expect(Locator).ToBeDisabledAsync(options)：判断元素是否被禁用。
• Expect(Locator).ToBeEditableAsync(options)：判断元素是否可编辑。
• Expect(Locator).ToBeEmptyAsync(options)：判断元素是否为空。
• Expect(Locator).ToBeEnabledAsync(options)：判断元素是否可用。
• Expect(Locator).ToBeFocusedAsync(options)：判断元素是否获得焦点。
• Expect(Locator).ToBeHiddenAsync(options)：判断元素是否隐藏。
• Expect(Locator).ToBeVisibleAsync(options)：判断元素是否可见。
• Expect(Locator).ToContainTextAsync(expected, options)：判断元素的文本是否包含指定的文本。
• Expect(Locator).ToHaveAttributeAsync(name, value, options)：判断元素的属性是否等于指定的值。
• Expect(Locator).ToHaveClassAsync(expected, options)：判断元素是否包含指定的 class。
• Expect(Locator).ToHaveCountAsync(expected, options)：判断元素的数量是否等于指定的数量。
• Expect(Locator).ToHaveCSSAsync(name, value, options)：判断元素的 CSS 属性是否等于指定的值。
• Expect(Locator).ToHaveIdAsync(id, options)：判断元素的 Id 是否等于指定的值。
• Expect(Locator).ToHaveJSPropertyAsync(name, value, options)：判断元素的 JS 属性是否等于指定的值。 Expect(Locator).ToHaveTextAsync(expected, options)：判断元素的文本是否等于指定的值。
• Expect(Locator).ToHaveValueAsync(expected, options)：判断元素的 Value 是否等于指定的值。 Expect(Locator).ToHaveURLAsync(expected, options)：判断当前页面的 URL 是否等于指定的值。

通过使用 Playwright 的断言方法，我们可以减少测试代码的冗余和提高测试的可读性和可维护性。例如，我们可以将测试代码改为使用 Playwright 断言实现：

[TestFixture]
public class PageTests : PageTest
{
[Test]
public async Task NavigateToBaidu_TitleIsIsCorrect()
{
await Page.GotoAsync("https://www.baidu.com");

    await Expect(Page.Locator("title")).ToHaveTextAsync("百度一下，你就知道");  
}  
}

自定义测试环境

Playwright 的测试基类提供了一个默认的测试环境，但是有时候我们需要自定义测试环境，以满足我们的特殊需求，比如：

• 自定义浏览器上下文信息
• 自定义浏览器启动参数

自定义浏览器上下文信息

你可以通过重写派生的测试类的 ContextOptions 方法实现自定义浏览器上下文。

以下是一个示例，演示了如何在测试环境中设置浏览器的宽度和高度：

[TestFixture]  
public class PageTests : PageTest  
{  
    public override BrowserNewContextOptions ContextOptions()  
    {  
        return new BrowserNewContextOptions()  
        {  
            ViewportSize = new()  
            {  
                Width = 800,  
                Height = 600  
            },               
        };  
    }  
  
    [Test]  
    public async Task TestWithCustomContextOptions()  
    {  
        var clientWidth = await Page.EvaluateAsync<int>("document.body.clientWidth");  
        Assert.That(clientWidth, Is.EqualTo(800));  
  
        var clientHeight = await Page.EvaluateAsync<int>("document.body.clientHeight");  
        Assert.That(clientHeight, Is.EqualTo(600));  
    }  
}  

通过重写 ContextOptions 方法，我们可以自定义浏览器上下文的视口大小等信息。在这个例子中，我们设置了浏览器的宽度和高度，然后在测试方法中使用 JavaScript 代码获取了页面的宽度和高度，最后使用断言验证它们是否等于我们设置的值。

自定义浏览器启动参数

Playwright 的测试基类默认使用 Chromium 浏览器，但是我们也可以使用其他浏览器，比如 Firefox。为了使用 Firefox 浏览器，我们需要修改运行设置文件。Playwright 的测试基类没有提供直接重写 BrowserType 的方法，但是我们可以使用运行设置文件或直接通过命令行设置运行设置选项来覆盖浏览器/启动选项。

以下是一个示例，演示了如何使用 Firefox 浏览器： 首先，我们需要在 Visual Studio 的右侧“解决方案资源管理器”的解决方案名称上点右键，选择“添加”->“新建项”，打开“添加新项”窗口。 在“添加新项”窗口中，选择“XML 文件”，名称设为“.runsettings”，然后点击“添加”按钮。 修改“.runsettings”文件，替换为如下内容：

<?xml version="1.0" encoding="utf-8"?>  
<RunSettings>  
  <Playwright>  
    <BrowserName>firefox</BrowserName>  
    <LaunchOptions>  
      <Headless>false</Headless>  
    </LaunchOptions>  
  </Playwright>  
</RunSettings>  

在这个文件中，我们指定了使用 Firefox 浏览器，并且设置了启动参数为非无头模式。 最后，选择菜单“测试”>“配置运行设置”>“自动检测运行设置文件”。

接下来，我们可以编写测试用例来验证是否成功使用了 Firefox 浏览器。以下是一个示例：

[TestFixture]  
public class PageTests : PageTest  
{          
    [Test]  
    public async Task TestWithCustomBrowserType()  
    {  
        Assert.That(BrowserType.Name, Is.EqualTo("firefox"));  
    }  
}  

在这个例子中，我们在测试方法中使用断言验证浏览器类型是否为 Firefox。如果一切正常，我们应该能够看到测试使用了 Firefox 浏览器，并且浏览器关闭了无头模式。

总结

在本章中，我们介绍了如何使用 Playwright 测试基类来编写 Playwright 测试。但是，当测试用例数量增多时，测试代码会变得臃肿，难以维护。

在下一章中，我们将介绍如何使用 Page Object 模式来更好地编写 Playwright 测试。