Web Testing with Cypress: Run End-to-End tests, Integration tests, Unit Tests Across Web Apps, Browsers and Cross-Platforms 9789355510280
Perform fast, easy and reliable cross-browser testing with practical demonstrations. Key Features: - Access to Visual t
494 115 3MB
English Pages 209 Year 2022
Table of contents :
1. Introduction to Cypress
Introduction
Structure
Objective
What is Cypress?
The Web has evolved
Testing has [evolved] too
Fast, easy, and reliable
Testing for anything that runs in a browser
Installing Cypress
Prerequisites
Installation
Directories' structure(9)
cypress.json
Cypress core concepts
Closures
Variables and aliases
Commands
Network interception
Stubs
Mocks
Waiting
Spies
Test runner
Command-line tools
Screenshots and videos
Cypress Studio
Adding a new test
Adding commands to existing test
Conclusion
References
2. Cypress vs. Selenium WebDriver
Introduction
Structure
Objective
Selenium WebDriver
Modern Web testing challenges
Supported programming languages
Cross-browser functionalities
User interactions emulation
Working with IFrames
Cypress tradeoffs
Conclusion
References
3. Write Your First Tests
Introduction
Structure
Objective
The Real-World App (RWA)
Installing RWA
Starting RWA
Techniques to locate elements
The id attribute
The class attribute
Custom attributes
XPath
Interaction with DOM elements
Text inputs
Button
Checkbox
Interaction with forms
State assertions
The initial state
Complex test scenarios
Conclusion
References
4. Advanced Testing Techniques
Introduction
Structure
Objective
Behavior-Driven Development (BDD)
Cucumber
Cucumber in the testing world
Installing Cucumber
Gherkin
Step definitions
Scenarios for RWA
signin.feature
Going beyond Cypress' boundaries
E-mail confirmation flow
Installing the gmail-tester library
Modifying the RWA code
Writing the spec
Visual regression testing
Installing the pixel match library
Configuring the library
Writing the spec
Conclusion
References
5. Introducing CI/CD
Introduction
Structure
Objective
Understanding CI/CD
The role of Cypress in CI/CD
Defining and setting up CI/CD pipelines
The CI pipeline
CI on developer's machine
CI on a dedicated server
Self-hosted Actions Runner installation
The CI workflow
The tests job
The build job
Triggering the CI
The CD pipeline
Conclusion
References
6. Introduction to Cypress Dashboard
Introduction
Structure
Objective
Set up the Cypress Dashboard
Cypress Dashboard in the CI/CD phase
Adding the Cypress Dashboard to CI/CD pipeline
Conclusion
References
7. Integration of CI/CD into Existing Projects
Introduction
Structure
Objective
Example 1: Volt React Dashboard Bootstrap 5
Step 1: Clone the repository
Step 2: Learn the project
Step 3: Manual execution
Step 4: Add the CI workflow
Step 5: Add the CD workflow
Example 2: Angular RealWorld example app
Step 1: Clone the repository
Step 2: Learn the project
Step 3: Manual execution
Step 4: Add the CI workflow
Step 5: Add the CD workflow
Example 3: Vue Multi-Select
Step 1: Clone the repository
Step 2: Learn the project
Step 3: Manual execution
Step 4: Add the CI workflow
Step 5: Add the CD workflow
Conclusion
References
8. Working with Tests as a Team
Introduction
Structure
Objective
Tests in Agile methodology
Shift left testing approach
Cypress tests troubleshooting and debugging
The pause() command
The debug() command
The debugger statement
Flaky tests
Practical tips
Conclusion
References
9. Cypress Driven Development (CDD) Approach
Introduction
Structure
Objective
The Test-Driven Development (TDD) approach
Example: A JavaScript function that sums two numbers
Step 1: Writing a test
Step 2: Running the test
Step 3: Writing the code
Step 4: Running the test
Step 5: Writing the code
Step 6: Running the test
Step 7: Writing the code
Step 8: Running the test
TDD: pros and cons
The Cypress-Driven Development (CDD) approach
Example: A login form with custom validation
Step 1: Write a test
Step 2: Run the test
Step 3: Add some markup
Step 4: Run the test
Step 5: Write a test
Step 6: Add some markup
Step 7: Run the test
Step 8: Write a test
Step 9: Add some code
Step 10: Run the test
CDD: pros and cons
Conclusion
References
10. Tests for Product Managers Using Cucumber
Introduction
Structure
Objective
Why testing is important for the organization?
Behavior-Driven Development (BDD) use-cases and scenarios
User journey scenarios
Backend-related scenarios
Conclusion
References
Index
