frontend-e2e-test-coverage

Identify untested user journeys and implement Playwright UI tests for frontend-backend interactions.

1|Updated Sep 6, 2024
One-click install
npx skills add https://github.com/carlos18bp/gym_project --skill frontend-e2e-test-coverage-carlos18bp
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: frontend-e2e-test-coverage
Source: https://github.com/carlos18bp/gym_project/tree/main/.agents/skills/frontend-e2e-test-coverage
Command: npx skills add https://github.com/carlos18bp/gym_project --skill frontend-e2e-test-coverage-carlos18bp

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

It solves incomplete end-to-end test coverage by helping you find which user flows are missing or only partially validated, especially the contract between the frontend UI and the backend APIs.

Core Features & Use Cases

  • Real user interactions only: Ensures tests use genuine UI behavior (clicks, navigation, form submission, file uploads) instead of shortcuts like direct API calls or DB injection.
  • Flow-based coverage targeting: Drives work using flow inventories and coverage reports to prioritize the most important gaps (auth/checkout first, then CRUD and error states).
  • Quality-gate compliant E2E specs: Enforces conventions such as flow tags, accessibility-first selectors (getByRole), fixture-based data, and avoiding time-based sleeps.

Quick Start

Ask the AI to review your existing Playwright coverage reports and propose the next missing high-priority flow tests to add so frontend and backend interactions are fully verified.

Frequently Asked Questions about frontend-e2e-test-coverage

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

FAQPage Schema
How do I increase Playwright E2E test coverage for frontend backend contracts?

Playwright E2E test coverage for frontend backend contracts is improved by identifying untested user journeys and implementing UI-driven tests for critical interactions like authentication, checkout, and CRUD operations. Coverage targets flow inventories to prioritize the most important gaps.

What is the best way to find missing user flows in Playwright E2E tests?

Finding missing user flows in Playwright E2E tests involves analyzing coverage reports and flow inventories to target partially validated paths. Prioritize authentication and checkout flows first, then address CRUD operations and edge error states to ensure frontend backend contract validation.

Do I need real user interactions for Playwright E2E testing or can I use API calls?

Real user interactions are required for Playwright E2E testing. Tests must use genuine UI behavior like clicks, navigation, and form submission instead of shortcuts like direct API calls or database injection to accurately validate frontend backend contract semantics.

What Playwright E2E testing conventions ensure quality-gate compliant specs?

Quality-gate compliant Playwright E2E specs require flow tags, accessibility-first selectors using getByRole, fixture-based data, and avoiding time-based sleeps. These conventions ensure newly added tests for frontend backend interactions are reliable and measurable.

How do I handle edge states and error cases in Playwright E2E flow coverage?

Handling edge states and error cases in Playwright E2E flow coverage requires targeting these scenarios after authentication and CRUD flows. Implement UI-driven tests using real interaction semantics and flow-tag instrumentation to validate frontend backend contract behavior during failures.

Why does my Playwright E2E test coverage report show incomplete flow validation?

Incomplete flow validation in Playwright E2E test coverage reports indicates missing UI-driven tests for contract-critical interactions. Identify untested user journeys across authentication, checkout, and integration points, then implement tests with accessibility-first selectors and fixture-based data.