@chinchillaenterprises/mcp-dev-logger 2.3.3 → 3.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -1,592 +1,225 @@
1
- # MCP Dev Logger v2.3.3
1
+ # MCP Dev Logger v3.0.0
2
2
 
3
- A Model Context Protocol (MCP) server for capturing and streaming development server output with browser console logging, enhanced organization, and automatic cleanup. Perfect for monitoring `npm run dev`, `yarn dev`, `pnpm dev`, or any other development server commands across all frameworks (Next.js, Vite, Create React App, etc.).
3
+ **Simplified Amplify Gen2 Sandbox Logger**
4
4
 
5
- ## 🎉 New in v2.3.3
5
+ A streamlined Model Context Protocol (MCP) server that does one thing well: runs `npx ampx sandbox --stream-function-logs` and captures output to `resources/sandbox.log`.
6
6
 
7
- - **Larger Default Viewport**: Test browser now defaults to 1920x1080 (was 1280x800)
8
- - **Modern Screen Support**: Better for dashboard layouts, admin interfaces, and component showcases
9
- - **Improved Development Experience**: More realistic modern browser experience out of the box
10
- - **Dev Tools Friendly**: Adequate space for dev tools + content simultaneously
7
+ ## 🎯 What Changed in v3.0.0
11
8
 
12
- ## Previous Features (v2.3.2)
9
+ **MAJOR SIMPLIFICATION**: Removed all complex features to focus on the single use case that matters.
13
10
 
14
- - **Fixed React Hydration Errors**: Test browser banner now uses shadow DOM and waits for React hydration to complete
15
- - **Hydration-Safe Banner**: Banner injection no longer interferes with Next.js/React hydration process
16
- - **Improved Stability**: Better detection of React readiness before DOM modifications
17
- - **Shadow DOM Isolation**: Test browser banner completely isolated from application DOM
11
+ **What's Gone:**
12
+ - Browser console capture (Playwright)
13
+ - Multi-process management
14
+ - Date-based log organization
15
+ - ❌ Process IDs and state persistence
16
+ - ❌ Custom commands and parameters
17
+ - ❌ Frontend/backend/custom process types
18
+ - ❌ All the complexity you never needed
18
19
 
19
- ## Previous Features (v2.3.1)
20
+ **What Remains:**
21
+ - ✅ Single hardcoded command: `npx ampx sandbox --stream-function-logs`
22
+ - ✅ Single log file: `resources/sandbox/sandbox.log` (overwrites each time)
23
+ - ✅ Simple start/stop/tail interface
24
+ - ✅ Smart multi-project detection (kills existing sandbox for THIS project only)
20
25
 
21
- - **Enhanced Error Capture**: Now captures JavaScript errors that don't trigger console.error, including:
22
- - React hydration errors
23
- - Unhandled promise rejections
24
- - Page-level JavaScript errors
25
- - Network request failures (4xx/5xx responses)
26
- - **Visual Error Alerts**: Red banner notification when JavaScript errors occur
27
- - **Better Error Context**: Full stack traces for all JavaScript errors
26
+ ## Why This Exists
28
27
 
29
- ## Previous Features (v2.3.0)
28
+ After two months of usage, the pattern was clear:
29
+ - Only ever used for Amplify sandbox streaming logs
30
+ - Never looked at old logs
31
+ - All the organization features were unused overhead
30
32
 
31
- - **One-Click Student Workflow**: New `dev_start_frontend_with_browser` tool that starts server AND launches browser automatically
32
- - **Smart Port Detection**: Automatically detects which port your dev server is using
33
- - **Server Ready Detection**: Waits for server to be fully ready before launching browser
34
- - **Simplified Teaching**: Reduces student setup from 3 commands to just 1
33
+ So we stripped it down to the essentials.
35
34
 
36
- ## Previous Features (v2.2.0)
35
+ ## Smart Multi-Project Support
37
36
 
38
- - **Browser Console Capture**: Capture browser console.log, console.error, and other console outputs alongside server logs
39
- - **Unified Log Stream**: See both server-side and client-side logs in one place
40
- - **Student-Friendly Browser**: TEST BROWSER with visual indicators for teaching
37
+ The tool intelligently handles multiple projects with running sandboxes:
41
38
 
