skills.rest
marcusta
marcustaCOMMUNITY
Explore all skills by this author →
GitHub

e2e-testing

Automate Playwright end-to-end tests for user flows and forms.

Updated May 25, 2025
Search Tags:#automation#e2e#playwright#data-testid#frontend-testing#page-object-model#testing-patterns
One-click install
npx skills add https://github.com/marcusta/golf-serie --skill e2e-testing-marcusta
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: e2e-testing
Source: https://github.com/marcusta/golf-serie/tree/main/.claude/skills/e2e-testing
Command: npx skills add https://github.com/marcusta/golf-serie --skill e2e-testing-marcusta

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Automates the creation and maintenance of robust end-to-end tests for modern frontend applications, reducing flaky tests and manual QA effort.

Core Features & Use Cases

  • Page Object Model patterns that promote reusable, readable test steps.
  • Playwright-based tests for common user flows, navigation, forms, and mobile responsiveness.
  • Selector discipline using data-testid attributes for stable selectors.
  • Async handling and retries leveraging Playwright’s built-in capabilities.

Quick Start

Install dependencies and run the Playwright test suite to validate frontend user flows

Frequently Asked Questions about e2e-testing

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

FAQPage Schema
How do I write Playwright E2E tests that don't break when the UI changes?▼

Playwright E2E tests stay stable by using data-testid attributes for selectors instead of CSS or XPath. This selector discipline isolates tests from styling changes and ensures reliable frontend automation.

What is the Page Object Model pattern in frontend testing?▼

The Page Object Model pattern structures frontend tests into reusable, readable components. It encapsulates page elements and navigation flows, reducing duplicate code and making test maintenance significantly easier.

How do I handle async operations and flaky UI interactions in Playwright?▼

Handle async operations and flaky UI interactions in Playwright by leveraging its built-in async handling and automatic retries. This automatically waits for elements to be ready before interacting, eliminating manual sleep calls.

Can I use Playwright to test mobile responsiveness for web apps?▼

You can test mobile responsiveness across modern web apps using Playwright. The framework simulates mobile viewports and touch events, allowing you to validate responsive layouts and user flows within a single test suite.

Do I need data-testid attributes to run Playwright frontend tests?▼

While not strictly required, using data-testid attributes is highly recommended for Playwright frontend tests. This selector strategy prevents tests from breaking when class names or DOM structures change during development.

What's the best way to structure automated user flow tests for forms and navigation?▼

The best way to structure automated tests for user flows, forms, and navigation is combining Playwright test structure with Page Object Model patterns. This creates reusable test components and reliable end-to-end automation.

Related Skills

Explore More Software Engineering Skills→
valithedgevalithedge

appbuilder-e2e-testing

Generate Playwright E2E tests for App Builder SPAs and AEM extensions.

Community
Advanced
xxihxxih
1

e2e-testing

Execute Playwright web app tests and generate HTML reports with CI/CD compatibility.

Community
Advanced
hopeoverturehopeoverture
6

github-actions-ci-workflow

Generate GitHub Actions CI/CD workflows for web apps with lint, test, build, and deploy pipelines.

Community
Advanced
Camilo8902Camilo8902

e2e-test-builder

Generate Playwright or Cypress end-to-end tests for critical user flows.

Community
Advanced