playwright-e2e

Drive Playwright to automate end-to-end browser tests with API mocking and diagnostic artifacts.

Updated Apr 3, 2026
One-click install
npx skills add https://github.com/strawgate/agent-skills --skill playwright-e2e-strawgate
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: playwright-e2e
Source: https://github.com/strawgate/agent-skills/tree/main/playwright-e2e
Command: npx skills add https://github.com/strawgate/agent-skills --skill playwright-e2e-strawgate

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires @playwright/test.

What problem does it solve?

This skill solves the challenge of verifying complex UI changes by automating real-browser interactions, ensuring that user-visible flows work as expected without manual clicking.

Core Features & Use Cases

  • Automated UI Testing: Drives a real browser to validate user-visible behavior, including API mocking and state assertions.
  • Diagnostic Reporting: Automatically generates screenshots, DOM snapshots, and traces upon test failure to accelerate debugging.
  • Use Case: When implementing a new feature, use this skill to mock backend API responses and verify that the frontend correctly handles success and error states in a real browser environment.

Quick Start

Use the playwright-e2e skill to run the tests located in the user-profile directory to verify the recent UI changes.

Frequently Asked Questions about playwright-e2e

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

FAQPage Schema
How do I automate end-to-end browser testing to validate UI workflows?

End-to-end browser testing validates UI workflows by driving a real browser to interact with components and verify user-visible behavior. This skill automates those interactions, applying state assertions and API mocking to ensure frontend flows work without manual clicking.

How do I mock backend API responses when testing frontend error and success states?

Mocking backend API responses during testing allows you to verify frontend handling of error and success states. This skill uses network request interception to simulate backend behaviors, ensuring your UI correctly reacts to various API states in a real browser environment.

What is the best way to debug failing end-to-end tests in a headless browser environment?

Debugging failing end-to-end tests is accelerated by generating diagnostic artifacts. This skill automatically captures screenshots, DOM snapshots, and traces upon test failure, providing the necessary visual and network context to quickly resolve headless browser execution issues.

Can I use Playwright for regression testing and state verification in web applications?

Playwright supports regression testing and state verification by automating real-browser interactions. This skill drives Playwright to validate that existing user-visible workflows remain functional and correctly assert application state after new UI changes are implemented.

Do I need the @playwright/test package to run automated UI validation tests?

The @playwright/test package is required as a dependency to run automated UI validation tests. This skill relies on it to drive headless browser execution, perform network request interception, and generate diagnostic artifacts during end-to-end testing.