develop-web-game

Automate HTML/JavaScript game testing with Playwright input bursts and visual inspection.

Updated Apr 16, 2026

Search Tags:#automation #testing #canvas #playwright #web-game #render_game_to_text #virtual-time

Ready to run

npx skills add https://github.com/duylinhdang1998/claude-template-agent --skill develop-web-game-duylinhdang1998

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: develop-web-game
Source: https://github.com/duylinhdang1998/claude-template-agent/tree/main/plugins/vfm-agent-company/skills/develop-web-game
Command: npx skills add https://github.com/duylinhdang1998/claude-template-agent --skill develop-web-game-duylinhdang1998

SYSTEM DOCUMENTATION & REQUIREMENTS

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

What problem does it solve?

This Skill provides a reliable, repeatable development and testing loop for HTML/JavaScript browser games so developers can implement small changes, run deterministic input bursts, inspect visuals and text state, and fix regressions quickly.

Core Features & Use Cases

Deterministic Playwright Client: A Playwright-based script that drives input bursts, advances virtual time, captures screenshots, and writes rendered state and console errors.
State & Visual Verification: Encourages exposing window.render_game_to_text and window.advanceTime to compare textual game state with screenshots for end-to-end validation.
Progress and Repeatability: Guidance to maintain a progress.md, use action payload references, and iterate with small deltas to avoid flaky tests.
Use Case: Automatically validate movement, combat, UI flows, and level progression by running scripted bursts and reviewing screenshots plus render_game_to_text output.

Quick Start

Run the Playwright client against your local dev server to step the game deterministically, capture screenshots, and save render_game_to_text state for inspection.

Frequently Asked Questions about develop-web-game

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

FAQPage Schema

How do I run deterministic tests for an HTML canvas web game?▼

Deterministic testing for an HTML canvas web game uses Playwright to script input bursts and advance virtual time, capturing screenshots and state text to validate gameplay without flaky timing issues.

What is render_game_to_text used for in web game testing?▼

Render_game_to_text is used in web game testing to expose a textual representation of the game state. Comparing this text output with screenshots provides end-to-end validation of movement, combat, and UI flows.

Do I need Playwright to automate web game testing and screenshot capture?▼

Yes, you need Playwright to automate web game testing and screenshot capture. A Playwright-capable environment is required to run the client, execute action payloads, and inspect rendered state and console errors.

How do I test browser-based canvas games with reproducible frame stepping?▼

You test browser-based canvas games with reproducible frame stepping by exposing window.advanceTime and using a Playwright client to advance virtual time, script input bursts, and capture exact frame states.

What are the limitations of using Playwright for web game testing?▼

Limitations of using Playwright for web game testing include the requirement for a canvas-based client that explicitly exposes window.render_game_to_text and window.advanceTime, making it incompatible with games lacking these custom inspection hooks.