42
- ## Previous Features (v2.1.0)
39
+ **How it works:**
40
+ 1. Checks if a sandbox is already running in the current project directory
41
+ 2. If found, **kills it** and starts fresh (prevents stuck sandboxes)
42
+ 3. Only affects the sandbox for THIS project - other projects' sandboxes are untouched
43
43
 
44
- - **Organized Log Structure**: Logs are now organized by process type (frontend/backend/amplify/custom)
45
- - **Automatic Cleanup**: Keeps only the last 3 days of logs to prevent disk space issues
46
- - **Improved File Naming**: Cleaner log file names without redundant prefixes
47
-
48
- ## Features
49
-
50
- - **Universal Dev Server Logging**: Works with any development server command
51
- - **Browser Console Capture**: Capture console.log, console.error, console.warn from the browser
52
- - **Multi-Process Support**: Run multiple dev servers simultaneously (frontend + backend)
53
- - **Real-time Log Streaming**: Capture build errors, TypeScript errors, hot reload events
54
- - **Organized Log Storage**: Structured as `logs/YYYY-MM-DD/processType/logfile.log`
55
- - **Automatic Log Cleanup**: Removes logs older than 3 days automatically
56
- - **Smart Process Management**: Start, stop, and restart individual dev servers by ID
57
- - **Log Filtering**: Search through logs with grep patterns
58
- - **Framework Agnostic**: One tool for all development servers
59
- - **Auto-Generated Process IDs**: Intelligent process ID generation based on command and output file
60
- - **Process State Persistence**: Maintains process state across server restarts (where possible)
61
- - **Signal Handling**: Proper cleanup with SIGTERM for graceful shutdowns
62
- - **Unified Server + Browser Logs**: See both frontend and backend logs in one stream
44
+ **Why kill instead of reuse?**
45
+ - Sandboxes can get stuck after running a long time
46
+ - File change detection might stop working
47
+ - Fresh start ensures clean deployment state
63
48
 
64
49
  ## Installation
65
50
 
66
- ### From NPM (Recommended)
67
51
  ```bash
68
52
  claude mcp add dev-logger -s user -- npx @chinchillaenterprises/mcp-dev-logger
69
53
  ```
70
54
 
71
- ### For Development/Testing
72
- ```bash
73
- # Clone and build locally
74
- git clone <repository-url>
75
- cd mcp-dev-logger
76
- npm install
77
- npm run build
78
-
79
- # Add to Claude Code (local development)
80
- claude mcp add dev-logger-local -s user -- node $(pwd)/dist/index.js
81
- ```
82
-
83
55
  ## Tools Provided
84
56
 
85
- **Important Note:** When using these tools through Claude Code's MCP integration, the tool names will be prefixed with `mcp__dev-logger__`. For example:
86
- - `dev_start_log_streaming` becomes `mcp__dev-logger__dev_start_log_streaming`
87
- - `dev_tail_logs` becomes `mcp__dev-logger__dev_tail_logs`
88
- - And so on for all tools
57
+ ### 1. `dev_start_sandbox`
58
+ Start Amplify Gen2 sandbox with streaming function logs. No parameters needed.
89
59
 
90
- This prefix pattern applies to all MCP servers and helps Claude distinguish between different servers' tools.
60
+ **What it does:**
61
+ - Checks if a sandbox is already running in THIS project directory
62
+ - If found, kills it first (prevents stuck sandboxes)
63
+ - Starts `npx ampx sandbox --stream-function-logs`
64
+ - Clears/overwrites `resources/sandbox/sandbox.log`
65
+ - Streams all output (stdout + stderr) to the log file
66
+ - Adds timestamps to every log line
91
67
 
