playwright

Automate end-to-end UI tests for Blazor WebAssembly with Playwright .NET and NUnit.

Updated Aug 23, 2026
One-click install
npx skills add https://github.com/StuartF303/Sorcha --skill playwright-stuartf303
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: playwright
Source: https://github.com/StuartF303/Sorcha/tree/main/.claude/skills/playwright
Command: npx skills add https://github.com/StuartF303/Sorcha --skill playwright-stuartf303

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill provides automated end-to-end UI testing for Blazor WebAssembly applications using Playwright .NET, enabling detection of UI regressions, navigation issues, and JavaScript errors across the Aspire stack.

Core Features & Use Cases

  • End-to-end UI tests for Blazor WebAssembly with Playwright .NET and NUnit, integrated with the .NET Aspire testing framework.
  • Tests cover full application stack including services, ensuring UI flows work across environments.
  • Common testing patterns for locating elements, handling MudBlazor components, and diagnosing UI responsiveness.

Quick Start

  • Create a new Playwright test project targeting net10.0 and add dependencies: Aspire.Hosting.Testing, Microsoft.Playwright.NUnit, NUnit, and Microsoft.NET.Test.Sdk.
  • Reference Sorcha.AppHost to run tests against the Sorcha app host.
  • Build the project and install Playwright browsers using the included scripts.
  • Run tests with dotnet test tests/Sorcha.UI.E2E.Tests, with optional headed mode by setting HEADED=1 or enable PWDEBUG for debugging.

Frequently Asked Questions about playwright

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I automate end-to-end UI testing for Blazor WebAssembly applications?

End-to-end UI testing for Blazor WebAssembly uses Playwright .NET with NUnit to validate UI flows, component behavior, and navigation across your application stack. Set up a test project targeting net10.0, add Playwright.NUnit and Aspire.Hosting.Testing dependencies, then write tests against your running Sorcha AppHost to detect regressions and JavaScript errors.

Can I test MudBlazor components and responsive design with Playwright?

Yes. Playwright .NET provides locator strategies and interaction methods to test MudBlazor components, form inputs, and layout behavior. The Skill includes common patterns for element location and responsive validation, letting you verify component state and UI responsiveness across development and CI environments.

What do I need to set up Playwright UI tests for an Aspire stack?

Prerequisites include the Playwright .NET libraries, NUnit test framework, Microsoft.NET.Test.Sdk, and Aspire.Hosting.Testing. You'll also need a reference to your Sorcha.AppHost project, Playwright browser installation via included scripts, and a running AppHost instance to execute tests against.

How do I debug Playwright tests for Blazor applications?

Run tests in headed mode by setting the HEADED=1 environment variable to see the browser, or use PWDEBUG=1 to launch Playwright Inspector for step-by-step debugging. These modes help diagnose navigation issues, element-location problems, and timing failures in your UI test suite.

Does Playwright work with both development and CI environments?

Yes. Playwright tests integrate with the .NET Aspire testing framework and run across both local development and CI pipelines. Tests validate the full application stack including services, ensuring UI flows work consistently regardless of deployment context.