skills.rest
ahostbr
ahostbrCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

ls-playwright-e2e-screenshots

Generate Playwright E2E tests with phase-by-phase screenshots saved to e2e/screenshots/.

Updated Aug 5, 2026
Search Tags:#screenshots#test generation#browser automation#playwright#e2e testing#visual regression
One-click install
npx skills add https://github.com/ahostbr/liteharness --skill ls-playwright-e2e-screenshots
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ls-playwright-e2e-screenshots
Source: https://github.com/ahostbr/liteharness/tree/main/liteharness/catalog/skills/ls-playwright-e2e-screenshots
Command: npx skills add https://github.com/ahostbr/liteharness --skill ls-playwright-e2e-screenshots

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

It helps you reliably create end-to-end Playwright tests that include visual verification, so regressions in UI output are caught before the next test run.

Core Features & Use Cases

  • E2E test generation with screenshot checkpoints: Creates browser automation tests that capture verification screenshots at each phase of a flow.
  • One purpose per test: Encourages writing focused tests that verify a single thing to make failures easier to diagnose.
  • Guided review before continuing: Supports stopping to review screenshots before proceeding to the next test, improving debugging speed.
  • Workspace-oriented screenshot outputs: Uses the e2e/screenshots/ location for stored images and results.

Quick Start

Create Playwright E2E tests with visual verification by asking your agent to generate tests that take screenshots at each phase and save them under e2e/screenshots/.

Frequently Asked Questions about ls-playwright-e2e-screenshots

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

FAQPage Schema
How do I add visual regression checks to Playwright E2E tests?▼

You generate Playwright browser automation tests that capture screenshots at each workflow phase. These visual checkpoints are saved to the e2e/screenshots/ directory for review, helping you catch UI regressions before the next test run.

What is the best way to structure E2E tests for easier debugging?▼

The best way to structure E2E tests for easier debugging is to write focused tests that verify a single purpose. By capturing phase-by-phase screenshots, you can stop and review visual outputs before proceeding to the next test, improving diagnosis speed.

Do I need to install Chromium separately for Playwright screenshot tests?▼

You need to install Chromium via Playwright to execute these browser automation tests. The generated test workflow includes a note to install Chromium via Playwright so the browser environment is ready to capture visual screenshots.

Can I review screenshots during a test run before proceeding to the next step?▼

Yes, the generated tests support stopping to review phase-by-phase screenshots before proceeding to the next workflow. This guided review process allows you to inspect visual verification outputs and debug issues before continuing.

Where are Playwright E2E test screenshots stored?▼

Playwright E2E test screenshots are stored in the e2e/screenshots/ workspace directory. This workspace-oriented output location ensures all visual verification images and results from browser automation flows are organized for review.

Related Skills

Explore More Software Engineering Skills→
thktthkt
11

e2e

Generate Playwright E2E tests and documentation through guided browser interactions.

Community
Intermediate
denisvmediadenisvmedia
4

screenshot-review

Capture and review PNG screenshots of the Inventario React frontend to detect UI regressions.

Community
Intermediate
vecearvecear

visual-regression-tester

Automate visual regression testing of UI with Playwright, Chromatic, or Percy.

Community
Advanced
alvarettoalvaretto
1

Comparación Visual Inteligente

Compare generated images against originals and report visual differences.

Community
Advanced