debug-chrome

name	debug-chrome
description	Launch or restart AlgeBench, open it in Chrome browser tools, and debug UI behavior with console, DOM, screenshots, and interactions.
args	[action=<stop|restart>]

Debug AlgeBench in Chrome

Launch AlgeBench (if not already running), open it in Chrome via browser tools, and interactively debug the UI.

---

Usage

/debug-chrome [stop|restart]

• /debug-chrome — ensure the app is running and open it in Chrome
• /debug-chrome stop — kill the running server
• /debug-chrome restart — kill and relaunch the server

---

Steps

1. Check if the server is already running

curl -s -o /dev/null -w '%{http_code}' http://localhost:8785/

• If HTTP 200 → server is running, skip to step 3.
• If connection refused or non-200 → server is not running, go to step 2.
• If the user passed stop, go to step 5.
• If the user passed restart, go to step 5 first, then step 2.

2. Launch the server

Run in background:

./algebench scenes/test/test-proof-quadratic.json --debug --server-only &

Wait a few seconds, then verify it's up:

curl -s -o /dev/null -w '%{http_code}' http://localhost:8785/

If still not responding, check if the port is different:

grep 'DEFAULT_PORT' server.py

Adjust the URL accordingly.

3. Open in Chrome

Use the Chrome browser tools:

1. tabs_context_mcp with createIfEmpty: true
2. Create a new tab or reuse an existing one
3. Navigate to http://localhost:8785
4. Click the Chat tab to access AI chat and TTS controls

4. Debug interactively

Now use Chrome tools (screenshot, javascript_tool, read_console_messages, read_page, etc.) to debug whatever the user needs.

• Check console errors: read_console_messages with onlyErrors: true
• Inspect state: javascript_tool to query JS variables and DOM
• Take screenshots: computer with action: screenshot
• Click elements: computer with action: left_click

Important: chat.js variables like activeSpeakBtn, ttsRequestId, ttsPlayer are script-scoped (not ES modules), so they ARE accessible from javascript_tool. If a variable is not accessible, check if it was declared inside a function closure.

5. Stop the server

Find and kill the process:

lsof -ti :8785 | xargs kill 2>/dev/null || true

Verify it's stopped:

curl -s -o /dev/null -w '%{http_code}' http://localhost:8785/ 2>/dev/null || echo 'stopped'

Notes

• The server auto-reloads static files (JS/CSS/HTML) on each request — no restart needed for frontend changes.
• Restart is needed when Python files (server.py, agent_tools.py) change.
• Use --debug flag for verbose server logging.