E2E testing with Cypress.io

What is Cypress.io

Cypress.io is a fast and effective tool for writing and carrying out testing for web applications, which also supports CI/CD for DevOps on GitHub Actions, making it a perfect match for our requirements.

Cypress.io also supports testing platforms for Firefox, Microsoft Edge and Electron, of which we have tested on all of them for compatibility checks.

End to end tests

End to end testing aims to simulate an actual user that is using our application through cypress commands in a rapid manner. All tests written are located in the cypress/integration folder with the frontend folder.

Login E2E Test Example

Here is an example of a cypress test, which is intuitive as each line represents an assertion or a user action such as typing into an input field.

Passing Tests

We have managed to pass all 26 use cases, for better demonstration, we have also attached a video for the entire E2E testing process

Testing Demo Video

As you can see Cypress is rapidly interacting with the application doing what an actual user would have done in many different use cases.

Testing Coverage

We have managed to acheive an overall 92.3% statement coverage for our tests

The report below is generated by @cypress/code-coverage with the source code instrumented using @cypress/instrument-cra and each "file" represents the folder containing the components.