SuperCharged-Claude-Code-Upgrade/test-manual.md

# Manual Test Checklist

**Date:** 2025-01-19
**Feature:** Landing Page Workflow Enhancement
**Status:** Ready for Testing

## Create New Project Flows

### Blank Project
- [ ] Blank project with valid name (e.g., "MyProject")
- [ ] Blank project with invalid characters (/, \, <, >, :, ", |, ?, *) - button should stay disabled
- [ ] Blank project with empty name - button should stay disabled
- [ ] Character counter shows correct count (N/50)
- [ ] Character counter turns orange at ≥45 characters
- [ ] Character counter turns red at 50 characters
- [ ] Character counter shows "Invalid characters" message for invalid input
- [ ] Verify project name is set correctly in session metadata
- [ ] Verify loading overlay shows "Creating project..." message
- [ ] Verify navigation to IDE with correct session ID

### Template Projects
- [ ] React App template
- [ ] Node.js API template
- [ ] HTML Calculator template
- [ ] Portfolio template
- [ ] Verify each template creates session with correct metadata

## Load Existing Project Flows

### Session Cards Display
- [ ] Active sessions show 💬 icon
- [ ] Historical sessions show 📁 icon
- [ ] Project name displays correctly
- [ ] Working directory displays (monospace font)
- [ ] Last message preview displays
- [ ] File count badge shows correct number
- [ ] Relative time displays correctly (e.g., "5 min ago")
- [ ] Status badge shows correct state (Running/Historical)

### Navigation
- [ ] Click Continue button on active session → navigates to IDE
- [ ] Click on session card body → navigates to IDE
- [ ] Verify session ID parameter in URL
- [ ] Verify loading overlay shows "Opening workspace..."
- [ ] Test with historical session

### Empty States
- [ ] No sessions → shows empty state with message
- [ ] Failed to load sessions → shows error state

## Inline Editing

### Edit Functionality
- [ ] Click project name → enters edit mode
- [ ] Input field appears with current name
- [ ] Save and Cancel buttons appear
- [ ] Type new name and press Enter → saves
- [ ] Type new name and click Save → saves
- [ ] Click away (blur) → cancels
- [ ] Press Escape → cancels
- [ ] Edit button → enters edit mode
- [ ] Verify "Saving..." state during save

### Constraints
- [ ] Try to edit historical session → should not work
- [ ] Verify name persists after page refresh
- [ ] Verify duplicate names are allowed

### Validation
- [ ] Cannot edit to empty name
- [ ] Cannot edit to name with invalid characters

## Quick Actions Menu

### Menu Display
- [ ] Click menu button (⋮) → dropdown appears
- [ ] Menu positioned correctly below button
- [ ] Click outside menu → menu closes
- [ ] Click another menu → old menu closes, new one opens

### Duplicate Action
- [ ] Click Duplicate → creates new session
- [ ] Verify "(copy)" suffix or similar in new session name
- [ ] Verify original session still exists
- [ ] Verify success toast shows
- [ ] Verify session list refreshes after duplication
- [ ] Verify duplicated session has same working directory

### Delete Action
- [ ] Click Delete → confirmation dialog appears
- [ ] Cancel confirmation → session remains
- [ ] Confirm deletion → session removed
- [ ] Verify success toast shows
- [ ] Verify session list refreshes after deletion
- [ ] Verify session file is deleted from disk

### Edge Cases
- [ ] Try to delete currently running session
- [ ] Rapid menu open/close
- [ ] Multiple rapid duplicate operations

## Loading States

### Overlay Display
- [ ] Create blank project → shows "Creating project..."
- [ ] Duplicate session → shows "Duplicating project..."
- [ ] Click Continue → shows "Opening workspace..."
- [ ] Overlay appears with spinner animation
- [ ] Overlay has semi-transparent black background
- [ ] Overlay covers entire viewport
- [ ] Text message is visible and readable

### Timing
- [ ] Overlay appears immediately
- [ ] Overlay stays visible for minimum 300ms
- [ ] Overlay fades out smoothly

## Error Handling

### Network Errors
- [ ] Disconnect network → try to create project
- [ ] Verify error toast shows generic message
- [ ] Verify overlay disappears on error
- [ ] Verify button state is correct after error

### Validation Errors
- [ ] Try to create project with invalid characters
- [ ] Verify button stays disabled
- [ ] Verify "Invalid characters" message shows
- [ ] Try to save invalid name via inline edit

### Server Errors
- [ ] Server returns 500 error
- [ ] Verify generic error message displayed
- [ ] Verify no sensitive error details leaked

## Responsive Design

### Desktop (1920px+)
- [ ] Cards display in full layout
- [ ] All three columns visible
- [ ] Hover effects work correctly
- [ ] Menu dropdowns positioned correctly

### Tablet (768px)
- [ ] Layout adjusts appropriately
- [ ] Continue button remains accessible
- [ ] Menu dropdowns positioned correctly
- [ ] Touch targets are large enough

### Mobile (375px)
- [ ] Single column layout
- [ ] Buttons stack vertically
- [ ] Touch targets are finger-friendly (min 44px)
- [ ] Text remains readable
- [ ] No horizontal scrolling

## Accessibility

### Keyboard Navigation
- [ ] Tab through all interactive elements
- [ ] Focus indicators are visible
- [ ] Enter key activates buttons
- [ ] Escape key closes menus
- [ ] Arrow keys work where expected

### Screen Reader
- [ ] All buttons have aria-label
- [ ] Menu state (aria-expanded) updates correctly
- [ ] Toast announcements are announced
- [ ] Error messages are announced

### Visual Feedback
- [ ] Hover states on all interactive elements
- [ ] Focus states on all keyboard-navigable elements
- [ ] Loading states are visible
- [ ] Success/error states use color + icons

## Cross-Browser Testing

### Chrome
- [ ] All features work correctly
- [ ] No console errors
- [ ] Performance is acceptable

### Firefox
- [ ] All features work correctly
- [ ] No console errors
- [ ] Styling matches Chrome

### Safari
- [ ] All features work correctly
- [ ] No console errors
- [ ] Animations render smoothly

## Performance

### Load Time
- [ ] Landing page loads in < 2 seconds
- [ ] Session cards render quickly
- [ ] No janky animations

### Memory
- [ ] No memory leaks after extended use
- [ ] Event listeners are properly cleaned up
- [ ] Menu dropdowns don't accumulate

## Security

### XSS Prevention
- [ ] Try entering HTML in project name
- [ ] Try entering script tags
- [ ] Verify all output is escaped
- [ ] Verify no code executes

### Input Validation
- [ ] All invalid characters are rejected
- [ ] Length limits are enforced
- [ ] No SQL injection vectors

---

## Test Notes

**Test Environment:**
- Browser: ___________
- Screen Resolution: ___________
- OS: ___________
- Date: ___________

**Tester:** ___________

**Overall Status:** Pass / Fail

**Bugs Found:**
1.
2.
3.

**Suggestions:**
1.
2.
3.