write-playwright-tests

Create Playwright end-to-end and visual regression tests for the ESO Log Aggregator.

2|Updated Aug 18, 2025
One-click install
npx skills add https://github.com/ESO-Toolkit/eso-toolkit --skill write-playwright-tests
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: write-playwright-tests
Source: https://github.com/ESO-Toolkit/eso-toolkit/tree/main/.github/skills/write-playwright-tests
Command: npx skills add https://github.com/ESO-Toolkit/eso-toolkit --skill write-playwright-tests

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill streamlines the creation of reliable end-to-end and visual regression tests for the ESO Log Aggregator application, ensuring application stability and visual consistency.

Core Features & Use Cases

  • Skeleton Detection: Ensures tests wait for UI elements to fully render before taking screenshots, preventing flaky tests.
  • Data Pre-Loading: Speeds up visual tests by caching data, drastically reducing load times and improving stability.
  • Defensive & Strict Validation: Guides the creation of comprehensive tests covering both general functionality and specific data accuracy.
  • Use Case: When asked to add new end-to-end tests for a feature, use this Skill to ensure they are fast, stable, and accurately reflect the application's state.

Quick Start

Use the write-playwright-tests skill to create a new visual regression test for the damage report page.

Frequently Asked Questions about write-playwright-tests

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

FAQPage Schema
How do I write reliable Playwright visual regression tests without flaky screenshots?

Reliable Playwright visual regression tests require skeleton detection to wait for UI elements to fully render before capturing screenshots, preventing flaky tests caused by incomplete loading states.

What is the best way to speed up Playwright end-to-end test suites?

Speed up Playwright end-to-end test suites by implementing data pre-loading, which caches necessary application data to drastically reduce load times and improve overall test stability.

How does GraphQL mocking work for Playwright end-to-end tests?

GraphQL mocking in Playwright tests intercepts network requests to provide controlled, predetermined responses, allowing end-to-end tests to run independently of backend API availability and state.

Can I use this for both defensive and strict validation testing?

Yes, this supports both defensive and strict validation patterns, guiding the creation of comprehensive tests that cover general functionality and specific data accuracy for the ESO Log Aggregator.

Why do my Playwright visual tests fail intermittently during page loads?

Playwright visual tests fail intermittently when screenshots are taken before UI elements fully render; mandatory skeleton detection forces the test to wait, ensuring stable visual capture.