Automatically detect if objects are on the build plate before printing
and pause the print immediately if detected.
Features:
- Per-printer toggle to enable/disable plate detection
- Multi-reference calibration: store up to 5 reference images per printer
for different plate types (textured, smooth, high-temp, etc.)
- Automatic print pause when objects detected at print start
- Push notification and WebSocket alert when print is paused
- ROI (Region of Interest) calibration UI with sliders to adjust
detection area
- Reference management: view thumbnails, add labels, delete references
- Works with both built-in and external cameras
- Uses buffered camera frames when stream is active (no blocking)
- Split button UI: main button opens modal, chevron toggles on/off
- Green visual indicator when plate detection is enabled
- Included in backup/restore
┌─────────────────────────┬───────────────────────────────────────────────────────────┐
│ File │ Fix │
├─────────────────────────┼───────────────────────────────────────────────────────────┤
│ CameraPage.tsx:75 │ Copy imgRef.current to a variable before cleanup │
├─────────────────────────┼───────────────────────────────────────────────────────────┤
│ useWebSocket.ts:121 │ Add processMessageQueue to useCallback dependencies │
├─────────────────────────┼───────────────────────────────────────────────────────────┤
│ SpoolmanSettings.tsx:89 │ Add eslint-disable comment (intentional debounce pattern) │
├─────────────────────────┼───────────────────────────────────────────────────────────┤
│ MQTTDebugModal.tsx:95 │ Wrap logs in useMemo to prevent recreating on each render │
├─────────────────────────┼───────────────────────────────────────────────────────────┤
│ Layout.tsx:166 │ Wrap navItemsMap and extLinksMap in useMemo │
├─────────────────────────┼───────────────────────────────────────────────────────────┤
│ KProfilesView.tsx:715 │ Wrap getProfileKey in useCallback │
├─────────────────────────┼───────────────────────────────────────────────────────────┤
│ GcodeViewer.tsx:171 │ Add eslint-disable comment (intentional behavior) │
└─────────────────────────┴───────────────────────────────────────────────────────────┘
Docker Integration Test Fix
The /api/v1/settings endpoint was returning 404 because:
1. The route was defined at /settings/ (with trailing slash)
2. Curl without -L doesn't follow redirects
3. The catch-all route was intercepting API paths
Fixes:
- Added routes for both with and without trailing slash in settings.py and notification_templates.py
- Updated catch-all in main.py to raise proper HTTPException for API routes
Test Results
- Frontend lint: 0 errors, 0 warnings
- TypeScript: No errors
- Backend unit tests: 264 passed
- Backend integration tests: 309 passed
- Skip Objects Modal:
- Object ID markers overlaid on preview image (grid layout)
- Large prominent ID badges to match printer display
- Info banner explaining to match IDs with printer screen
- Layer warning when skip unavailable (layer <= 1)
- Red badge on button showing skipped count
- Preview image now shown when paused (not just running)
- Close with ESC key or click outside modal
- Full light/dark theme support
- Backend:
- Extract object positions from 3MF (include_positions=True)
- API returns x/y coordinates for objects (when available)
- Parse s_obj from printer MQTT for skipped state persistence
- Cover URL available in PAUSE/PAUSED states
- Tests:
- Added test for objects with position data
When navigating to the printer page after a print completed, status
metrics would animate slowly from mid-print values to final state.
Root cause: The message queue processed messages one at a time with 16ms
delays. If 50+ status updates queued during a print, they took 800ms+ to
process, causing multiple throttle windows and the visual "timelapse".
Solution: Handle printer_status messages directly without queueing.
They're already throttled (100ms) so don't need queue rate limiting.
Other message types still use the queue.
Root cause: When a print completed with the camera stream popup open,
spawning a second ffmpeg process for finish photo capture caused a
conflict that froze the browser tab and video window.
Solution: Buffer the last frame from active camera streams. When
capturing finish photo, use the buffered frame if a stream is active
instead of spawning a new ffmpeg process.
Backend changes:
- camera.py: Added _last_frames buffer and get_buffered_frame() helper
- main.py: Photo capture uses buffered frame when stream is active
- main.py: Moved slow operations to background tasks (energy calc,
photo capture, smart plug, notifications, maintenance)
- archive.py: Fixed sync file write blocking event loop (asyncio.to_thread)
- printers.py: Added debug endpoint to simulate print completion
Frontend changes:
- useWebSocket.ts: Throttled printer status updates (100ms) to prevent
UI overload from rapid WebSocket messages
- useWebSocket.ts: Debounced archive invalidations (3s) to prevent
cascade of re-renders on print completion
- useWebSocket.test.ts: Updated tests for throttled/debounced handlers
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
When a print completes, multiple WebSocket messages are sent rapidly
(print_complete, archive_updated, etc.). Each was immediately invalidating
the archives query, causing a cascade of rapid re-renders that crashed
the browser tab.
Added debounced query invalidation to useWebSocket.ts:
- Multiple invalidation requests within 100ms are coalesced into one
- Uses requestAnimationFrame to avoid blocking the main thread
- Properly cleans up timeouts on unmount
Expanded the useWebSocket.test.ts from minimal coverage to 20 comprehensive tests covering:
WebSocket Mock Tests (6 tests)
- Creates WebSocket with correct URL
- Starts in CONNECTING state
- Transitions to OPEN state
- Can receive messages
- Can close connection
- Tracks all instances
Hook Connection Tests (2 tests)
- Connects to WebSocket on mount
- Reports connected state when WebSocket opens
Message Handling Tests (9 tests)
- Updates printer status in query cache on printer_status message
- Preserves wifi_signal when new value is null
- Invalidates archives on print_complete message
- Invalidates archives on archive_created message
- Invalidates archives on archive_updated message (new handler for timelapse auto-assignment)
- Ignores pong messages without error
- Handles malformed JSON gracefully
- Handles unknown message types gracefully
sendMessage Tests (2 tests)
- Sends JSON message when connected
- Does not send when disconnected
Reconnection Tests (2 tests)
- Reconnects after connection closes
- Cleans up on unmount
Key Fixes
- Fixed MSW (Mock Service Worker) conflict by:
a. Adding addEventListener/removeEventListener to MockWebSocket class
b. Updating MSW setup to bypass WebSocket requests
c. Properly managing WebSocket mock lifecycle in each test
Test Results:
- Frontend: 137 tests passed (9 test files)
- Backend: 346 tests passed
maziggy