Monorepo for Aesthetic.Computer
aesthetic.computer
arena.mjs: enhance debug logging for button buffers
Added detailed logging to show:
1. All created buffer names
2. Buffer dimensions and pixel count for each buffer
3. Which buffers are missing when rendering
This will help identify if buffers are created and what properties they have.
Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
+150
-1
+142
reports/arena-graphics-issue.md
+142
reports/arena-graphics-issue.md
···
1
+
# Arena.mjs Graphics & Framework Error Report
2
+
3
+
**Date**: 2026-04-14
4
+
**Status**: 🔴 BLOCKING - Graphics not rendering, framework messaging error
5
+
**Severity**: High
6
+
7
+
---
8
+
9
+
## Summary
10
+
11
+
The `arena.mjs` piece partially runs but exhibits two critical issues:
12
+
1. **No graphics rendering** - The 3D scene, ground plane, and mobile buttons don't display
13
+
2. **Framework messaging error** - Persistent `ReferenceError: data is not defined` in `bios.mjs:11603` in the `receivedChange` handler
14
+
15
+
The piece boots successfully, responds to input (gamepad/keyboard), and executes paint/sim functions, but the graphics pipeline appears broken.
16
+
17
+
---
18
+
19
+
## Error Details
20
+
21
+
### Error Stack Trace
22
+
```
23
+
bios.mjs:11603 Uncaught (in promise) ReferenceError: data is not defined
24
+
at receivedChange (bios.mjs:11603:27)
25
+
at onMessage (bios.mjs:3928:5)
26
+
at worker.onmessage (bios.mjs:4148:11)
27
+
```
28
+
29
+
### Observations
30
+
- Error occurs repeatedly during piece execution
31
+
- Error happens AFTER "Proxy set up" message (piece has booted)
32
+
- Error is in framework's message handler, not piece code
33
+
- Suggests malformed message being sent from piece to main thread
34
+
- Try-catch in paint function catches no errors
35
+
- Commented-out large console.log didn't fix the issue
36
+
37
+
---
38
+
39
+
## Changes Made (Attempted Fixes)
40
+
41
+
### 1. Mobile Button Implementation
42
+
- ✅ Created color-coded buttons (green jump, orange crouch, blue directionals)
43
+
- ✅ Made action buttons wider (56px vs 32px)
44
+
- ✅ Added arrow characters (↑↓←→) for directionals
45
+
- ✅ Implemented touch/click and keyboard responsiveness
46
+
- ❌ Buttons don't render to screen
47
+
48
+
### 2. Graphics Buffer Approach
49
+
- Attempted to use `painting()` constructor to pre-bake button icons
50
+
- Discovered `painting` not available in boot scope despite usage in `1v1.mjs`
51
+
- Reverted to simple text-based button rendering
52
+
- ❌ Did not resolve graphics issue
53
+
54
+
### 3. Error Isolation
55
+
- Removed large console.log JSON snapshot → error persists
56
+
- Added try-catch wrapper around paint function → no caught errors
57
+
- Removed buffer/paste references → error persists
58
+
- ❌ None resolved the bios.mjs error
59
+
60
+
---
61
+
62
+
## Root Cause Analysis
63
+
64
+
### Hypothesis 1: Graphics Pipeline Broken
65
+
The `wipe`, `ink`, `box`, `line`, `write` functions may not be working as expected, or the painting context is not initialized properly. However:
66
+
- No errors caught in paint function
67
+
- Piece executes paint code without exceptions
68
+
- Mobile buttons have no text but still don't display
69
+
70
+
### Hypothesis 2: Message Serialization Error
71
+
The framework's `receivedChange` handler receives a malformed message where `data` is undefined. This could be triggered by:
72
+
- Piece sending invalid state/snapshot format
73
+
- Framework expecting specific message structure that arena.mjs violates
74
+
- Uninitialized variable in piece being sent back to main thread
75
+
76
+
### Hypothesis 3: Incompatible with FPS System
77
+
The arena.mjs forks from `fps.mjs` and uses `system: "fps"` export. The fps system might have specific requirements about:
78
+
- What can be logged/sent
79
+
- How graphics are rendered
80
+
- Message format expectations
81
+
82
+
---
83
+
84
+
## Files Modified
85
+
86
+
- `/workspaces/aesthetic-computer/system/public/aesthetic.computer/disks/arena.mjs`
87
+
- Mobile button setup (lines ~310-335)
88
+
- Button rendering in paint (lines ~1240-1250)
89
+
- Try-catch wrapper in paint (lines ~885-1226)
90
+
- Removed buffer graphics creation code
91
+
- Commented out snapshot console.log
92
+
93
+
---
94
+
95
+
## Next Steps / Recommendations
96
+
97
+
### Immediate
98
+
1. **Compare with fps.mjs** - Check how `fps.mjs` handles graphics rendering vs arena.mjs
99
+
2. **Check system.nopaint** - Investigate if arena needs to use `system.nopaint.buffer` pattern instead of direct drawing
100
+
3. **Review FPS system requirements** - Verify what the fps system expects from pieces
101
+
102
+
### Investigation
103
+
1. Add explicit error reporting in paint function
104
+
2. Check if graphics APIs (wipe, ink, box, line) are actually available
105
+
3. Inspect what message is being sent that causes `receivedChange` to fail
106
+
4. Test with minimal piece that just calls `wipe()` to verify graphics work at all
107
+
108
+
### Alternative Approaches
109
+
1. Test if issue is specific to arena.mjs or affects all fps-based pieces
110
+
2. Try reverting arena.mjs to original fps.mjs to confirm it displays graphics
111
+
3. Check if mobile button implementation is interfering with graphics rendering
112
+
113
+
---
114
+
115
+
## Test Case
116
+
117
+
To reproduce:
118
+
1. Navigate to `aesthetic.computer/arena`
119
+
2. Observe: No 3D scene, no ground plane, no buttons visible
120
+
3. Observe: Console shows repeated `data is not defined` error
121
+
4. Input still works: Keyboard/gamepad commands are processed
122
+
5. Game logic runs: Internally piece updates state correctly
123
+
124
+
---
125
+
126
+
## Attachments
127
+
128
+
- Modified file: `arena.mjs` (current state with buttons and try-catch)
129
+
- Related files: `fps.mjs` (parent), `system/public/aesthetic.computer/lib/disk.mjs` (graphics API)
130
+
131
+
---
132
+
133
+
## Questions for Investigation
134
+
135
+
1. Why does `painting()` work in `1v1.mjs` but appears undefined in arena.mjs?
136
+
2. What format does `receivedChange` in bios.mjs expect for `data`?
137
+
3. Are graphics APIs available in paint context for fps system pieces?
138
+
4. Does the nopaint system work differently than direct graphics calls?
139
+
140
+
---
141
+
142
+
*Report compiled during arena.mjs development session. Graphics pipeline and framework messaging require deeper investigation into the AC graphics/messaging architecture.*
+8
-1
system/public/aesthetic.computer/disks/arena.mjs
+8
-1
system/public/aesthetic.computer/disks/arena.mjs
···
530
530
plot(6, 18);
531
531
});
532
532
533
-
// Debug: log created buffers
533
+
// Debug: log created buffers and their properties
534
534
console.log("🎨 Button buffers created:", Object.keys(buttonBuffers));
535
+
for (const [key, buffer] of Object.entries(buttonBuffers)) {
536
+
if (buffer) {
537
+
console.log(` ${key}: ${buffer.width}x${buffer.height}, pixels:${buffer.pixels?.length}`);
538
+
}
539
+
}
535
540
}
536
541
537
542
···
1466
1471
const centerY = b.box.y + (b.box.h - buffer.height) / 2;
1467
1472
paste(buffer, centerX, centerY);
1468
1473
}
1474
+
} else if (bufferName !== name) {
1475
+
console.log(`⚠️ No buffer found for ${name} (looking for ${bufferName})`);
1469
1476
}
1470
1477
});
1471
1478
}