92
- ### 1. dev_start_log_streaming
93
- Start a development server and stream its output to a log file. **Supports multiple concurrent processes.**
94
-
95
- **Parameters:**
96
- - `command` (optional): Dev command to run (default: "npm run dev")
97
- - `outputFile` (optional): File to write logs to (default: "dev-server-logs.txt")
98
- - `processId` (optional): Custom process ID (auto-generated if not provided)
99
- - `cwd` (optional): Working directory
100
- - `env` (optional): Environment variables to pass
68
+ **Multi-project safe:** Only kills/affects sandboxes running in the current directory
101
69
 
102
- **Example:**
103
- ```json
104
- {
105
- "command": "npm run dev",
106
- "outputFile": "frontend-logs.txt",
107
- "cwd": "/path/to/project",
108
- "env": {
109
- "PORT": "3001",
110
- "NODE_ENV": "development"
111
- }
112
- }
70
+ **Usage:**
71
+ ```typescript
72
+ dev_start_sandbox()
113
73
  ```
114
74
 
115
- ### 2. dev_list_processes
116
- List all running development processes with their status and details.
117
-
118
- **No parameters required.**
119
-
120
- ### 3. dev_stop_log_streaming
121
- Stop development server(s) and logging.
122
-
123
- **Parameters:**
124
- - `processId` (optional): Process ID to stop (if not provided, stops all processes)
125
-
126
- ### 4. dev_restart_log_streaming
127
- Restart a specific development server (useful when it crashes or hangs).
128
-
129
- **Parameters:**
130
- - `processId` (required): Process ID to restart
131
- - `clearLogs` (optional): Whether to clear the log file on restart (default: false)
132
-
133
- ### 5. dev_get_status
134
- Check if development server(s) are running and get their status.
135
-
136
- **Parameters:**
137
- - `processId` (optional): Process ID to get status for (if not provided, shows all processes)
138
-
139
75
  **Returns:**
140
- - Running status
141
- - Process ID(s)
142
- - PID(s)
143
- - Uptime
144
- - Current command(s)
145
- - Log file location(s)
146
-
147
- ### 6. dev_tail_logs
148
- Get the last N lines from the log file.
149
-
150
- **Parameters:**
151
- - `processId` (optional): Process ID to tail logs from (smart fallback for single process)
152
- - `lines` (optional): Number of lines to return (default: 50)
153
- - `filter` (optional): Grep pattern to filter logs
154
-
155
- **Example:**
156
76
  ```json
157
77
  {
158
- "processId": "npm-frontend",
159
- "lines": 100,
160
- "filter": "ERROR"
78
+ "success": true,
79
+ "message": "Amplify sandbox started. Logs are being written to /path/to/project/resources/sandbox/sandbox.log",
80
+ "logFile": "/path/to/project/resources/sandbox/sandbox.log"
161
81
  }
162
82
  ```
163
83
 
164
- ### 7. dev_clear_logs
165
- Clear the log file.
166
-
167
- **Parameters:**
168
- - `processId` (optional): Process ID to clear logs for (smart fallback for single process)
169
- - `backup` (optional): Whether to backup logs before clearing (default: false)
170
-
171
- ### 8. dev_launch_test_browser
172
- Launch a TEST BROWSER for students to interact with. All console logs from this browser are captured automatically. Students should use THIS browser (not their regular browser) to test their app.
173
-
174
- **Parameters:**
175
- - `processId` (optional): Process ID to attach browser console to
176
- - `browserUrl` (optional): URL to open in test browser (default: http://localhost:3000)
177
- - `teachingMode` (optional): Enable teaching mode with DevTools open and slower actions (default: true)
178
- - `viewport` (optional): Browser window size (default: { width: 1280, height: 800 })
179
- - `highlightErrors` (optional): Add visual indicator when console errors occur (default: true)
180
-
181
- **Key Features:**
182
- - 🪟 Always visible browser window (not headless)
183
- - 🔍 DevTools automatically open in teaching mode
184
- - 🐌 Slower actions for easier teaching/learning
185
- - ⚡ Red flash on console errors
186
- - 📝 Green banner showing "TEST BROWSER" status
187
- - 🎯 All console logs captured to the same log file as server logs
188
-
189
- **Example:**
84
+ Or if it killed an existing sandbox:
190
85
  ```json
