develop-web-game

Run Playwright tests with virtual time stepping for HTML/JS web games.

Updated Mar 7, 2026
One-click install
npx skills add https://github.com/shalevamin/The-_Ultimate_agents --skill develop-web-game-shalevamin
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: develop-web-game
Source: https://github.com/shalevamin/The-_Ultimate_agents/tree/main/.claude/skills/develop-web-game
Command: npx skills add https://github.com/shalevamin/The-_Ultimate_agents --skill develop-web-game-shalevamin

SYSTEM DOCUMENTATION & REQUIREMENTS

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

What problem does it solve?

This Skill streamlines the development of web games by providing a robust loop for implementing small changes, running automated tests with Playwright, and inspecting visual and textual feedback.

Core Features & Use Cases

  • Iterative Development: Implement changes in small, manageable steps.
  • Automated Testing: Utilize Playwright for deterministic testing, including virtual time stepping and screenshot capture.
  • State Inspection: Review game state via render_game_to_text and visual screenshots.
  • Use Case: Develop a new enemy behavior in a 2D platformer, implement the logic, run the Playwright script to test its movement and interaction, review the resulting screenshot and console logs, and iterate until the behavior is correct.

Quick Start

Use the develop-web-game skill to run the Playwright test script against http://localhost:5173 with the provided action payloads.

Frequently Asked Questions about develop-web-game

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

FAQPage Schema
How do I automate testing for an HTML5 web game using Playwright?

Automate web game testing by integrating a Playwright-based loop with virtual time stepping and state inspection, allowing you to run deterministic tests and capture screenshots against your local development server.

How do I control frame advancement and inspect state during web game testing?

Control frame advancement during web game testing by implementing the `window.advanceTime` function, and inspect game state by exposing `window.render_game_to_text` to output textual feedback alongside visual screenshots.

Does web game testing with Playwright require a specific HTML structure?

Web game testing with Playwright requires a canvas element for visual rendering, alongside the `window.render_game_to_text` and `window.advanceTime` functions to facilitate deterministic state inspection and virtual time control.

What is the best way to debug deterministic implementation issues in JavaScript games?

Debug deterministic implementation issues in JavaScript games by implementing small iterative changes, running automated Playwright tests, and reviewing the resulting visual screenshots and console logs until the behavior is correct.

Can I use this automated testing loop for a 2D platformer game?

You can use this automated testing loop for a 2D platformer by implementing new enemy behaviors, executing the Playwright script to test movement interactions, and iterating based on the captured screenshots and state logs.

Why are my Playwright tests failing to advance time in my web game?

Playwright tests fail to advance time in web games if the required `window.advanceTime` function is missing, which is necessary for controlled frame advancement and deterministic virtual time stepping during the test loop.