Spaces:
Running
Running
AutoSite Application Test Plan
Overview
This test plan outlines a comprehensive approach to debug and verify the functionality of the AutoSite application, with particular focus on the AskAI component and its integration with the backend.
Prerequisites
- Environment setup
- Create a
.env
file based on.env.example
- Ensure
DEFAULT_HF_TOKEN
is set with a valid Hugging Face API token - Verify
OAUTH_CLIENT_ID
andOAUTH_CLIENT_SECRET
if testing authentication
- Create a
Test Cases
1. Basic Application Functionality
Verify UI Components
- Editor panel renders correctly
- Preview panel displays HTML content
- Resizer works for adjusting panel sizes
- Responsive design works on different screen sizes
Code Editor
- HTML editing works correctly
- Syntax highlighting functions
- Error validation works
2. AskAI Component Testing
2.1 UI Elements
Input Field
- Placeholder text changes after first query
- Disabled state works during AI processing
- Enter key triggers AI request
Progress Indicators
- Progress bar appears and updates during streaming
- Response mode indicator shows correct mode (diff/full)
- Loading animation displays correctly
- Success animation plays after completion
2.2 API Integration
Full HTML Mode
- Initial requests generate complete HTML
- Streaming updates preview in real-time
- Final HTML is properly formatted
- Success sound plays on completion
Diff Mode
- Follow-up requests use diff mode
- Diffs are correctly sent to server
- Server applies diffs correctly
- Original HTML is preserved if diff application fails
2.3 Error Handling
Authentication Errors
- Login modal appears when rate limit exceeded
- Error messages display correctly
Network Errors
- Appropriate error handling for failed requests
- UI recovers gracefully from errors
Malformed Responses
- Application handles incomplete HTML
- Application handles malformed diffs
3. Backend Testing
3.1 API Endpoints
/api/ask-ai
- Correctly processes different prompt types
- Rate limiting works as expected
- Streaming response works correctly
- Sets appropriate response headers
/api/apply-diffs
- Correctly parses diff blocks
- Applies changes accurately
- Handles edge cases (empty blocks, malformed blocks)
- Returns appropriate error messages
3.2 Authentication
- HuggingFace OAuth
- Login flow works correctly
- Token storage and retrieval works
- User information is correctly fetched
Visual Testing
UI Components
- Verify all UI elements render correctly across different screen sizes
- Check animations and transitions
- Verify loading states and progress indicators
Accessibility
- Verify keyboard navigation
- Check color contrast
- Verify screen reader compatibility
Performance Testing
- Measure response time for AI requests
- Verify memory usage during streaming
- Check for UI freezing during intensive operations
Security Testing
- Verify token handling
- Check for exposed secrets
- Verify rate limiting effectiveness
Recommendations
Environment Setup
- Create a comprehensive setup guide for developers
- Document all required environment variables
Error Handling
- Enhance error messages for common setup issues
- Add more detailed logging for debugging
Testing Tools
- Implement automated tests for critical paths
- Create a test harness for simulating AI responses
Documentation
- Document the different response modes
- Create troubleshooting guides for common issues