191
86
  {
192
- "processId": "npm-frontend",
193
- "browserUrl": "http://localhost:3000",
194
- "teachingMode": true,
195
- "highlightErrors": true
87
+ "success": true,
88
+ "message": "Killed existing sandbox (PID: 12345) and started fresh. Logs are being written to /path/to/project/resources/sandbox/sandbox.log",
89
+ "logFile": "/path/to/project/resources/sandbox/sandbox.log",
90
+ "killedPid": 12345
196
91
  }
197
92
  ```
198
93
 
199
- ### 9. dev_stop_browser_console
200
- Stop browser console capture for a specific process.
201
-
202
- **Parameters:**
203
- - `processId` (optional): Process ID to stop browser console capture for
94
+ ### 2. `dev_stop_sandbox`
95
+ Stop the running Amplify sandbox process. No parameters needed.
204
96
 
205
- ### 10. dev_start_frontend_with_browser 🚀 NEW in v2.3.0!
206
- **ONE-CLICK STUDENT WORKFLOW**: Start frontend server AND automatically launch test browser when ready. Perfect for teaching environments - reduces setup from 3 commands to 1!
97
+ **Usage:**
98
+ ```typescript
99
+ dev_stop_sandbox()
100
+ ```
207
101
 
208
- **Parameters:**
209
- - `command` (optional): Dev command to run (default: "npm run dev")
210
- - `port` (optional): Port to wait for (default: auto-detect from output)
211
- - `waitTimeout` (optional): Max time to wait for server in ms (default: 30000)
212
- - `browserDelay` (optional): Delay after server ready in ms (default: 1000)
213
- - `teachingMode` (optional): Enable teaching features (default: true)
214
- - `processId` (optional): Custom process ID (default: "frontend-with-browser")
215
- - `env` (optional): Environment variables
216
- - `cwd` (optional): Working directory
217
-
218
- **Key Features:**
219
- - 🎯 Automatically detects when server is ready
220
- - 🪟 Launches test browser with DevTools open
221
- - 📝 Captures both server AND browser console logs
222
- - ⚡ Red flash on browser errors
223
- - 🧪 Green "TEST BROWSER" banner
224
- - ⏱️ Single command instead of multiple steps
225
-
226
- **Example:**
102
+ **Returns:**
227
103
  ```json
228
104
  {
229
- "command": "npm run dev",
230
- "teachingMode": true,
231
- "processId": "student-project"
105
+ "success": true,
106
+ "message": "Amplify sandbox stopped successfully."
232
107
  }
233
108
  ```
234
109
 
235
- **Success Output:**
236
- ```
237
- ✅ Starting development server...
238
- ✅ Server ready on http://localhost:3000
239
- ✅ Launching test browser...
240
-
241
- 🎯 TEST BROWSER LAUNCHED!
242
-
243
- 👉 Use the browser window that just opened (with green banner)
244
- 📝 All console logs are being saved
245
- 🔍 DevTools is open for debugging
246
- ⚠️ Errors will flash red on screen
247
-
248
- Happy debugging! 🚀
249
- ```
110
+ ### 3. `dev_tail_sandbox_logs`
111
+ Get the last N lines from the sandbox log file.
250
112
 
251
- ## Usage Examples
113
+ **Parameters:**
114
+ - `lines` (optional): Number of lines to return (default: 50)
252
115
 
253
- ### Multi-Process Development (v2.0.0)
116
+ **Usage:**
254
117
  ```typescript
255
- // Start frontend and backend simultaneously
256
- dev_start_log_streaming({
257
- "command": "npm run dev",
258
- "outputFile": "frontend.log",
259
- "processId": "frontend"
260
- })
118
+ // Get last 50 lines (default)
119
+ dev_tail_sandbox_logs()
261
120
 
