Loading...
Loading...
Systematic workflow for verifying bug fixes to ensure quality and prevent regres...
npx skill4agent add bobmatnyc/claude-mpm-skills bug-fix## Bug Reproduction
### Steps to Reproduce
1. Navigate to `/dashboard`
2. Click "Export Data" button
3. Select date range: Jan 1 - Dec 31
4. Click "Generate Report"
### Expected Behavior
- Report downloads as CSV file
- File contains all transactions for date range
- Download completes in < 5 seconds
### Actual Behavior
- Error appears: "Failed to generate report"
- Console error: `TypeError: Cannot read property 'map' of undefined`
- No file downloads
- Issue occurs 100% of the time
### Environment
- Browser: Chrome 120.0.6099.109
- OS: macOS 14.2
- User Role: Admin
- Data Size: ~10,000 transactions
### Screenshots

## Root Cause Analysis
### Investigation
- Error occurs in `generateReport()` function at line 45
- Function assumes `transactions` array always exists
- When date range returns no results, backend returns `null`
- Frontend doesn't handle `null` case, tries to call `.map()` on `null`
### Root Cause
- Missing null check before array operations
- Backend API doesn't return consistent data structure (sometimes `[]`, sometimes `null`)
- No validation of API response shape
### Why This Wasn't Caught
- Unit tests only covered happy path (data exists)
- Integration tests didn't test empty result scenario
- Backend inconsistency not documented in API contract// BEFORE (Bug)
function generateReport(transactions) {
return transactions.map(t => ({
date: t.date,
amount: t.amount,
}));
}
// AFTER (Fixed)
function generateReport(transactions) {
// Guard against null/undefined from backend
if (!transactions || !Array.isArray(transactions)) {
console.warn('No transactions to export');
return [];
}
return transactions.map(t => ({
date: t.date,
amount: t.amount,
}));
}## Fix Verification
### Testing Performed
1. ✅ Followed original reproduction steps - bug no longer occurs
2. ✅ Tested with empty date range - shows "No data to export" message
3. ✅ Tested with valid date range - exports successfully
4. ✅ Tested with large dataset (50k+ transactions) - works correctly
5. ✅ Tested in Chrome, Firefox, Safari - all working
6. ✅ Tested on staging environment - fix confirmed
### Edge Cases Tested
- Empty result set → Shows appropriate message
- Null response from API → Handled gracefully
- Single transaction → Exports correctly
- Malformed transaction data → Logs error, doesn't crash
### No New Issues
- ✅ No console errors
- ✅ No memory leaks
- ✅ No performance degradation
- ✅ Other export features still workdescribe('generateReport', () => {
// Test that reproduces original bug
it('should handle null transactions gracefully', () => {
const result = generateReport(null);
expect(result).toEqual([]);
expect(console.warn).toHaveBeenCalledWith('No transactions to export');
});
// Edge cases
it('should handle undefined transactions', () => {
const result = generateReport(undefined);
expect(result).toEqual([]);
});
it('should handle empty array', () => {
const result = generateReport([]);
expect(result).toEqual([]);
});
it('should handle single transaction', () => {
const transactions = [{ date: '2025-01-01', amount: 100 }];
const result = generateReport(transactions);
expect(result).toHaveLength(1);
expect(result[0]).toEqual({ date: '2025-01-01', amount: 100 });
});
// Original happy path (should still work)
it('should transform multiple transactions correctly', () => {
const transactions = [
{ date: '2025-01-01', amount: 100 },
{ date: '2025-01-02', amount: 200 },
];
const result = generateReport(transactions);
expect(result).toHaveLength(2);
});
});## Bug Fix: [Brief Description]
**Ticket**: #123 / ENG-456 / JIRA-789
### Problem
[Clear description of the bug]
### Reproduction Steps (Before Fix)
1. [Step 1]
2. [Step 2]
3. [Error occurs]
**Expected**: [What should happen]
**Actual**: [What happened instead]
### Root Cause
[Detailed explanation of why bug occurred]
- Where: `src/utils/report.ts`, line 45
- Why: Null check missing before array operation
- Impact: Affects all users trying to export with empty date ranges
### Solution
[Explanation of how fix works]
- Added null/undefined check before array operations
- Return empty array instead of crashing
- Added user-facing warning message
- Updated API response handling to be more defensive
### Fix Verification (After)
1. ✅ Followed reproduction steps - bug no longer occurs
2. ✅ Tested edge cases (null, undefined, empty array)
3. ✅ Tested across browsers (Chrome, Firefox, Safari)
4. ✅ Verified on staging environment
5. ✅ No new console errors or warnings
### Test Coverage
- Added unit tests for null/undefined handling
- Added tests for empty array edge case
- Updated integration tests for export feature
- All existing tests still passing
**Coverage**: +15 lines covered, 0 lines uncovered
### Regression Prevention
- [x] Tests added that would catch this bug if reintroduced
- [x] Similar patterns checked in codebase (found 2, fixed in this PR)
- [x] Documentation updated to note API response inconsistency
### Screenshots/Evidence
**Before (Bug)**:

**After (Fixed)**:


### Deployment Notes
- No migrations required
- No environment variable changes
- Safe to deploy immediately
- Rollback: Revert this commit
### Related Issues
- Closes #123
- Related to #456 (similar null handling issue).github/PULL_REQUEST_TEMPLATE/bug_fix.md## Bug Fix
**Ticket**: [Ticket number/link]
### Problem
[Description of bug]
### Reproduction Steps (Before Fix)
1.
2.
3.
**Expected**:
**Actual**:
### Root Cause
[Explanation of why bug occurred]
### Solution
[How fix works]
### Verification (After)
- [ ] Original reproduction steps no longer trigger bug
- [ ] Edge cases tested
- [ ] Tested in multiple browsers/environments
- [ ] No new errors or warnings
### Test Coverage
- [ ] Tests added for bug scenario
- [ ] Tests added for edge cases
- [ ] All existing tests passing
### Screenshots
**Before**: [Screenshot]
**After**: [Screenshot]name: Bug Fix Verification
on:
pull_request:
types: [opened, synchronize]
jobs:
verify-bug-fix:
if: contains(github.event.pull_request.labels.*.name, 'bug')
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- name: Check PR description
run: |
PR_BODY="${{ github.event.pull_request.body }}"
if [[ ! "$PR_BODY" =~ "Root Cause" ]]; then
echo "::error::Bug fix PR must document root cause"
exit 1
fi
if [[ ! "$PR_BODY" =~ "Verification" ]]; then
echo "::error::Bug fix PR must document verification steps"
exit 1
fi
- name: Run tests
run: npm test
- name: Check test coverage
run: |
COVERAGE=$(npm test -- --coverage --json | jq '.total.lines.pct')
if (( $(echo "$COVERAGE < 90" | bc -l) )); then
echo "::warning::Test coverage is below 90%"
fiuniversal-verification-pre-mergeuniversal-verification-screenshotuniversal-debugging-systematic-debugginguniversal-debugging-root-cause-tracinguniversal-testing-testing-anti-patterns