PlaywrightContrib.PageObjects 2.0.0

PlaywrightContrib.PageObjects 🎭🧪

PlaywrightContrib.PageObjects is a library for writing browser tests using the page object pattern with the Playwright API.

using FluentAssertions;
using Microsoft.Playwright;
using PlaywrightContrib.FluentAssertions;
using PlaywrightContrib.PageObjects;
using System.Threading.Tasks;

var playwright = await Playwright.CreateAsync();
var browser = await playwright.Chromium.LaunchAsync();
var page = await browser.NewPageAsync();

var repoPage = await page.GotoAsync<GitHubRepoPage>("https://github.com/microsoft/playwright-dotnet");
var link = await repoPage.Link;
await link.Should().HaveContentAsync("playwright-dotnet");
await link.Should().HaveAttributeValueAsync("href", "/microsoft/playwright-dotnet");

var actionsPage = await repoPage.GotoActionsAsync();
var latestStatus = await actionsPage.GetLatestWorkflowRunStatusAsync();
latestStatus.Should().Be("This workflow run completed successfully.");

public class GitHubRepoPage : PageObject
{
    [Selector("#repository-container-header strong a")]
    public virtual Task<IElementHandle> Link { get; }

    [Selector("#actions-tab")]
    public virtual Task<IElementHandle> Actions { get; }

    public async Task<GitHubActionsPage> GotoActionsAsync()
    {
        await (await Actions).ClickAsync();
        return await Page.WaitForNavigationAsync<GitHubActionsPage>();
    }
}

public class GitHubActionsPage : PageObject
{
    public async Task<string> GetLatestWorkflowRunStatusAsync()
    {
        var status = await Page.QuerySelectorAsync("#partial-actions-workflow-runs .Box-row div[title]");
        return await status.GetAttributeAsync("title");
    }
}

Deprecation ⚠️

This package is legacy and is no longer maintained:

• Is is based on the IElementHandle interface and was first built with version 1.12.1 of Microsoft.Playwright
• The use of ElementHandle is discouraged, use Locator objects and web-first assertions instead
• The Locator API was introduced in version 1.14 of Microsoft.Playwright
• Locator vs ElementHandle describes the difference between the old and new way to access elements
• You can use the vanilla API to achieve the same thing without using this package:
  • Page Object Models

Page Objects

A page object wraps an IPage and should encapsulate the way tests interact with a web page.

Create page objects by inheriting PageObject and declare properties decorated with [Selector] attributes.

public class GitHubStartPage : PageObject
{
    [Selector("h1")]
    public virtual Task<IElementHandle> Heading { get; }

    [Selector("header")]
    public virtual Task<GitHubHeader> Header { get; }

    public async Task<GitHubSearchPage> SearchAsync(string text)
    {
        await (await Header).SearchAsync(text);
        return Page.To<GitHubSearchPage>();
    }
}

Element Objects

An element object wraps an IElementHandle and should encapsulate the way tests interact with an element of a web page.

Create element objects by inheriting ElementObject and declare properties decorated with [Selector] attributes.

public class GitHubHeader : ElementObject
{
    [Selector("input.header-search-input")]
    public virtual Task<IElementHandle> SearchInput { get; }

    [Selector(".octicon-three-bars")]
    public virtual Task<IElementHandle> ThreeBars { get; }

    public async Task SearchAsync(string text)
    {
        var input = await SearchInput;
        if (await input.IsHiddenAsync()) await (await ThreeBars).ClickAsync();
        await input.TypeAsync(text);
        await input.PressAsync("Enter");
    }
}

Selector Attributes

[Selector] attributes can be applied to properties on a PageObject or ElementObject.

Properties decorated with a [Selector] attribute must be a:

• public
• virtual
• asynchronous
• getter

that returns one of:

• Task<IElementHandle>
• Task<IReadOnlyList<IElementHandle>>
• Task<ElementObject>
• Task<IReadOnlyList<ElementObject>>

Example:

[Selector("#foo")]
public virtual Task<IElementHandle> SelectorForElementHandle { get; }

[Selector(".bar")]
public virtual Task<IReadOnlyList<IElementHandle>> SelectorForElementHandleList { get; }

[Selector("#foo")]
public virtual Task<FooElementObject> SelectorForElementObject { get; }

[Selector(".bar")]
public virtual Task<IReadOnlyList<BarElementObject>> SelectorForElementObjectList { get; }

Extensions for IPage 📄

Where T is a PageObject:

• GoToAsync<T>
• RunAndWaitForNavigationAsync<T>
• RunAndWaitForResponseAsync<T>
• To<T>
• WaitForNavigationAsync<T>
• WaitForResponseAsync<T>

Where T is an ElementObject:

• QuerySelectorAllAsync<T>
• QuerySelectorAsync<T>
• WaitForSelectorAsync<T>

Extensions for IElementHandle 📑

Where T is an ElementObject:

• To<T>
• QuerySelectorAllAsync<T>
• QuerySelectorAsync<T>
• WaitForSelectorAsync<T>

Would you like to know more? 🤔

Further documentation is available at https://github.com/hlaueriksson/playwright-dotnet-contrib