262
- dev_start_log_streaming({
263
- "command": "npx ampx sandbox --stream-function-logs",
264
- "outputFile": "backend.log",
265
- "processId": "backend"
266
- })
267
-
268
- // List all running processes
269
- dev_list_processes()
270
-
271
- // Stop just the frontend
272
- dev_stop_log_streaming({ "processId": "frontend" })
273
-
274
- // Restart backend with clean logs
275
- dev_restart_log_streaming({
276
- "processId": "backend",
277
- "clearLogs": true
278
- })
121
+ // Get last 100 lines
122
+ dev_tail_sandbox_logs({ "lines": 100 })
279
123
  ```
280
124
 
281
- ### Start Next.js Development Server
282
- ```typescript
283
- // Start Next.js dev server
125
+ **Returns:**
126
+ ```json
284
127
  {
285
- "command": "npm run dev",
286
- "outputFile": "nextjs-dev.log"
128
+ "success": true,
129
+ "logs": "[2025-10-02T12:34:56.789Z] Starting Amplify sandbox: npx ampx sandbox --stream-function-logs\n[2025-10-02T12:34:57.890Z] Amplify Gen 2 sandbox starting...\n..."
287
130
  }
288
131
  ```
289
132
 
290
- ### Monitor Vite Dev Server
291
- ```typescript
292
- // Start Vite with custom port
293
- {
294
- "command": "vite --port 3001",
295
- "outputFile": "vite-dev.log",
296
- "env": {
297
- "NODE_ENV": "development"
298
- }
299
- }
300
- ```
133
+ ## Typical Workflow
301
134
 
302
- ### Check for TypeScript Errors
303
135
  ```typescript
304
- // Tail logs filtering for TypeScript errors
305
- {
306
- "lines": 200,
307
- "filter": "TS\\d+"
308
- }
309
- ```
310
-
311
- ### Debug Build Errors
312
- ```typescript
313
- // Get recent errors from build process
314
- {
315
- "lines": 100,
316
- "filter": "ERROR|FAILED|error"
317
- }
318
- ```
136
+ // 1. Start the sandbox
137
+ dev_start_sandbox()
319
138
 
320
- ## Log Organization (v2.1.0+)
139
+ // 2. Work on your code...
140
+ // Sandbox is running and streaming logs to resources/sandbox/sandbox.log
321
141
 
322
- Logs are organized in a structured directory hierarchy:
142
+ // 3. Check recent logs when something goes wrong
143
+ dev_tail_sandbox_logs({ "lines": 100 })
323
144
 
145
+ // 4. Stop when done
146
+ dev_stop_sandbox()
324
147
  ```
325
- logs/
326
- ├── 2025-07-10/ # Date folder (YYYY-MM-DD)
327
- │ ├── frontend/ # Process type folder
328
- │ │ ├── nextjs-14-32-15.log
329
- │ │ └── vite-16-45-22.log
330
- │ ├── backend/
331
- │ │ ├── express-14-33-01.log
332
- │ │ └── api-15-22-11.log
333
- │ └── amplify/
334
- │ └── sandbox-14-35-22.log
335
- └── 2025-07-09/ # Older logs (auto-removed after 3 days)
336
- └── ...
337
- ```
338
-
339
- ## Log Format
340
-
341
- Logs are written with timestamps, process IDs, and error markers. Browser console logs are prefixed with [BROWSER]:
342
148
 
343
- ```
344
- [2024-01-15T10:30:45.123Z] Starting: npm run dev (Process ID: npm-frontend)
345
- [2024-01-15T10:30:46.456Z] [npm-frontend] > my-app@1.0.0 dev
346
- [2024-01-15T10:30:46.457Z] [npm-frontend] > next dev
347
- [2024-01-15T10:30:47.123Z] [npm-frontend] ▲ Next.js 14.0.0
348
- [2024-01-15T10:30:47.124Z] [npm-frontend] - Local: http://localhost:3000
349
- [2024-01-15T10:30:48.789Z] [npm-frontend] [ERROR] Error: Cannot find module './components/Header'
350
- [2024-01-15T10:30:49.123Z] [npm-frontend] [BROWSER] Console capture started for http://localhost:3000
351
- [2024-01-15T10:30:49.456Z] [npm-frontend] [BROWSER] [LOG] React DevTools detected
352
- [2024-01-15T10:30:49.789Z] [npm-frontend] [BROWSER] [WARN] React: Each child should have a unique key prop
353
- [2024-01-15T10:30:50.123Z] [npm-frontend] [BROWSER] [ERROR] Failed to fetch /api/user: 404 Not Found
354
- [2024-01-15T10:30:50.456Z] [npm-frontend] [BROWSER] [LOG] { user: null, loading: false }
355
-
356
- [2024-01-15T10:30:50.123Z] Starting: npx ampx sandbox --stream-function-logs (Process ID: npx-backend)
357
- [2024-01-15T10:30:51.456Z] [npx-backend] [INFO] Amplify sandbox starting...
358
- [2024-01-15T10:30:52.123Z] [npx-backend] Process exited with code 0 and signal null
359
- ```
149
+ ## AI Assistant Usage
360
150
 
