By Joan Wanini Maina.

Software testing is the checking of software to ensure it works as expected. This is done during and after development of the software.

Why software testing? You might wonder, but imagine having a faulty e-commerce website and customers get to be overcharged or undercharged. This might affect the business, customers and stakeholders of the business. Some advantages of testing are that the software gets to be secure, scalable, reliable, high quality and have a good user experience.

There are several types of testing which include different stages of testing.

• A unit test involves testing a single small component of the software. Programmers mostly do this to ensure their functions or methods are working as expected.

• Regression Testing checks to ensure that a new component works as expected and it did not break the existing components.

• Smoke Testing is done to make sure that the software under testing is ready or stable for further testing. It is called a smoke test as the testing of an initial pass is done to check if it did not catch the fire or smoke in the initial switch-on.

• Stress Testing, involves giving unfavourable conditions to the system and checking how they perform under those conditions.

• Performance Testing or load testing is designed to test the run-time performance of the software in an integrated system. It is used to test the speed and effectiveness of the program using a given load.

• Acceptance Testing is done by the customers to check whether the delivered products perform the desired tasks or not, as stated in the requirements. Some people might refer to it as user acceptance testing (UAT).

As technology advances, there is a reason to automate the testing processes. Normally, people would have to test the software manually. Automated tests save time and prevent boredom from doing repetitive testing.

In this article, I will include a walkthrough of automated testing using Cypress. Cypress is a javascript framework that is used for end-to-end testing. Cypress can run on browsers and therefore, it is easy to use in testing websites.

Getting Started with Cypress

To run Cypress, you need to have Node installed in your machine.

On your terminal, navigate into your test folder and run the following command:

npm install cypress

Add the following code you your package.json file:

"scripts": {
    "cypress:open": "cypress open"
  }

Once this is done, run cypress: open

Choose between E2E Testing (where you run your whole application and visit pages to test them) Or Component Testing (where you mount individual components of your app and test them in isolation).

To create a test file, click on create new spec.

You can now write your cypress test code on spec.cy.js file.

Sample Test Demo

Here is a sample of the login page in React that demonstrates some concepts in Cypress.

<form className="form" onSubmit={(e) => submit(e)}>
              <h3>LOGIN</h3>
              <label>Email</label>
              <input
                id="email"
                type="text"
                placeholder="enter email"
                required
              />
              <label>Password</label>
              <input
                id="password"
                type="text"
                placeholder="enter password"
                required
              />

              <button 
        classname=”loginbutton”
 >Log In</button>

</form>

The Cypress test is as follows:

describe('empty spec', () => {
  it(“correct login”, () => {
    cy.visit('OUR_URL_HERE')
    cy.get(‘#username).type(YOUR_USERNAME HERE);
    cy.get(‘#password’).type(PASSWORD_HERE);
    cy.get(‘.loginbutton’).click();
  })
})

In cypress, the visit() method is used to navigate to a defined URL page. Different attributes can be used to access elements. However, ids are preferred when accessing elements since they are more specific. To get the input to enter the username, it will access through the id. To enter the username and password, the method type() is used and it takes in the text. The last part is accessing the log-in button which used a class name and click() method to click on the button.

You can customize your tests to do so much more e.g: check whether it redirects to a specific URL, or check if an error message is displayed. I hope that you have learned something.

To dive deeper into Cypress, check out this link: docs.cypress.io