docs(25-01): create UAT checklist for recording memory verification
- 5 comprehensive test sections covering all memory leak scenarios - Timer cleanup verification test - Callback accumulation verification test - Async operation cleanup verification test - 15-minute modal idle stability test - 15-minute active recording stability test - Troubleshooting guide for each failure type
This commit is contained in:
Nuwan
parent
1c1e7e4a3f
commit
32ee0e8b10
|
|
@ -0,0 +1,333 @@
|
|||
---
|
||||
phase: 25-memory-leak-audit
|
||||
type: uat
|
||||
status: pending
|
||||
verified-by:
|
||||
verified-date:
|
||||
---
|
||||
|
||||
# Phase 25: Recording Memory Leak Verification UAT
|
||||
|
||||
## Prerequisites
|
||||
|
||||
- **Browser:** Chrome (recommended for DevTools memory profiling)
|
||||
- **DevTools:** Open with Performance Monitor and Console tabs visible
|
||||
- **jam-ui:** Running locally (`npm run start`)
|
||||
- **web backend:** Running (`./runweb`)
|
||||
- **Native client:** Running and connected
|
||||
- **Session:** Active session with at least one other participant
|
||||
|
||||
## Quick Verification (2-3 minutes)
|
||||
|
||||
Before full verification, confirm basic stability:
|
||||
|
||||
1. Join a session
|
||||
2. Open recording modal
|
||||
3. Close recording modal
|
||||
4. Repeat open/close 5 times
|
||||
5. Check console for "state update on unmounted component" warnings
|
||||
|
||||
**Quick check pass:** [ ]
|
||||
|
||||
**Expected:** No console warnings about state updates
|
||||
|
||||
---
|
||||
|
||||
## Section 1: Timer Cleanup Verification
|
||||
|
||||
**Purpose:** Verify waitingOnStopTimer is cleared on unmount (MEM-02)
|
||||
|
||||
### Test Steps
|
||||
|
||||
1. **Start Recording**
|
||||
- [ ] Join a session
|
||||
- [ ] Open recording modal
|
||||
- [ ] Fill in recording name
|
||||
- [ ] Click "Start Recording"
|
||||
- [ ] Verify recording starts (status indicator shows "Recording")
|
||||
|
||||
2. **Stop Recording**
|
||||
- [ ] Wait 5+ seconds for recording to be active
|
||||
- [ ] Open recording modal again
|
||||
- [ ] Click "Stop Recording"
|
||||
- [ ] Verify recording stops
|
||||
|
||||
3. **Leave Session**
|
||||
- [ ] Click the leave button to exit session
|
||||
- [ ] Navigate to dashboard
|
||||
|
||||
4. **Check Console**
|
||||
- [ ] Open browser console (F12 > Console)
|
||||
- [ ] Look for any timer-related errors
|
||||
- [ ] Look for errors about clearTimeout failures
|
||||
|
||||
### Expected Results
|
||||
|
||||
| Check | Expected | Actual |
|
||||
|-------|----------|--------|
|
||||
| Recording starts cleanly | Yes | |
|
||||
| Recording stops cleanly | Yes | |
|
||||
| No timer-related errors on leave | Yes | |
|
||||
| Console errors | None | |
|
||||
|
||||
**Section 1 Pass:** [ ]
|
||||
|
||||
---
|
||||
|
||||
## Section 2: Callback Cleanup Verification
|
||||
|
||||
**Purpose:** Verify window.JK callbacks don't accumulate (MEM-01)
|
||||
|
||||
### Test Steps
|
||||
|
||||
1. **Open Browser Console**
|
||||
- [ ] Open browser console (F12 > Console)
|
||||
- [ ] Type `Object.keys(window.JK)` and press Enter
|
||||
- [ ] Record initial callback names: ________________
|
||||
|
||||
2. **Open/Close Recording Modal 20 Times**
|
||||
- [ ] Join a session
|
||||
- [ ] Open recording modal
|
||||
- [ ] Close recording modal
|
||||
- [ ] Repeat 20 times
|
||||
|
||||
3. **Check Callbacks Again**
|
||||
- [ ] In console, type `Object.keys(window.JK)` again
|
||||
- [ ] Record callback names: ________________
|
||||
- [ ] Verify same callback names (no duplicates)
|
||||
- [ ] Verify no accumulation of callbacks
|
||||
|
||||
4. **Verify Callbacks Still Work**
|
||||
- [ ] Open recording modal one more time
|
||||
- [ ] Start a recording
|
||||
- [ ] Verify recording starts successfully
|
||||
- [ ] Stop recording
|
||||
- [ ] Verify recording stops successfully
|
||||
|
||||
### Expected Results
|
||||
|
||||
| Check | Expected | Actual |
|
||||
|-------|----------|--------|
|
||||
| Callbacks match initial list | Yes | |
|
||||
| No duplicate callbacks | Yes | |
|
||||
| No accumulated callbacks | Yes | |
|
||||
| Callbacks still functional | Yes | |
|
||||
| Console errors | None | |
|
||||
|
||||
**Section 2 Pass:** [ ]
|
||||
|
||||
---
|
||||
|
||||
## Section 3: Async Operation Cleanup Verification
|
||||
|
||||
**Purpose:** Verify no "state update on unmounted component" warnings (MEM-03)
|
||||
|
||||
### Test Steps
|
||||
|
||||
1. **Open Console**
|
||||
- [ ] Open browser console (F12 > Console)
|
||||
- [ ] Clear console output
|
||||
|
||||
2. **Rapid Open/Close Test**
|
||||
- [ ] Join a session
|
||||
- [ ] Open recording modal
|
||||
- [ ] **Immediately** close recording modal (before it finishes loading)
|
||||
- [ ] Repeat 10 times as quickly as possible
|
||||
- [ ] Monitor console for warnings
|
||||
|
||||
3. **Check for Warnings**
|
||||
- [ ] Look for "Warning: Can't perform a React state update on an unmounted component"
|
||||
- [ ] Look for "setState called on unmounted component"
|
||||
- [ ] Look for any async-related errors
|
||||
|
||||
4. **Verify App Still Works**
|
||||
- [ ] Open recording modal normally
|
||||
- [ ] Verify audio store type loads correctly
|
||||
- [ ] Verify video sources load (if available)
|
||||
- [ ] Close modal
|
||||
- [ ] Verify no errors
|
||||
|
||||
### Expected Results
|
||||
|
||||
| Check | Expected | Actual |
|
||||
|-------|----------|--------|
|
||||
| No state update warnings | Yes | |
|
||||
| No unmounted component errors | Yes | |
|
||||
| Modal loads correctly after test | Yes | |
|
||||
| Console errors | None | |
|
||||
|
||||
**Section 3 Pass:** [ ]
|
||||
|
||||
---
|
||||
|
||||
## Section 4: 15-Minute Modal Idle Test
|
||||
|
||||
**Purpose:** Verify modal can stay open without memory growth (MEM-03)
|
||||
|
||||
### Test Steps
|
||||
|
||||
1. **Open Performance Monitor**
|
||||
- [ ] Chrome DevTools > More tools > Performance monitor
|
||||
- [ ] Record initial JS heap size: ______ MB
|
||||
|
||||
2. **Open Recording Modal**
|
||||
- [ ] Join a session
|
||||
- [ ] Open recording modal
|
||||
- [ ] Leave modal open
|
||||
- [ ] Note start time: ______
|
||||
|
||||
3. **Wait and Observe**
|
||||
- [ ] Keep modal open for 15+ minutes
|
||||
- [ ] Check heap size every 5 minutes:
|
||||
- 5 min: ______ MB | Responsive? [ ]
|
||||
- 10 min: ______ MB | Responsive? [ ]
|
||||
- 15 min: ______ MB | Responsive? [ ]
|
||||
|
||||
4. **Final Check**
|
||||
- [ ] Note end time: ______
|
||||
- [ ] Total duration: ______ minutes
|
||||
- [ ] Final heap size: ______ MB
|
||||
- [ ] Calculate growth: ______ MB (______ %)
|
||||
|
||||
5. **Close Modal**
|
||||
- [ ] Close recording modal
|
||||
- [ ] Verify no console errors
|
||||
|
||||
### Expected Results
|
||||
|
||||
| Check | Expected | Actual |
|
||||
|-------|----------|--------|
|
||||
| Initial heap size | < 200 MB | |
|
||||
| Final heap size | < 300 MB | |
|
||||
| Growth < 50% | Yes | |
|
||||
| No freezes | Yes | |
|
||||
| UI renders correctly | Yes | |
|
||||
|
||||
**Section 4 Pass:** [ ]
|
||||
|
||||
---
|
||||
|
||||
## Section 5: 15-Minute Active Recording Test
|
||||
|
||||
**Purpose:** Verify active recording doesn't leak memory (MEM-01, MEM-02, MEM-03)
|
||||
|
||||
### Test Steps
|
||||
|
||||
1. **Setup Performance Monitor**
|
||||
- [ ] Chrome DevTools > More tools > Performance monitor
|
||||
- [ ] Record initial JS heap size: ______ MB
|
||||
|
||||
2. **Start Recording**
|
||||
- [ ] Join a session
|
||||
- [ ] Open recording modal
|
||||
- [ ] Fill in recording name: "Memory Test"
|
||||
- [ ] Click "Start Recording"
|
||||
- [ ] Verify recording starts
|
||||
- [ ] Note start time: ______
|
||||
|
||||
3. **Monitor During Recording**
|
||||
- [ ] Keep recording active for 15+ minutes
|
||||
- [ ] Check heap size every 5 minutes:
|
||||
- 5 min: ______ MB | Recording? [ ]
|
||||
- 10 min: ______ MB | Recording? [ ]
|
||||
- 15 min: ______ MB | Recording? [ ]
|
||||
|
||||
4. **Stop Recording**
|
||||
- [ ] Open recording modal
|
||||
- [ ] Click "Stop Recording"
|
||||
- [ ] Verify recording stops
|
||||
- [ ] Note end time: ______
|
||||
- [ ] Total duration: ______ minutes
|
||||
|
||||
5. **Final Memory Check**
|
||||
- [ ] Wait 30 seconds for cleanup
|
||||
- [ ] Note final heap size: ______ MB
|
||||
- [ ] Calculate growth: ______ MB (______ %)
|
||||
|
||||
6. **Verify Recording File**
|
||||
- [ ] Check that recording file was created
|
||||
- [ ] Verify recording duration matches test duration
|
||||
- [ ] Verify recording is playable
|
||||
|
||||
### Expected Results
|
||||
|
||||
| Check | Expected | Actual |
|
||||
|-------|----------|--------|
|
||||
| Recording starts cleanly | Yes | |
|
||||
| Recording runs for 15+ min | Yes | |
|
||||
| Growth < 50% | Yes | |
|
||||
| No freezes | Yes | |
|
||||
| Recording stops cleanly | Yes | |
|
||||
| Recording file created | Yes | |
|
||||
| Console errors | None | |
|
||||
|
||||
**Section 5 Pass:** [ ]
|
||||
|
||||
---
|
||||
|
||||
## Verification Results Summary
|
||||
|
||||
| Section | Status | Notes |
|
||||
|---------|--------|-------|
|
||||
| Quick Verification | | |
|
||||
| Section 1: Timer Cleanup | | |
|
||||
| Section 2: Callback Cleanup | | |
|
||||
| Section 3: Async Cleanup | | |
|
||||
| Section 4: 15-min Modal Idle | | |
|
||||
| Section 5: 15-min Active Recording | | |
|
||||
|
||||
**Overall UAT Status:** [ ] PASS / [ ] FAIL
|
||||
|
||||
**Verifier:** ________________
|
||||
|
||||
**Date:** ________________
|
||||
|
||||
**Notes:**
|
||||
|
||||
---
|
||||
|
||||
## Troubleshooting
|
||||
|
||||
If any section fails:
|
||||
|
||||
### Timer Cleanup Issues
|
||||
- Check `useRecordingHelpers.js` for timer cleanup useEffect
|
||||
- Look for "clearTimeout" in cleanup function
|
||||
- Verify cleanup runs on unmount (add console.log if needed)
|
||||
- Review error stack trace for timer-related issues
|
||||
|
||||
### Callback Accumulation Issues
|
||||
- Type `Object.keys(window.JK)` in console to see registered callbacks
|
||||
- Check `useRecordingHelpers.js` for conditional cleanup logic
|
||||
- Verify callbacksRef is tracking registered callbacks
|
||||
- Look for "delete window.JK[key]" in cleanup function
|
||||
- Check if multiple hook instances are sharing callbacks correctly
|
||||
|
||||
### Async Cleanup Issues
|
||||
- Check `JKSessionRecordingModal.js` for ignore flag pattern
|
||||
- Verify both useEffect hooks have "let ignore = false"
|
||||
- Confirm state updates are wrapped in "if (!ignore)"
|
||||
- Look for "return () => { ignore = true; }" in both hooks
|
||||
- Review error message to identify which async operation failed
|
||||
|
||||
### Memory Growth Issues
|
||||
- Take heap snapshots at start, middle, and end of test
|
||||
- Look for arrays/objects that grow without bound
|
||||
- Check for detached DOM nodes in memory snapshot
|
||||
- Review timer cleanup - timers can accumulate if not cleared
|
||||
- Check callback cleanup - callbacks can hold references
|
||||
- Look for event listeners that aren't being removed
|
||||
|
||||
### Recording Issues
|
||||
- Verify native client is connected and functional
|
||||
- Check that recording REST API calls succeed
|
||||
- Review native client logs for recording errors
|
||||
- Ensure OBS Studio is installed (if recording video)
|
||||
- Check that audio/video sources are available
|
||||
|
||||
---
|
||||
|
||||
*UAT Template Version: 1.1*
|
||||
*Created: 2026-02-24*
|
||||
*For: Phase 25 - Recording Memory Leak Audit*
|
||||
*Based on: Phase 23 UAT Template*
|
||||
Loading…
Reference in New Issue