361
- ### Process ID Generation
362
- The server automatically generates intelligent process IDs based on the command and output file:
363
- - Command: `npm run dev` + Output: `frontend.log` → Process ID: `npm-frontend`
364
- - Command: `npx ampx sandbox --stream-function-logs` + Output: `backend.log` Process ID: `npx-backend`
365
- - Duplicate IDs are automatically suffixed with `-1`, `-2`, etc.
151
+ When you tell Claude Code to "use dev logger", it will:
152
+ 1. Call `dev_start_sandbox()` to start streaming (kills existing sandbox if found)
153
+ 2. Logs are captured automatically to `resources/sandbox/sandbox.log`
154
+ 3. Claude can call `dev_tail_sandbox_logs()` to check for errors
155
+ 4. Calls `dev_stop_sandbox()` when you're done
366
156
 
367
- ## Common Use Cases
157
+ ## Log Format
368
158
 
369
- ### 1. Debugging Build Failures
370
- ```bash
371
- # Start dev server
372
- dev_start_log_streaming
159
+ Logs are timestamped and include error markers:
373
160
 
374
- # When build fails, check recent errors
375
- dev_tail_logs { "filter": "ERROR", "lines": 100 }
376
161
  ```
377
-
378
- ### 2. Monitoring TypeScript Compilation
379
- ```bash
380
- # Start with TypeScript focus
381
- dev_start_log_streaming { "command": "npm run dev", "outputFile": "ts-errors.log" }
382
-
383
- # Check for TS errors
384
- dev_tail_logs { "filter": "TS\\d+|typescript", "lines": 50 }
162
+ [2025-10-02T12:34:56.789Z] Starting Amplify sandbox: npx ampx sandbox --stream-function-logs
163
+ [2025-10-02T12:34:57.890Z] Amplify Gen 2 sandbox starting...
164
+ [2025-10-02T12:34:58.123Z] [INFO] Deploying stack...
165
+ [2025-10-02T12:35:00.456Z] [ERROR] Failed to deploy: Invalid configuration
166
+ [2025-10-02T12:35:01.789Z] Amplify sandbox exited with code 1 and signal null
385
167
  ```
386
168
 
387
- ### 3. Port Conflicts
388
- ```bash
389
- # Start on different port
390
- dev_start_log_streaming {
391
- "command": "npm run dev",
392
- "env": { "PORT": "3001" }
393
- }
394
- ```
169
+ ## Requirements
395
170
 
396
- ### 4. Clean Restart After Crash
397
- ```bash
398
- # Restart and clear old logs
399
- dev_restart_log_streaming { "clearLogs": true }
400
- ```
171
+ - Node.js 18+
172
+ - AWS Amplify Gen2 project
173
+ - A `resources/` folder in your repo (created automatically if missing)
401
174
 
402
- ### 5. Amplify Development Workflow
403
- ```bash
404
- # Start Amplify backend logging
405
- dev_start_log_streaming {
406
- "command": "npx ampx sandbox --stream-function-logs",
407
- "outputFile": "backend-logs.txt",
408
- "processId": "amplify-backend"
409
- }
175
+ ## Migration from v2.x
410
176
 
411
- # Monitor Lambda function logs
412
- dev_tail_logs { "processId": "amplify-backend", "filter": "ERROR|WARN", "lines": 100 }
413
- ```
177
+ If you were using the old version:
414
178
 
