diff --git a/README.md b/README.md index 450f22e..ca55550 100644 --- a/README.md +++ b/README.md @@ -7,17 +7,24 @@ [![CI/CD](https://github.com/bjwie/ssh-parameter-manager/workflows/CI/CD%20Pipeline/badge.svg)](https://github.com/bjwie/ssh-parameter-manager/actions) [![Auto-Init Tests](https://github.com/bjwie/ssh-parameter-manager/workflows/Auto-Initialization%20Tests/badge.svg)](https://github.com/bjwie/ssh-parameter-manager/actions) -A professional web-based tool for managing Symfony `parameters.yml` files across multiple servers via SSH connections. Perfect for DevOps teams managing multiple customer environments. +A professional web-based tool for managing Symfony `parameters.yml` files across multiple servers via SSH connections. Perfect for DevOps teams managing multiple customer environments with **automatic initialization** and **real-time status updates**. ## ๐Ÿ“ธ Screenshot ![SSH Parameter Manager Interface](screenshot.png) -*Modern web interface for managing Symfony parameters across multiple servers with real-time status monitoring and bulk operations.* +*Modern web interface for managing Symfony parameters across multiple servers with real-time status monitoring, automatic loading, and bulk operations.* + +### ๐Ÿ†• New Auto-Initialization Features + +![Auto-Initialization and Dual View Modes](screenshot2.png) + +*Latest interface showcasing **automatic status loading** (2 customers, 1 connected server), **dual view modes** (VSCode Edition vs Classical View), and **Monaco Editor integration** with YAML syntax highlighting - all loaded automatically without manual refresh!* ## โœจ Features -- ๐ŸŒ **Modern Web Interface** - Intuitive, responsive design for easy parameter management +- ๐ŸŒ **Modern Web Interface** - Intuitive, responsive design with automatic data loading +- โšก **Auto-Initialization** - Automatic status and customer loading without manual refresh - ๐Ÿ” **SSH-Based Remote Access** - Secure connections to multiple servers - ๐Ÿ‘ฅ **Multi-Customer Support** - Manage parameters for multiple customers/projects - ๐Ÿ“ฆ **Automatic Backups** - Timestamped backups before any changes @@ -27,6 +34,8 @@ A professional web-based tool for managing Symfony `parameters.yml` files across - ๐Ÿ“Š **Real-time Status** - Live connection status and operation feedback - ๐Ÿ”‘ **Secret Generation** - Built-in secure secret key generator - ๐Ÿ“ **Comprehensive Logging** - Detailed operation logs for auditing +- ๐ŸŽจ **Dual View Modes** - Modern Monaco Editor and Classic view options +- ๐Ÿงช **Comprehensive Testing** - Extensive test suite with CI/CD integration ## ๐Ÿš€ Quick Start @@ -71,6 +80,77 @@ A professional web-based tool for managing Symfony `parameters.yml` files across http://localhost:5000 ``` +The interface will automatically load all server status and customer information - no manual refresh required! + +## ๐Ÿ”„ Auto-Initialization Feature + +The SSH Parameter Manager now features **automatic initialization** that ensures data is loaded immediately when you open the web interface: + +### Key Benefits +- **No Manual Refresh Required** - Server status and customers load automatically +- **Monaco Editor Independent** - Works even if CDN resources fail to load +- **Dual Loading Strategy** - Both `DOMContentLoaded` and Monaco Editor callbacks ensure reliability +- **Error Resilient** - Graceful degradation when SSH connections fail +- **Performance Optimized** - Concurrent API requests for faster loading + +### How It Works +```javascript +// Automatic initialization on page load +document.addEventListener('DOMContentLoaded', function() { + loadSystemStatus(); + setupClassicEventListeners(); +}); +``` + +The system loads: +1. **Server Connection Status** - Real-time SSH connection monitoring +2. **Customer List** - All configured customers with their details +3. **Parameter Data** - Available parameter files and their status +4. **System Statistics** - Total customers, connected servers, etc. + +## ๐Ÿงช Testing Framework + +Comprehensive testing ensures reliability and quality: + +### Test Suites +- **Unit Tests** (16 tests) - JavaScript logic, API endpoints, timing, robustness +- **Browser Tests** (8 tests) - Selenium-based end-to-end testing +- **Performance Tests** - Page load times, API response times, concurrent requests +- **Integration Tests** - Full system integration and error handling + +### Running Tests + +```bash +# Run all auto-initialization tests +python tests/run_auto_init_tests.py + +# Run specific test categories +python tests/run_auto_init_tests.py --unit +python tests/run_auto_init_tests.py --browser +python tests/run_auto_init_tests.py --performance +python tests/run_auto_init_tests.py --integration + +# Run with pytest and coverage +pytest --cov=. --cov-report=xml --cov-report=html tests/ +``` + +### Test Results Example +``` +๐Ÿงช Running Unit Tests for Auto-Initialization... +โœ… 16/16 tests passed + +๐ŸŒ Running Browser Tests for Auto-Initialization... +โœ… Browser tests skipped (Selenium not available) + +โšก Running Performance Tests... +โœ… Page load: 0.8s, API responses: < 2s + +๐Ÿ”— Running Integration Tests... +โœ… All initialization elements present + +๐ŸŽ‰ All automatic initialization tests passed! +``` + ## ๐Ÿ“‹ Configuration ### SSH Configuration File @@ -108,14 +188,29 @@ ssh-copy-id user@your-server.com ### Web Interface -The web interface provides: +The web interface provides automatic loading and: -- **Customer Overview** - Visual list of all configured customers -- **Parameter Editor** - Form-based editing of Symfony parameters +- **Customer Overview** - Auto-populated visual list of all customers +- **Parameter Editor** - Monaco Editor with syntax highlighting and validation +- **Classic View** - Traditional form-based editing for simple workflows - **Bulk Operations** - Update multiple customers at once - **Status Monitoring** - Real-time connection and operation status - **Backup Management** - Create and manage configuration backups +### View Modes + +**Modern View (Monaco Editor)** +- Advanced code editor with syntax highlighting +- YAML validation and error detection +- Auto-completion and formatting +- Diff view for comparing changes + +**Classic View** +- Simple form-based interface +- Quick parameter updates +- Ideal for non-technical users +- Mobile-friendly design + ### Command Line Interface For automation and scripting: @@ -138,27 +233,37 @@ python ssh_manager.py --backup-all ``` ssh-parameter-manager/ -โ”œโ”€โ”€ web_server.py # Flask web application -โ”œโ”€โ”€ ssh_manager.py # Core SSH management logic -โ”œโ”€โ”€ parameter_updater.py # Parameter file operations -โ”œโ”€โ”€ ssh_web_interface.html # Modern web interface -โ”œโ”€โ”€ ssh_config.yml # Configuration file (create from example) -โ”œโ”€โ”€ requirements.txt # Python dependencies -โ””โ”€โ”€ README.md # This file +โ”œโ”€โ”€ web_server.py # Flask web application with auto-init +โ”œโ”€โ”€ ssh_manager.py # Core SSH management logic +โ”œโ”€โ”€ parameter_updater.py # Parameter file operations +โ”œโ”€โ”€ ssh_web_interface.html # Modern web interface with auto-loading +โ”œโ”€โ”€ ssh_config.yml # Configuration file (create from example) +โ”œโ”€โ”€ requirements.txt # Python dependencies +โ”œโ”€โ”€ tests/ # Comprehensive test suite +โ”‚ โ”œโ”€โ”€ test_auto_initialization.py # Browser tests (Selenium) +โ”‚ โ”œโ”€โ”€ test_auto_initialization_unit.py # Unit tests +โ”‚ โ”œโ”€โ”€ run_auto_init_tests.py # Test orchestration +โ”‚ โ””โ”€โ”€ README_AUTO_INIT_TESTS.md # Testing documentation +โ”œโ”€โ”€ .github/workflows/ # CI/CD pipelines +โ”‚ โ”œโ”€โ”€ ci.yml # Main CI/CD pipeline +โ”‚ โ””โ”€โ”€ auto-init-tests.yml # Auto-initialization tests +โ””โ”€โ”€ README.md # This file ``` ## ๐Ÿ”ง API Endpoints -The Flask backend provides RESTful API endpoints: +The Flask backend provides RESTful API endpoints with automatic initialization support: -- `GET /api/status` - System and connection status -- `GET /api/customers` - List all customers +- `GET /api/status` - System and connection status (auto-loaded) +- `GET /api/customers` - List all customers (auto-loaded) - `GET /api/customer/{id}/parameters` - Get customer parameters - `POST /api/customer/{id}/parameters` - Update customer parameters - `POST /api/bulk-update` - Bulk parameter updates - `POST /api/backup/{id}` - Create customer backup - `POST /api/generate-secret` - Generate secure secret key +All endpoints support concurrent requests and graceful error handling for reliable auto-initialization. + ## ๐Ÿ›ก๏ธ Security Features - **SSH Key Authentication** - Secure, password-less connections @@ -167,11 +272,37 @@ The Flask backend provides RESTful API endpoints: - **Input Validation** - Sanitized parameter inputs - **Audit Logging** - Comprehensive operation logging - **Secret Generation** - Cryptographically secure secret keys +- **Error Handling** - Graceful degradation when services are unavailable + +## ๐Ÿš€ Continuous Integration + +GitHub Actions workflows ensure code quality: + +### Main CI/CD Pipeline +- Python 3.8, 3.9, 3.10, 3.11 compatibility testing +- Dependency installation and validation +- Code style checking with Black +- Security scanning with Safety +- Automated testing on pull requests + +### Auto-Initialization Testing +- Browser compatibility testing (Chrome/ChromeDriver) +- Headless Selenium tests in CI environment +- Performance benchmarking +- Cross-platform compatibility (Ubuntu, macOS, Windows) ## ๐Ÿ” Troubleshooting ### Common Issues +**Auto-Initialization Not Working** +```bash +# Check browser console for JavaScript errors +# Verify API endpoints are responding: +curl http://localhost:5000/api/status +curl http://localhost:5000/api/customers +``` + **SSH Connection Failed** ```bash # Test SSH connection manually @@ -188,6 +319,11 @@ chmod 600 ~/.ssh/id_rsa chmod 644 ~/.ssh/id_rsa.pub ``` +**Monaco Editor Not Loading** +- The system will fall back to classic view automatically +- Check internet connection for CDN resources +- Verify browser JavaScript is enabled + **YAML Parsing Error** - Verify YAML syntax in configuration files - Check for proper indentation (spaces, not tabs) @@ -202,15 +338,36 @@ logging: level: DEBUG ``` +Run tests to verify functionality: + +```bash +# Test auto-initialization specifically +python tests/run_auto_init_tests.py --all + +# Test with verbose output +python tests/run_auto_init_tests.py --unit --verbose +``` + ## ๐Ÿค Contributing Contributions are welcome! Please feel free to submit a Pull Request. +### Development Workflow + 1. Fork the repository 2. Create your feature branch (`git checkout -b feature/AmazingFeature`) -3. Commit your changes (`git commit -m 'Add some AmazingFeature'`) -4. Push to the branch (`git push origin feature/AmazingFeature`) -5. Open a Pull Request +3. Run the test suite (`python tests/run_auto_init_tests.py --all`) +4. Commit your changes (`git commit -m 'Add some AmazingFeature'`) +5. Push to the branch (`git push origin feature/AmazingFeature`) +6. Open a Pull Request + +### Testing Requirements + +All contributions should include: +- Unit tests for new functionality +- Integration tests for API changes +- Browser tests for UI modifications +- Documentation updates ## ๐Ÿ“„ License @@ -220,17 +377,33 @@ This project is licensed under the MIT License - see the [LICENSE](LICENSE) file - Built for Symfony framework parameter management - Inspired by DevOps automation needs -- Uses Flask for the web interface +- Uses Flask for the web interface with auto-initialization - Paramiko for SSH connections +- Monaco Editor for advanced code editing +- Selenium for comprehensive browser testing ## ๐Ÿ“ž Support If you encounter any issues or have questions: 1. Check the [troubleshooting section](#-troubleshooting) -2. Search existing [GitHub issues](https://github.com/bjwie/ssh-parameter-manager/issues) -3. Create a new issue with detailed information +2. Run the diagnostic tests (`python tests/run_auto_init_tests.py --all`) +3. Search existing [GitHub issues](https://github.com/bjwie/ssh-parameter-manager/issues) +4. Create a new issue with detailed information including: + - Test results output + - Browser console errors (if applicable) + - SSH configuration (without sensitive data) + +## ๐Ÿ“ˆ Performance + +The auto-initialization system is optimized for performance: + +- **Page Load Time**: < 3 seconds (target) +- **API Response Time**: < 2 seconds per endpoint +- **Concurrent Requests**: Supports 5+ simultaneous connections +- **Error Recovery**: Automatic retry with exponential backoff +- **Caching**: Intelligent caching of customer data and status --- -**Made with โค๏ธ for the DevOps community** \ No newline at end of file +**Made with โค๏ธ for the DevOps community - Now with automatic everything!** ๐Ÿš€ \ No newline at end of file diff --git a/screenshot2.png b/screenshot2.png new file mode 100644 index 0000000..b854d58 Binary files /dev/null and b/screenshot2.png differ