skills.rest
DYAI2025
DYAI2025COMMUNITY
Explore all skills by this author →
GitHub

webapp-testing

Automate local web app testing with Playwright and capture debugging artifacts.

3|Updated Oct 18, 2025
One-click install
npx skills add https://github.com/DYAI2025/Stoppclock-page --skill webapp-testing
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: webapp-testing
Source: https://github.com/DYAI2025/Stoppclock-page/tree/main/stoppclock_speckit/.claude/commands/SKILL (5).md
Command: npx skills add https://github.com/DYAI2025/Stoppclock-page --skill webapp-testing

SYSTEM DOCUMENTATION & REQUIREMENTS

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

What problem does it solve?

This Skill provides a robust toolkit for interacting with and testing local web applications, eliminating manual UI testing and debugging. It leverages Playwright to automate frontend functionality verification, capture screenshots, and view browser logs, saving significant time on QA.

Core Features & Use Cases

  • Playwright Automation: Write native Python Playwright scripts for comprehensive web app testing.
  • Server Lifecycle Management: Use with_server.py to automatically start and stop local development servers.
  • Reconnaissance-Then-Action: Inspect rendered DOM, identify selectors, and execute actions reliably.
  • Use Case: Automate end-to-end tests for a new web application, ensuring all UI interactions, data submissions, and page navigations work as expected across different browsers.

Quick Start

Example: Using with_server.py to run a test

python scripts/with_server.py --server "npm run dev" --port 5173 -- python your_automation.py

Example: your_automation.py content

from playwright.sync_api import sync_playwright

with sync_playwright() as p:

browser = p.chromium.launch(headless=True)

page = browser.new_page()

page.goto('http://localhost:5173')

page.wait_for_load_state('networkidle')

# ... your automation logic

browser.close()

Frequently Asked Questions about webapp-testing

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

FAQPage Schema
How do I automate testing of a local web application with Playwright?▼

Automate web app testing by writing Python Playwright scripts to launch Chromium, navigate to your local server, wait for pages to load, interact with UI elements, and capture screenshots or console logs. Use the `with_server.py` helper to manage server lifecycle automatically during test execution.

Can I test both static HTML and dynamic single-page applications with Playwright?▼

Yes, Playwright automation works with static HTML files and dynamic web apps including single-page and multi-server setups. The Skill supports reconnaissance workflows to inspect the DOM, discover selectors, and execute reliable interactions across different application types.

How do I start a development server and run automated tests together?▼

Use the `with_server.py` script with the `--server` and `--port` flags to launch your dev server, then execute your Playwright test script. This manages server startup and cleanup automatically, eliminating manual server management during test runs.

What's the best way to debug UI behavior in automated tests?▼

Capture screenshots at key test steps, inspect browser console logs, and use Playwright's selector discovery to verify that UI interactions occur as expected. The Skill provides helper scripts and reconnaissance patterns to identify failing interactions and debug frontend functionality.

Do I need to write separate test scripts for different browsers?▼

Playwright abstracts browser differences into a unified API. Write your test once in Python and Playwright handles interaction with Chromium; you can extend to other browsers by configuring the browser launch parameters without rewriting test logic.

Can I capture screenshots and logs automatically during test execution?▼

Yes, use Playwright's screenshot and console logging APIs within your Python automation scripts. The Skill supports capturing visual debugging artifacts and browser console output at any point during test execution for artifact collection and QA analysis.

Related Skills

superchordatesuperchordate

nextjs-testing

Set up Jest and React Testing Library for Next.js component and API route tests.

Community
Intermediate
CarbeneAICarbeneAI
9

canary

Monitor production web apps for console errors, performance regressions, and page failures.

Community
Advanced
sennett-lausennett-lau

setup-browser-cookies

Import Chromium browser cookies into a headless Playwright session.

Community
Intermediate
williamzujkowskiwilliamzujkowski
17

e2e-testing

Automate end-to-end web app testing with Playwright or Cypress in CI/CD pipelines.

Community
Intermediate