415
- ### 6. Student Testing Workflow (v2.2.0)
179
+ **Before (v2.x):**
416
180
  ```typescript
417
- // Step 1: Start the student's dev server
418
181
  dev_start_log_streaming({
419
- "command": "npm run dev",
420
- "processId": "student-app"
421
- })
422
-
423
- // Step 2: Launch the TEST BROWSER for the student
424
- dev_launch_test_browser({
425
- "processId": "student-app",
426
- "browserUrl": "http://localhost:3000",
427
- "teachingMode": true // DevTools open, slower actions
428
- })
429
-
430
- // Step 3: Tell student: "Use the TEST BROWSER window that just opened!"
431
- // They click buttons, fill forms, trigger errors - ALL console logs are captured
432
-
433
- // Step 4: When student says "I clicked submit and nothing happened"
434
- dev_tail_logs({
435
- "processId": "student-app",
436
- "filter": "\\[BROWSER\\].*\\[ERROR\\]",
437
- "lines": 20
438
- })
439
- // Shows: [BROWSER] [ERROR] Cannot read property 'name' of undefined
440
-
441
- // Step 5: Show all browser activity
442
- dev_tail_logs({
443
- "processId": "student-app",
444
- "filter": "\\[BROWSER\\]",
445
- "lines": 50
182
+ "command": "npx ampx sandbox --stream-function-logs",
183
+ "outputFile": "backend-logs.txt",
184
+ "processId": "amplify-backend",
185
+ "structuredLogging": true,
186
+ "sessionDate": "2025-10-02"
446
187
  })
447
-
448
- // Step 6: When done testing
449
- dev_stop_browser_console({ "processId": "student-app" })
450
188
  ```
451
189
 
452
- **What Students See:**
453
- - A browser window opens with "🧪 TEST BROWSER" banner
454
- - DevTools is already open to the Console tab
455
- - When errors occur, the browser flashes red
456
- - All their console.log() statements are captured
457
- - They can debug using the actual browser they're testing in
458
-
459
- ### Tips for Instructors/TAs:
460
- 1. **Always emphasize**: Students must use the TEST BROWSER, not their regular browser
461
- 2. **Common mistake**: Students open localhost:3000 in their regular Chrome - no logs captured!
462
- 3. **Quick check**: Look for [BROWSER] prefix in logs to confirm they're using test browser
463
- 4. **Teaching moment**: Show how server errors appear without [BROWSER] prefix
464
- 5. **Debugging together**: The red flash makes it easy to spot when errors occur
465
-
466
- ### 7. Simplified One-Click Workflow (v2.3.0) 🎯
467
- The new `dev_start_frontend_with_browser` combines steps 1 and 2 above into a single command:
468
-
190
+ **Now (v3.0):**
469
191
  ```typescript
470
- // BEFORE (v2.2.0): Two separate commands
471
- dev_start_log_streaming({ "command": "npm run dev", "processId": "student-app" })
472
- // Wait for server to start...
473
- dev_launch_test_browser({ "processId": "student-app" })
474
-
475
- // NOW (v2.3.0): Single command does everything!
476
- dev_start_frontend_with_browser({
477
- "command": "npm run dev",
478
- "processId": "student-project",
479
- "teachingMode": true
480
- })
481
- // Server starts, waits for ready, then browser launches automatically!
192
+ dev_start_sandbox()
482
193
  ```
483
194
 
484
- **Benefits for Students:**
485
- - 🚀 One command instead of two
486
- - ⏱️ No need to wait and guess when server is ready
487
- - 🎯 Browser launches at the perfect time
488
- - 📝 All logs in one place from the start
489
- - 🔧 Less chance for mistakes
490
-
491
- **Common Student Scenarios:**
492
-
493
- ```typescript
494
- // Scenario 1: React app on default port
495
- dev_start_frontend_with_browser()
496
- // That's it! Uses all smart defaults
497
-
498
- // Scenario 2: Vite app with custom command
499
- dev_start_frontend_with_browser({
500
- "command": "npm run dev -- --host",
501
- "processId": "vite-project"
502
- })
503
-
504
- // Scenario 3: Next.js on different port
505
- dev_start_frontend_with_browser({
506
- "command": "npm run dev",
507
- "port": 3001, // If auto-detect fails
508
- "env": { "PORT": "3001" }
509
- })
510
-
511
- // Scenario 4: Quick demo mode (no DevTools)
512
- dev_start_frontend_with_browser({
513
- "teachingMode": false // Faster, no DevTools
514
- })
515
- ```
195
+ That's it. No parameters, no configuration, just works.
516
196
 
