--- name: cypress-ci-cd description: Use when cypress CI/CD integration including parallelization, test recording, and media capture. allowed-tools: [Read, Write, Edit, Bash, Glob, Grep] --- # cypress ci cd Master Cypress CI/CD integration including parallelization, test recording, and media capture. This skill provides comprehensive coverage of essential concepts, patterns, and best practices for professional Cypress development. ## Overview Cypress is a powerful tool for javascript development, providing robust capabilities for maintaining code quality and ensuring reliable software delivery. This skill covers the fundamental through advanced aspects of working with Cypress. ## Installation and Setup ### Basic Installation Setting up Cypress requires proper installation and configuration in your development environment. ```bash # Installation command specific to Cypress # Follow official documentation for latest version ``` ### Project Configuration Create appropriate configuration files and setup for your project structure: - Configuration file setup - Project structure organization - Team collaboration setup - CI/CD integration preparation ## Core Concepts ### Fundamental Principles Understanding the core principles of Cypress is essential for effective usage: 1. **Architecture** - How Cypress is structured and operates 2. **Configuration** - Setting up and customizing behavior 3. **Integration** - Working with other tools and frameworks 4. **Best Practices** - Industry-standard approaches ### Key Features Cypress provides several key features that make it valuable: - Feature 1: Core functionality - Feature 2: Advanced capabilities - Feature 3: Integration options - Feature 4: Performance optimization - Feature 5: Extensibility ### Configuration Strategy Proper configuration ensures Cypress works optimally: - Environment-specific setup - Team standards enforcement - Performance tuning - Error handling configuration ### Advanced Usage For complex scenarios, Cypress offers advanced capabilities: - Custom extensions - Advanced patterns - Performance optimization - Scalability considerations ## Code Examples ### Example 1: Basic Setup ```javascript // Basic Cypress setup // Demonstrates fundamental usage patterns // Shows proper initialization and configuration // Core setup code function basicSetup() { // Initialize framework // Configure basic options // Return configured instance } // Usage example const instance = basicSetup(); ``` ### Example 2: Configuration ```javascript // Configuration example for Cypress // Shows how to properly configure // Includes common options and patterns // Configuration object const config = { option1: 'value1', option2: 'value2', advanced: { setting1: true, setting2: false } }; // Apply configuration function applyConfig(config) { // Validation logic // Application logic // Return result } ``` ### Example 3: Advanced Pattern ```javascript // Advanced usage pattern // Demonstrates sophisticated techniques // Shows best practices in action function advancedPattern() { // Setup phase // Execution phase // Cleanup phase } ``` ### Example 4: Integration ```javascript // Integration with other tools // Shows real-world usage // Demonstrates interoperability function integrationExample() { // Setup integration // Execute workflow // Handle results } ``` ### Example 5: Error Handling ```javascript // Proper error handling approach // Defensive programming patterns // Graceful degradation function withErrorHandling() { try { // Main logic } catch (error) { // Error recovery } finally { // Cleanup } } ``` ### Example 6: Performance Optimization ```javascript // Performance-optimized implementation // Shows efficiency techniques // Demonstrates best practices function optimizedApproach() { // Efficient implementation // Resource management // Performance monitoring } ``` ### Example 7: Testing ```javascript // Testing approach for Cypress // Unit test examples // Integration test patterns function testExample() { // Test setup // Execution // Assertions // Teardown } ``` ### Example 8: Production Usage ```javascript // Production-ready implementation // Includes monitoring and logging // Error recovery and resilience function productionExample() { // Production configuration // Monitoring setup // Error handling // Logging } ``` ## Best Practices 1. **Follow conventions** - Adhere to established naming and structural patterns for consistency 2. **Configure appropriately** - Set up framework configuration that matches project requirements 3. **Validate inputs** - Always validate and sanitize inputs before processing 4. **Handle errors gracefully** - Implement comprehensive error handling and recovery 5. **Document decisions** - Comment configuration choices and non-obvious implementations 6. **Test thoroughly** - Write comprehensive tests for all functionality 7. **Optimize performance** - Profile and optimize critical paths 8. **Maintain security** - Follow security best practices and guidelines 9. **Keep updated** - Regularly update framework and dependencies 10. **Monitor production** - Implement logging and monitoring for production systems ## Common Pitfalls 1. **Incorrect configuration** - Misconfiguration leads to unexpected behavior and bugs 2. **Missing error handling** - Not handling edge cases causes production issues 3. **Poor performance** - Not optimizing leads to scalability problems 4. **Inadequate testing** - Insufficient test coverage misses bugs 5. **Security vulnerabilities** - Not following security best practices exposes risks 6. **Tight coupling** - Poor architecture makes maintenance difficult 7. **Ignoring warnings** - Dismissing framework warnings leads to future problems 8. **Outdated dependencies** - Using old versions exposes security risks 9. **No monitoring** - Lack of observability makes debugging difficult 10. **Inconsistent standards** - Team inconsistency reduces code quality ## Advanced Topics ### Customization Cypress allows extensive customization for specific needs: - Custom plugins and extensions - Behavior modification - Integration adapters - Domain-specific adaptations ### Performance Tuning Optimize Cypress performance for production: - Profiling and benchmarking - Resource optimization - Caching strategies - Parallel execution ### CI/CD Integration Integrate Cypress into continuous integration pipelines: - Automated execution - Result reporting - Quality gates - Deployment integration ### Troubleshooting Common issues and their solutions: - Configuration errors - Integration problems - Performance issues - Unexpected behavior ## When to Use This Skill - Setting up Cypress in new projects - Configuring Cypress for specific requirements - Migrating to Cypress from alternatives - Optimizing Cypress performance - Implementing advanced patterns - Troubleshooting Cypress issues - Integrating Cypress with CI/CD - Training team members on Cypress - Establishing team standards - Maintaining existing Cypress implementations ## Additional Resources ### Documentation - Official Cypress documentation - Community guides and tutorials - API reference materials - Migration guides ### Tools and Utilities - Development tools - Testing utilities - Monitoring solutions - Helper libraries ### Community - Online forums and communities - Open source contributions - Best practice repositories - Example implementations ## Conclusion Mastering Cypress requires understanding both fundamentals and advanced concepts. This skill provides the foundation for professional-grade usage, from initial setup through production deployment. Apply these principles consistently for best results. ## Detailed Configuration Examples ### Configuration Option 1 Comprehensive configuration example demonstrating best practices and common patterns used in production environments. ```bash # Detailed configuration setup # Includes all necessary options # Optimized for production use ``` ### Configuration Option 2 Alternative configuration approach for different use cases, showing flexibility and adaptability of the framework. ```bash # Alternative configuration # Different optimization strategy # Suitable for specific scenarios ``` ### Configuration Option 3 Advanced configuration for complex environments with multiple requirements and constraints. ```bash # Advanced configuration # Handles complex scenarios # Production-ready setup ``` ## Advanced Usage Patterns ### Pattern 1: Modular Organization Organize your setup in a modular way to improve maintainability and scalability across large projects. Implementation details: - Separate concerns appropriately - Use composition over inheritance - Follow single responsibility principle - Maintain clear interfaces ### Pattern 2: Performance Optimization Optimize for performance in production environments with proven strategies and techniques. Key considerations: - Profile before optimizing - Focus on bottlenecks - Cache appropriately - Monitor in production ### Pattern 3: Error Recovery Implement robust error recovery mechanisms to handle failures gracefully. Recovery strategies: - Graceful degradation - Retry with backoff - Circuit breaker pattern - Comprehensive logging ### Pattern 4: Testing Strategy Comprehensive testing approach ensuring code quality and reliability. Testing layers: - Unit tests for components - Integration tests for workflows - End-to-end tests for user scenarios - Performance tests for scalability ## Integration Strategies ### Integration with CI/CD Seamless integration into continuous integration and deployment pipelines. Steps: 1. Configure pipeline 2. Set up automation 3. Define quality gates 4. Monitor execution ### Integration with Development Tools Connect with popular development tools and IDEs for improved workflow. Tools: - IDE plugins and extensions - CLI tools and utilities - Build system integration - Version control hooks ### Integration with Monitoring Implement monitoring and observability for production systems. Monitoring aspects: - Performance metrics - Error tracking - Usage analytics - Health checks ## Team Practices ### Establishing Standards Create and maintain consistent standards across the team. Standards to define: - Naming conventions - Code organization - Documentation requirements - Review processes ### Onboarding Process Streamline onboarding for new team members. Onboarding steps: - Initial setup guide - Training materials - Practice exercises - Mentorship program ### Code Review Guidelines Effective code review practices for quality assurance. Review checklist: - Correctness - Performance - Security - Maintainability ## Troubleshooting Guide ### Common Issue 1 Detailed troubleshooting steps for frequently encountered problem. Resolution steps: 1. Identify symptoms 2. Check configuration 3. Verify dependencies 4. Test solution ### Common Issue 2 Another common issue with comprehensive resolution approach. Diagnostic steps: 1. Reproduce issue 2. Gather logs 3. Analyze data 4. Apply fix ### Common Issue 3 Third common scenario with clear resolution path. Investigation process: 1. Understand context 2. Review recent changes 3. Test hypotheses 4. Implement solution