Bordo Group

Tools and Approaches for Frontend Testing

Testing is a fairly reliable way to catch errors at the development stage and save nerves during the operation of the software.

The scope of testing, as well as the scope of programming, is very broad. There is no ready-made algorithm, and many technologies and solutions depend on the tools on which we conduct testing. Unit testing, end-to-end testing, integration testing can be implemented. Integration and unit tests are usually conducted by developers. End-to-end testing is done by testers who write automated tests.

If we talk about the tests that developers are doing, it all depends on the frameworks (Angular, React, etc.). For Angular, many companies use Karma and Protractor tools, for React – Jest, and Enzyme. Integration testing is done on the same things.

The main tool for end-to-end tests, as a rule, is Selenium. Next comes a high-level wrapper, more accessible to users. This may be Puppeteer, Cypress, Webdrive.io, and others.

For Java, it’s better to use the Selenide framework, which scales easily and has several useful features that work out of the box. For example, convenient integration with Allure, which we use to collect and analyze test results. There is no big difference on what to write autotests, it can be done in any language, so see what is closer to you. Frameworks like Puppeteer and Webdriver.io are suitable for people who can write code. Cypress frameworks have UIs for testers and are more friendly. But to use most frameworks, you still need to learn a programming language. After you have chosen a framework, you should definitely read the documentation.

To determine the number of tests for each of the groups, there is a test pyramid that groups the necessary tests by different levels of implementation (many Unit tests, fewer integration tests, and a little E2E). In practice, this pyramid is not always the best approach. The fact is that in a rapidly developing application, the functionality often changes, business requirements expand while affecting the modules written before, and some features may not even reach the deployment in production. Therefore, covering all the functionality of an application with tests does not always make sense. The pyramid, in this case, can stand upside down.

To implement effective testing, there are TDD (Test Driven Development) and BDD (Behavior Driven Development). These are special extreme programming techniques when the developer first writes the tests, and then the code that will satisfy the technical requirements or user scripts. In real life, this approach is effective but difficult to maintain and implement, for example, if you have a distributed development team.

Popular test libraries for front-end developers are Jest for integration and unit tests, and Puppeteer or Cypress for end-to-end testing. When working with Angular, Karma, and Jasmine, as well as Protractor for end-to-end, are most often used to write tests. In addition to shared libraries, each framework has specific testing approaches.

To sum up

When choosing a tool/approach, it is recommended to study the approaches and documentation for testing your framework.