517
197
  ## Troubleshooting
518
198
 
519
- ### Dev Server Not Starting
520
- 1. Check the log file for error messages
521
- 2. Verify the command works when run directly in terminal
522
- 3. Check working directory is correct
523
- 4. Ensure all dependencies are installed
524
-
525
- ### Logs Not Appearing
526
- 1. Check the output file path is writable
527
- 2. Some frameworks buffer output - logs may appear in chunks
528
- 3. Use `dev_get_status` to verify server is running
529
-
530
- ### Process Won't Stop
531
- 1. Use `dev_stop_log_streaming` first
532
- 2. If that fails, the process may have crashed - check system process manager
533
- 3. Restart Claude Code to clean up orphaned processes
534
-
535
- ## Implementation Details
536
-
537
- ### Process Management
538
- - Uses Node.js `spawn` with `detached: true` for proper process isolation
539
- - Implements graceful shutdown with SIGTERM signals
540
- - Automatically removes event listeners on process termination to prevent memory leaks
541
- - Attempts to kill process groups (`-pid`) to handle child processes
542
-
543
- ### State Persistence
544
- - Saves process state to `${tmpdir}/mcp-dev-logger.json`
545
- - Restores process information on server restart (where possible)
546
- - Handles process cleanup on server shutdown
547
-
548
- ### Log Streaming
549
- - Real-time streaming of both stdout and stderr
550
- - Timestamped log entries with process ID tagging
551
- - Error entries are clearly marked with `[ERROR]` prefix
552
- - Supports concurrent logging from multiple processes to different files
199
+ ### Sandbox won't start
200
+ - Make sure you're in an Amplify Gen2 project directory
201
+ - Check that `npx ampx` is available
202
+ - Verify AWS credentials are configured
553
203
 
554
- ## Limitations
204
+ ### Logs not appearing
205
+ - Check that `resources/` folder exists (created automatically)
206
+ - Use `dev_tail_sandbox_logs()` to verify logs are being written
555
207
 
556
- - Process management is best-effort - some processes may not respond to signals
557
- - Very large log files may impact performance of `dev_tail_logs`
558
- - Only captures server-side console output (not browser console logs)
559
- - Process state restoration is limited after server restarts (PIDs become invalid)
208
+ ### Process won't stop
209
+ - Call `dev_stop_sandbox()` again
210
+ - If still stuck, restart Claude Code
211
+ - The process will be cleaned up automatically
560
212
 
561
213
  ## Development
562
214
 
563
- ### Building
564
215
  ```bash
216
+ # Build
565
217
  npm run build
566
- ```
567
-
568
- ### Watch Mode
569
- ```bash
570
- npm run dev
571
- ```
572
218
 
573
- ### Testing
574
- ```bash
575
- # Test with local installation
219
+ # Install locally for testing
576
220
  claude mcp add dev-logger-test -s user -- node $(pwd)/dist/index.js
577
-
578
- # Start Claude and test tools
579
- claude
580
- > /mcp # Check if server is connected
581
221
  ```
582
222
 
583
- ## Contributing
584
-
585
- 1. Fork the repository
586
- 2. Create feature branch
587
- 3. Make changes and test thoroughly
588
- 4. Submit pull request with clear description
589
-
590
223
  ## License
591
224
 
592
225
  MIT License - see LICENSE file for details.
@@ -596,4 +229,3 @@ MIT License - see LICENSE file for details.
596
229
  For issues and questions:
597
230
  - Open an issue in the repository
598
231
  - Check existing issues for similar problems
599
- - Include log samples when reporting bugs