Front-end testen in .NET met Playwright: snel, robuust en betrouwbaar

Gebruikers verwachten soepele interfaces die altijd werken. Dat betekent dat front-end testing geen bijzaak meer is, maar een vast onderdeel van je ontwikkelproces moet zijn. In deze blog laten we zien hoe je met Playwright en .NET krachtige, herhaalbare tests schrijft inclusief installatie, testopname en integratie met xUnit.

Wat is Playwright

Playwright is een open-source testframework van Microsoft voor end-to-end browserautomatisering. Het ondersteunt Chromium, Firefox en WebKit via één uniforme API. Oorspronkelijk ontwikkeld voor Node.js, maar inmiddels ook beschikbaar voor .NET. Ideaal dus voor C#-ontwikkelaars.

Met Playwright kun je gebruikersinteracties testen alsof ze echt plaatsvinden in de browser: klikken, typen, uploads, navigaties en nog veel meer.

Waarom kiezen voor Playwright in je .NET-project?

Een paar goede redenen om Playwright te gebruiken als testtool in je .NET-stack:

• Cross-browser support. Eén codebase voor meerdere browsers;
• Volledige automatisering. Simuleer interacties van echte gebruikers;
• Headless en headed modus. Kies wat past bij je workflow (CI/CD of lokaal debuggen);
• Native .NET-ondersteuning. Via de officiële Microsoft.Playwright NuGet-package;
• Integratie met CI/CD. Werkt perfect samen met GitHub Actions, Azure DevOps en andere pipelines.

Playwright installeren in een .NET-project

Start met het opzetten van een nieuwe testapp:

dotnet new console -n PlaywrightTestApp

cd PlaywrightTestApp

dotnet add package Microsoft.Playwright

dotnet build

playwright install

Tip! “playwright install” downloadt automatisch de benodigde browserbinaries.

Je eerste front-end test in C#

Met een paar regels code test je al een webpagina:

using Microsoft.Playwright;

class Program

{

    public static async Task Main()

    {

        using var playwright = await Playwright.CreateAsync();

        var browser = await playwright.Chromium.LaunchAsync(new() { Headless = true });

        var page = await browser.NewPageAsync();

        await page.GotoAsync("https://example.com");

        var title = await page.TitleAsync();

        Console.WriteLine($"Pagina titel: {title}");

        await browser.CloseAsync();

    }

}

Test opnemen via Codegen (zonder zelf te coderen)

Een krachtige feature van Playwright is codegen: de tool neemt je handelingen op in de browser en genereert automatisch de bijbehorende C#-code.

Start codegen met:

playwright codegen --target=csharp https://jouwapplicatie.nl

Klik, typ en navigeer, en Playwrigt bouwt de test voor je:

await page.GotoAsync("https://jouwapplicatie.nl/login");

await page.FillAsync("input[name=\"gebruikersnaam\"]", "testgebruiker");

await page.FillAsync("input[name=\"wachtwoord\"]", "geheim123");

await page.ClickAsync("button:has-text(\"Inloggen\")");

Waarom dit handig is?

• Snel tests genereren;
• Leer de syntax van Playwright spelenderwijs;
• Voorkom fouten door handmatig werk te beperken.

Playwright integreren met xUnit voor echte teststructuur

Wil je Playwright combineren met een volwassen testframework? xUnit werkt perfect:

public class LoginTests

{

    [Fact]

    public async Task Login_ToontWelkomstbericht()

    {

        using var playwright = await Playwright.CreateAsync();

        var browser = await playwright.Chromium.LaunchAsync(new() { Headless = true });

        var page = await browser.NewPageAsync();

        await page.GotoAsync("https://jouwapplicatie.nl/login");

        await page.FillAsync("#gebruikersnaam", "gebruiker1");

        await page.FillAsync("#wachtwoord", "wachtwoord123");

        await page.ClickAsync("button[type=submit]");

        await page.WaitForSelectorAsync("text=Welkom, gebruiker1");

        await browser.CloseAsync();

    }

}

Deze aanpak maakt je test herbruikbaar, schaalbaar en CI-proof.

Conclusie: Playwright is een no-brainer voor .NET devs

Playwright geeft je als .NET developer alles wat je nodig hebt om front-end testing naar een hoger niveau te tillen:

• Cross-browser support;
• Volledige controle over de UI;
• Snelle setup en krachtige tooling;
• Geschikt voor CI/CD én lokale debugging.

Of je nu werkt aan een simpel formulier of een complext SPA: met Playwright test je sneller, betrouwbaarder en future-proof.