---

name: web-build description: Build the Asciicker game for web using Emscripten, diagnose web build failures, and test WebAssembly output. Leverages specialized MCP agents (Serena, Context7, Chrome DevTools) for deep analysis and debugging. allowed-tools: Bash, Read, Grep, Edit, MCP Tools (Serena, Context7, Chrome DevTools, Asciicker)

Web Build Skill

Builds the Asciicker game for web browsers using Emscripten (WebAssembly), utilizing a multi-agent approach for diagnosis and repair.

Quick Start

Attempt web build:

Copymake -f makefile_wasm

Agentic Workflow (Recommended)

Use the installed MCP servers to act as specialized sub-agents:

1. Code Analysis (Serena & Asciicker):

   • Use asciicker-dev:check_web_build_compatibility on specific files to find C++ issues.
   • Use serena to analyze complex linker errors or refactor platform-specific code.
   • Example: "Serena, analyze game.cpp and refactor the file I/O to be Emscripten compatible."

2. Documentation (Context7):

   • Use context7 to fetch the latest Emscripten or WebGL documentation if flags are unclear.
   • Example: "Context7, what are the correct linker flags for WebGL 2 in Emscripten?"

3. Runtime Debugging (Chrome DevTools):

   • Once built, start the local server and use chrome-devtools to inspect the running game.
   • Example: "Launch Chrome, open http://localhost:8000, and check the console for WASM errors."

Current Status

Phase 3 Goal: Fix web build and get game running in browser

The web build may currently fail due to:

• Platform-specific code (X11, SDL, terminal rendering)
• Missing Emscripten compatibility flags
• File I/O differences in browser environment
• OpenGL vs WebGL differences

Diagnosis Steps

1. Run Static Analysis: Use the Asciicker MCP tool to check for known issues:

   CopyUse check_web_build_compatibility on "game.cpp"
   

2. Check makefile_wasm exists:

   Copyls -la makefile_wasm
   

3. Identify compilation errors:

   Copymake -f makefile_wasm 2>&1 | tee web_build_errors.log
   

Makefile Configuration

Web build typically needs:

CopyCC = emcc
CXX = em++
LD = em++

CPPFLAGS = -DWASM -DUSE_SDL -O3
LDFLAGS = -s WASM=1 \
          -s USE_SDL=2 \
          -s ALLOW_MEMORY_GROWTH=1 \
          -s FULL_ES3=1 \
          -s TOTAL_MEMORY=256MB \
          --preload-file assets@/

Code Compatibility Issues

Platform-specific code to fix:

1. Terminal rendering (term.cpp, x11.cpp):

   • Not available in browser
   • Wrap with #ifndef WASM

2. File I/O:

   • Use Emscripten virtual filesystem
   • Preload assets with --preload-file

3. OpenGL:

   • WebGL 2.0 compatible
   • Some extensions may not work

4. Threading:

   • Web Workers for threads
   • May need different approach

Testing Web Build

After successful build:

Copy# Output: game.html, game.js, game.wasm, game.data

# Serve locally
python3 -m http.server 8000

Then use Chrome DevTools MCP:

1. Ensure Chrome is running with --remote-debugging-port=9222
2. Ask Claude: "Open localhost:8000 in Chrome and check for console errors."

Instructions

When the user asks to build for web:

1. Leverage MCP Tools: immediately check if check_web_build_compatibility or serena are available to analyze the codebase.
2. Check if makefile_wasm exists.
3. Attempt build and capture errors.
4. If errors occur:
   • Use Context7 to look up specific Emscripten error codes.
   • Use Serena to propose code fixes for platform incompatibilities.
5. If build succeeds but fails in browser:
   • Use Chrome DevTools to capture runtime exceptions.

Related Files

• makefile_wasm - Web build makefile (may need creation)
• game_app.cpp - Main game file (may need WASM ifdefs)
• term.cpp, x11.cpp - Platform-specific (disable for web)
• Asset files - Need to be preloaded

Phase 3 Tasks

• Diagnose web build failure points (Use MCP tools)
• Create/fix makefile_wasm
• Add WASM compatibility ifdefs (Use Serena)
• Test basic web build
• Fix asset loading for web
• Test in browser (Use Chrome DevTools)